I have 2 Canvas: one for Login, one for Register.
This is Canvas of Login:
When register button is clicked, i change and call Register Canvas:
But it gets blurry. I use same Unity config in both Canvas.
I disable and enable Canvas via C# script:
void TaskOnClick()
{
CanvasLogin.enabled = false;
LoginValue.text = "";
PasswordValue.text = "";
CanvasRegister.enabled = true;
}
The problem only occurs when I enable Canvas via command/script, if Canvas start enabled, the blurry dont occur.
Scale Config:
And it's funny that during the execution if I change the aspect of the screen and return, the text backs to normal...
The problem is not with second canvas, the problem is when i enable it
via command/script
I just came across this same problem and as this was the first result when I searched I'll add my answer. I had a GameObject with Canvas and CanvasScaler components.
I found that you if you disable / enable a Canvas at runtime you need to update the CanvasScaler too. In my case I disabled / enabled the CanvasScaler also. Setting any value on the CanvasScaler would probably set it to dirty and cause update.
As your problem is only with one of the canvases, you might want to check the attached Canvas Scaler components. It seems like the scaling on the second canvas is not correctly configured.
You can just copy all of the component's values from your first to the second canvas, with the dropdown menu from the little gear icon in the upper right corner of the component in the inspector window.
The easiest way:
use gameobject.SetActive() instead of canvas.enabled
Related
I am trying to do something like X and O game, and I want the image of button be showed if it was pressed but it's not working, I made sure that button is working by reversing the command it worked fine! Here is screenshot
I tried to reverse the command and it worked so the button is working fine
Have in mind that a UI.Button requires at least one active and enabled visual component (Image/Text/etc) with RaycastTarget enabled ... I suspect since you disabled the image you simply disabled the interactions with this button
=> solution could be to simply have two Images like e.g.
- Button (with Button + Image component)
|-- Icon (with Image component)
The Button object is your main button with a background image - can be completely transparent, but can also react to interaction and have color for hover, press etc. This you always leave enabled and here you enable the RaycastTarget.
Then in Icon you assign the according circle or cross sprite and can enable / disable it accordingly. Here you can also deactivate the RaycastTarget to save some performance. You could even have two different child icons according to the sprites then you don't need to assign the sprite on runtime either but just activate according child object
Here is my UI structure in the Hierarchy:
And here is how it looks:
So basically, when I click the first button, its color changes on click as expected. However when I click the second or the third one, the first one also displays the click animation, instead of the one I clicked.
Here are some things I noticed:
The buttons do register a click as expected.
When animating the button further than the default (by using custom timeline animations) the behavior is slightly different between the first and the second + third ones.
Things to note:
I am using a horizontal layout group on the panel with the following settings:
Each button has a TMP image inside with the same size as the button itself.
I theorize that the HLG is the problem here, but I've tried many settings and the result stayed static.
If you need any additional information, please ask.
Turns out the problem was that the target graphic on the buttons were all set to the first one. That's why they still registered the click properly even though the visuals were messed up.
I have made the program so that, once the level is done, a panel will pop up and this button is attached. However this button is not working.
I have - Checked my eventsystem, Checked Raycast Settings, Set the onclick event, Also brought the button out on the z axis so that it would have no interference from the panel.
My Hierarchy
Button's Inspector
Canvas' Inspector
It's because you original color of the Image is completely black. The Button component just tries to tint the original color, but because it's black, you see no effect.
Oh, and... As #Glurth said, you have enabled Block Raycast on the CanvasGroup, so basiclly the Button doesn't even receive pointer events.
I see you have "Blocks Raycasts" configured for the Canvas group, which you have added to the canvas itself.
I don't think this component is supposed to go on the canvas itself anyway; it's intended to allow one to disable or hide groups of objects on your canvas. The "blocks raycasts" is intended to prevent clicking on controls that are behind this group, and collect clicks for the group itself. If you put everything on your canavas in this group, it will collect all the clicks for everything.
I found my problem, i had 'ignore parent groups' unchecked which did not allow the mouse pointer to recognise the button as it was a 'child' of canvas
Thankyou all for your help!
My Canvas Inspector component, Canvas Group
I see there is already some questions on this matter, but they are not using unity3d or are using the old UI method of unity.
I have a toggle button with a specific background and I want that background to change when the toggle is off. I tried to do this using the inspector and setting a function to apply a different texture to the button when it was off, but did not work.
Do you have any idea on how to accomplish this? I am attaching what I tried.
The background of a toggle is just an Image
so it's this simple, in a script have
public Image theBackground;
you can then change that in any way you wish!
if you wish, have a function
public Image theBackground;
public Toggle theToggle;
public void ChangeBackground()
{
if (theToggle.isOn)
... set theBackground as you wish ..
else
... set theBackground as you wish ..
}
which sets it appropriately. Look in the toggle and drag that function to the OnValueChanged.
Enjoy!
I just ran into the same problem. What I did to solve it was the following:
When you place the Toggle on the Hierarchy, you get
Toggle
Background
Checkmark
Label
What I believe the toggle script does is modify the checkmark object (to make it appear or not).
So I replaced the Checkmark components (Rect Transform and Image (Script)) with the Background components.
Basically, just Copy component > Paste component values from Background to Checkmark.
And then, switch the Image Colors for both to the desired colors. Now when you Toggle in-game, you'll see it changes colors.
I know it's been a really long time, but it might help others :)
Ok, I have googled, but maybe I put my search in weirdly. :/
I have a VB.NET WinForms application. I have the anchor properties set for all the controls so that it will resize all the controls to look decent when the form is maximized. (Haven't gotten around to manual resizing yet however).
Anyway, the problem:
I go to set the same properties for a button (testing with a single button for now) on the main GUI form/picture. When I go to run the program via F5, it looks decent. But when I maximize the form, the entire button covers up more than it should.
I've taken screenshots of the form so you can see a visual of what I'm talking about. :/
Before: http://zack.scudstorm.com/before.png
After: http://zack.scudstorm.com/after.png
What other propert(y|ies) do I need to set for the buttons to show up correctly? :/ (The buttons go over the boxes that say, for example, "1-1", "2-3", etc.
Thanks,
-Zack
Seems like you have anchored top-left and bottom-right when what you want is just top-left.
Edit: If it's just an image that does not change when the winform changes, then don't anchor your buttons at all. Just put them where they go. If you are scaling the image, then I would either detect the clicks on the image and do the scaling math or do the scaling math and set my buttons in code in the Form.OnResize event.
As it appears that your goal is just to be able to handle clicks on the "computers"...
One option that can be useful for this sort of task is to create an "overlay" bitmap (not displayed, but which is the exact same size as your source bitmap) which uses different colors to represent all the clickable regions. (e.g. (R=0,G=0,B=0) for computer 0, (0,0,1) for computer 1, etc)
You could even generate this bitmap somewhat automatically without too much trouble (If you have a mode where you can click the top left and then bottom right corners of the image to define a new region)
When the mouse is clicked, you can check the pixel at the scaled coordinates of the mouse position in the overlay and determine what their click corresponds to. This can be a lot easier than creating loads of controls, and makes it a lot easier to have clickable regions that aren't rectangular.