I create a set of prefabs at runtime via script. They are held in an array called newObj. Each one has some text UIs and some buttons, which I retrieve with GetComponentsInChildren. When a user clicks the first button in the prefab, I want to run a function that changes the text of the button and highlights that button.
Everything is working except the button doesn't highlight.
public void SelectPlayer(int rowSelected)
{
var buttons = newObj[rowSelected].GetComponentsInChildren<Button>();
var texts = newObj[rowSelected].GetComponentsInChildren<Text>();
texts[0].text = "1";
buttons[0].Select();
buttons[0].OnDeselect(null);
}
Oops. I'm still new to Unity and forgot that Unity sets the default highlight color to white (for some reason). Once I changed it for my prefab using the editor, all was well.
Related
As part of my GUI in C# (.Net 5.0) I'm using the RichTextBox control (part of System.Windows.Forms) to display text and clickable links. My problem is when I click any links included without the form first having focus the act of clicking a link also focuses the textbox which automatically places the caret at the start of the text, this has the effect of making the textbox jump (or scroll) to the very top of document, losing one's position.
For my particular problem, the RichTextBox classes are assigned to TabPages within a TabControl- and all three of these components are created in response to user interaction (I understood the creation of these at runtime might limit the types of event handling available to me).
I've defined the RichTextBox control with multiline and both horizontal and vertical scrollbars, and to enable clickable links I'm using the DetectUrls option. Here is the full list of properties being used.
var control = new RichTextBox();
control.DetectUrls = true;
control.Dock = DockStyle.Fill;
control.Multiline = true;
control.ReadOnly = true;
control.WordWrap = false;
control.Text = myContent; // large content filling multiple screens
control.ScrollBars = RichTextBoxScrollBars.Both;
control.LinkClicked += new LinkClickedEventHandler(RichTextBoxLinkClicked);
I've included the LinkClicked because I want to provide some interaction for the user, but whether this handler is assigned or not doesn't seem to influence the problem.
Edit1 I came up with a solution that works to some extent; it prevents the scrolling by placing the caret at the beginning of the link (It doesn't work well though if there are more than one of the same link)
private void RichTextBoxLinkClicked(object sender, LinkClickedEventArgs e) {
int caret = ((RichTextBox) sender).Text.IndexOf(e.LinkText);
SelectionStart = caret;
}
Edit2 A second solution that I found is to set the focus of the text-box on a MouseEnter event. I've come to think the key to the problem is to set the focus of the text boxes before any user interaction takes place, but I'm having problems finding a satisfactory way to achieve it.
I want to click a button and change its text's color and message properties.
I got the button to change its color, but I need to change one of its text's colors.
private void TurnGreen(Button button)
{
ColorBlock colors = button.colors;
colors.normalColor = Color.green;
button.colors = colors;
}
The above code changed the button's color which I liked, but I would rather change the button's text. Note however that my button has two text-childs. The text I want to change has a name of "Ore".
Haven't done Unity for ages, so my knowledge is bit rusty.
Make sure using System.Linq; is set in your script.
// Considering that "button" is the one on which you clicked.
// By definition, we have 2 Text children (for single Text, we
// could use button.GetComponentInChildren<Text>().color directly, as it returns single element.
var oreText = button.GetComponentsInChildren<Text>().FirstOrDefault(o => o.name == "Ore"); // Unity allows same naming...
// I had 2 Text components initially returned: Ore and Wood.
// Got the Ore text component with FirstOrDefault. Now check it really exists and set color.
if (oreText != null) // Long way to compare. For illustration.
{
oreText.color = Color.green;
}
// Also, if "Ore" button really exists, you can directly set it from "Single" method:
// button.GetComponentsInChildren<Text>().Single(o => o.name == "Ore").color = Color.green;
A better way to do this might be to identify the text component in question from the editor (assuming your button is a Prefab), rather than iterating through the components via Linq. If you do it that way, it's scales a little better if you want to use that type of behavior on other components/buttons but don't want to have to change the Linq search text each time.
To do this, create a new field like this:
public Text textToChange;
Then drag the component in question form your button into your component script from the editor, then in code do this:
textToChange?.color = Color.green;
And then boom, you're done...the '?.' also checks for null for you without the if block.
I need to change the items placed in UI on basis of items clicked on.
User have to click on Name of the game then it will unable the existing item and enable the chapters item to show chapters.
Note: I don't need to change scenes, I know how to change scene with buttons.
I have attached the screenshot of the main menu.
Just create a reference of the gameObjects you want to Activate/Deactivate.
Create a button and use GameObject.SetActive to activate/deactivated the objects you want when the user press it.
You can make the button invisible so the user thinks he's clicking the title but actually he clicks a button.
I Hope this helps. :D
I suggest creating a button for every menu interaction in general.
To handle your buttons OnClickEvents you need to create an empty gameObject on your scene and attach to it a script that your buttoms will use to do whatever you want when you click them.
For example:
//You can name your method however you like.
public void ButtomClicked(){
//Hide the UI on the screen expect the Back button.
//Show chapters to the player
}
Create a button and from the inspector select the Empty Gameobject this script is attached to and then select the ButtomClicked method. When you press the buttom the code in the method will run.
To avoid activating/deactivating all this buttons one by one, you can attach them to a panel(UI element) and activate/deactivate the panel istead. So, lets say you have 3 panels.
The Main menu panel, the Chapters panel and the Options panel.
When the player wants to see the chapters, you diactivate the main menu panel and activate the chapters panel. To make this feel really polished you can add transition animations later on.
This is how i handle my UI without never changing scenes. It gives a really smooth and polished feel to the user.
If you have more quastions about UI, plz watch this turtorial, it helped me a lot to understand the basics.
In case of a Unity mobile app, would it be good (at all) for performance, to deactivate the navigation through canvas objects like TextFields and Buttons?
When selecting e.g. a Button or TextField in the sceneview, the inspector shows the option "Navigation", which can be set to different things and can also be visualized. This feature is usually used to tab through input fields, like you would expect it on a website. On my mobile game I don't need this "tabbing". Would there be any sort of performance increase if I deactivated it everywhere?
Would deactivating this rather be a waste of time, or even make
performance worse for some obscure reason?
Usually there are 3 ways to show and hide UI. I will list them from worst to best.
1.Instantiate (Show), Destroy (Hide).
public GameObject uiPanelPrefab;
void Start()
{
//Show
Instantiate(uiPanelPrefab);
//Hide
Destroy(uiPanelPrefab);
}
This creates and destroys Objects each time. (Not Recommended).
2.Activate (Show) or Deactivate (Hide) the GameObject of that UI.
public GameObject uiPanelPrefab;
void Start()
{
//Show
uiPanelPrefab.SetActive(true);
//Hide
uiPanelPrefab.SetActive(false);
}
This creates garbage each time it is set to active and also cause quick freezes. You will notice this a lot when making VR apps. Fine on Desktops. Not good or recommended on mobile devices.
3.Enable (Show) or Disable (Hide) the Component of that UI.
public GameObject uiPanelPrefab;
void Start()
{
//Show
uiPanelPrefab.GetComponent<Image>().enabled = true;
//Hide
uiPanelPrefab.GetComponent<Image>().enabled = false;
}
This simply enables and disables the components. This method requires a custom function for each UI Control such as Button, Text, InputField as each Control has different components attached to them. This is the recommended method especially on mobile devices.
After long experiment with these, I came to conclusion that #3 is the best and should be used.The downside is that you have to make a function that will disable every components of each UI Control.
For example, the Button Control has more than 1 components. Simply disabling the Button component will not do it. You have to write a simple function that will disable Button, Image and Text components. Something like below:
void showButton(GameObject button, bool show, bool includeInactive = false)
{
Button bt = button.GetComponentInChildren<Button>(includeInactive);
bt.enabled = show;
Text txt = button.GetComponentInChildren<Text>(includeInactive);
txt.enabled = show;
Image img = button.GetComponentInChildren<Image>(includeInactive);
img.enabled = show;
}
Usage:
//Show
showButton(uiPanelPrefab, true);
//Hide
showButton(uiPanelPrefab, false);
I can confirm, that deactivating the navigation of UI elements has no performance influence. Behind the scenes there's just a handler, that gets triggered, when you hit "tab" on pc, or analogeously on mobile.
Looking at some of the answers in the Unity forums and Q&A site, the answers for how to make an invisible button do not work because taking away the image affiliated with the button makes it not work.
How do you get around this and keep the invisible property while allowing the button to actually work?
This is one of those weird things about Unity...
100% of real-world projects need this, but Unity forgot to do it.
Short version:
You need Touchable.cs in every Unity project:
// file Touchable.cs
// Correctly backfills the missing Touchable concept in Unity.UI's OO chain.
using UnityEngine;
using UnityEngine.UI;
#if UNITY_EDITOR
using UnityEditor;
[CustomEditor(typeof(Touchable))]
public class Touchable_Editor : Editor
{ public override void OnInspectorGUI(){} }
#endif
public class Touchable:Text
{ protected override void Awake() { base.Awake();} }
Use Unity's ordinary 'Create Button' editor function
As you know, the editor function adds two components for you automatically. One is a Text and one is an Image...
Simply delete them both
Drop the above script Touchable.cs on the Button
You are done. That's all there is to it.
It cannot "decay" with Unity upgrades.
You can actually "buttonize" anything in .UI by dropping Touchable on top of it.
Never again "add a transparent Image" to make a button.
Unity forgot to abstract a "touchable" concept in the OO chain.
So, us developers have to make our own Touchable class "from" Unity's classes.
This is a classic "backfilling" problem in OO.
When "backfilling" the only issue is that: it must be perfectly auto-maintaining. There is only one good solution, Touchable.cs, which everyone uses.
So in all real-world Unity projects a button looks like this:
ONE You have Unity's Button.cs
TWO you have to add Touchable.cs
Some teams make an editor function "Create Better Button" which simply makes a game object, with, Button.cs + Touchable.cs.
Important tip...
Say you may have a very complex UI panel. So it resizes or even has an animation.
In fact, you can just drop "Button+Touchable" on to anything like that, and it will work.
Just set the Button+Touchable so as to expand to fill the parent. That's all there is to it.
In this example image, "resume" and "quit" could be anything. (An animation, a complicated panel with many parts, text, sprites, something invisible, a stack - anything.)
In all cases, just drop a Button+Touchable underneath and you have a flawless button.
In fact: this approach is so simple, you'll probably use it for even simple cases.
Say your button is a trivial image. It's much easier to just have an image, and then drop a Button+Touchable on it. (Rather than use the confusing and problematic "Button" function in the editor.)
Understanding the situation...
1) Unity's Button.cs class is fantastic.
2) But the editor function "make a Button" is garbage...
3) It makes an "upside down" button,
4) i.e., it puts a text/image under Button.cs
5) "Button-ness" is something you should be able to add to anything at all. This is precisely how it works with Button+Touchable.
6) So - quite simply -
1. Have anything you want. Text, image, panel, invisible, animation - whatever.
2. Drop Button+Touchable on it - you're done.
That's how everyone does all buttons in Unity!
Historic credit: I believe Unity forum user "signalZak" was the first to think this out many, many years ago!
As a possible improvement to Fattie's answer, changing Touchable's base class to Graphic and overriding protected void UpdateGeometry() seems to work quite nicely white reducing the (admittedly minor) overhead associated with Text.
public class Touchable:Graphic
{
protected override void UpdateGeometry() { }
}
My first solution was to enable and disable the components like below:
void showButton(Button buttonToShow, bool show)
{
Image bImage = buttonToShow.GetComponent<Image>();
Text bText = buttonToShow.GetComponentInChildren<Text>(); //Text is a child of the Button
if (bImage != null)
{
bImage.enabled = show;
}
if (bText != null)
{
bText.enabled = show;
}
}
but that didn't work. If the button's image and text components are both disabled, the button click event will NOT fire. One of them MUST be enabled in able for click events to be sent.
The solution is to set the alpha of both the image and text components to 0 to hide and to 1 to show again. They will be hidden but not disabled and click events will work.
public Button button;
void Start()
{
//Show Button
showButton(button, true);
//Hide Button
//showButton(button, false);
}
void showButton(Button buttonToShow, bool show)
{
Image bImage = buttonToShow.GetComponent<Image>();
Text bText = buttonToShow.GetComponentInChildren<Text>(); //Text is a child of the Button
if (bImage != null)
{
Color tempColor = bImage.color;
if (show)
{
tempColor.a = 1f; //Show
bImage.color = tempColor;
}
else
{
tempColor.a = 0f; //Hide
bImage.color = tempColor;
}
}
if (bText != null)
{
Color tempColor = bText.color;
if (show)
{
tempColor.a = 1f; //Show
bText.color = tempColor;
}
else
{
tempColor.a = 0f; //Hide
bText.color = tempColor;
}
}
}
I fired up Gimp (that free coder graphic tool). Created new image (any size, I chose 10 pix x 10 pix), selected from advanced (in create dialog) that it's backgroud should be transparent. Saved the file. Exported it as png with save backgroud color selected. Dragged it into Unity as sprite. Put that to the button graphic. Disbaled the text-component of the button. No code required ... just don't draw anything while in Gimp (that was the hardest part).