- Home /
How to create a scrollable inputfield
I am trying to add a scroll bar to an input field with no success so far.
The main issue is that the text component size doesn't change with the amount of text, which would allow for the scroll bar to detect what to scroll properly. Also when i change the size of the text area, the input field starts to get buggy.
Another option is to invoke a scroll directly when detecting a scroll wheel event. Any ideas how this might be accomplished?
I'm trying to do the same, please update this if you find a solution.
I got exactly the same problem
I do try mixing with Scroll View with no success.
The problem is input field is not extending the text field size so my scollbar has nothing to show...
Answer by BadUser · May 06, 2015 at 12:48 PM
Hello horiadev,
Create ScrollBar
Create InputField
Add ScrollRect component to InputField
Add ScrollBar to ScrollRect component (field "Horizontal/Vertical scrollbar)
Resize Text (Child of InputField) to your needs
Add Text to ScrollRect component (field "Content")
Add Mask Component to Inputfield
This is kindof useless for accepting user input. The concept works only if you have a existing text string and know it's size, but if your accepting user input, then how can you set the size of the text rect before hand? You would have to know how much text a user is going to enter. The problem with this solution, is that the textbox inside the InputField does not accept a ContentSizeFitter and does not automatically update it's own height when text is added. It only sizes to text that exists before it is rendered. And at that point, you may as well just use a panel with a text component, and not worry about the InputField container.
Answer by Orion_78 · Jan 05, 2016 at 03:22 PM
Ok, here is my solution for now :
using UnityEngine;
using System.Collections;
using UnityEngine.UI;
/// <summary>
/// Display text with a scrollbar if you are not in edition mode
/// Display an editable text (without scrollbar until Unity fix it) if IsEdition is true
/// </summary>
public class UIScrollableInputField : MonoBehaviour {
private bool _isEdition;
public bool IsEdition
{
get
{
return _isEdition;
}
set
{
_isEdition = value;
if (_isEdition)
{
_inputFieldEditeMode.text = TextToDisplay;
_textViewMode.text = "";
_inputFieldEditeMode.gameObject.SetActive(true);
_scrollView.gameObject.SetActive(true);
_scrollbar.gameObject.SetActive(false);
}
else
{
_inputFieldEditeMode.text = "";
_textViewMode.text = TextToDisplay;
_inputFieldEditeMode.gameObject.SetActive(false);
_scrollView.gameObject.SetActive(!string.IsNullOrEmpty(TextToDisplay));
}
}
}
private string _textToDisplay = "";
public string TextToDisplay
{
get
{
return _textToDisplay;
}
set
{
if (TextToDisplay != value)
{
if (_textToDisplay == null)
{
_textToDisplay = "";
}
else
{
_textToDisplay = value;
}
Debug.Log("display: " + TextToDisplay);
if (IsEdition)
{
_inputFieldEditeMode.text = TextToDisplay;
}
else
{
_textViewMode.text = TextToDisplay;
// Hide the dialogue is nothing to display
_scrollView.gameObject.SetActive(!string.IsNullOrEmpty(TextToDisplay));
}
}
}
}
[SerializeField]
private Text _textViewMode;
[SerializeField]
private InputField _inputFieldEditeMode;
[SerializeField]
private ScrollRect _scrollView;
[SerializeField]
private Scrollbar _scrollbar;
}
Answer by illa3d · Feb 09, 2017 at 02:04 PM
Posted a hacky solution to InputField with scrollbar here:
http://answers.unity3d.com/questions/932607/putting-a-multiline-inputfield-in-a-scroll-rect.html
Your answer
Follow this Question
Related Questions
How to prevent scroll from moving on text update? 1 Answer
Text Mesh Pro Input field cannot scroll to last line of inserted text. 0 Answers
How can I create a Multi line Input Field with Scrollbar? 0 Answers
Animation through Animator in unity 1 Answer
How can I divide www.texture data into multiple Texture2Ds? 0 Answers