---Some Category---
[x] Some Category Option 1
[ ] Some Category Option 2
---Some Other Category---
[ ] Some Other Category Option 1
[x] Some Other Category Option 2
Where the options look like buttons/selections and the selected ones stay “highlighted”. I’ve tried using buttons, but there’s no way of changing the state of the button to the highlighted state except referencing the button’s image and changing it to the state’s highlighted sprite. But this messes up the sprite swap after. I’ve tried using Toggles, but even using multiple Toggle Groups, you can only select one toggle at a time. Even the ones from other toggle groups get deselected. Is there really no way of doing this?
Documentation says you can have more than one, but why is it not working then?
at a time, so you can create several separate groups if necessary.```
I’am having this issue as well. I have two ToggleGroups. One toggle group is assigned to 2 toggles. And the other toggle group is assigned to 4 toggles.
Clicking one toggle, un-toggles any of the other ones regardless of the groups assigned
I am in the same boat and I have figured out a workaround to this problem, first allow me to explain what is happening
Currently the way toggle groups work is you can have one active toggle at a time in any group, now what is happening in our situations is the sprites change, when we select a toggle the selected sprite of the button (or toggle) shows up but when we press anywhere else on the screen or another toggle from another group the selected toggle in the previous group changes its selection sprite to default state (the toggle’s background sprite)
In reality the toggle is still pressed its just that the sprite had to change because the user pressed somewhere else on the screen. You can check this by looking at the “isOn” state of the toggle while testing the toggle behaviour, the “isOn” state remains true (checked) for the selected toggle even if its sprite changes to default state after pressing somewhere else on the screen.
This “isOn” is exactly what I used as a workaround.
This is what I did
public Toggle[] togglesArray = new Toggle[5]; // add all toggles to an array of the desired size
// Now iterate over the “togglesArray” and change each toggle’s sprite based on its “isOn” state
void UpdateToggleSprites()
{
int size = togglesArray.Length;
for (int i = 0; i < size; i++)
{
Toggle toggle = togglesArray[i];
if (toggle.isOn)
toggle.image.sprite = toggle.spriteState.selectedSprite;
else
toggle.image.sprite = toggle.spriteState.disabledSprite;
}
}
// Make sure you add the default sprite to the disabled sprite state in the inspector for each toggle Now its upto you whether you want to call this method from void Update() or from void FixedUpdate(). I went for the later because it is run flat 50 frames per second instead of 60 or 120 frames based on device screen refresh rate Even still I forced the method to run only 10 frames per second within the FixedUpdate() so that the actual sprite swaps happen 10 times a frame instead of 50 times a frame, I couldn’t see any flickering or delayed behaviour and it is less programatically intensive than 50 frames per second Here is the FixedUpdate() code // Declare “_lastSpriteUpdate” as a global float
Toggle when “on” displays an image (a check in the box in most case) and do not rely on tint color.
You can have the correct behavior by adding an image representing the “on state” and set it on the toggle property in inspector called “Graphic” (alpha=1 when on)
Thanks “qoqgames”, I have to say i did try the “Graphic” element in the toggle component but i was unable to assign an image sprite at the time, my mistake was I was assigning an image sprite directly but I guess you can only assign gameobjects with image components to this “Graphic” element and assign the required selectable sprite to this image object
Doing this makes the toggles work as intended and no need to write additional code for it. Thank you!!!
Edit: Found a much easier and better way, here it is
When you create a toggle a “Background” object is created inside the “Toggle” object, inside this “Background” object is a “Checkmark” object. Both these Background and Checkmark objects have image components assigned to them. Just replace the checkmark image’s “Source Image” to your desired selected state sprite and replace the background image’s “Source Image” to the desired disabled state sprite, and thats all!!!
Your Toggles will now work as intended, whether on their own or in a Toggle Group
P.S. The checkmark object is already assigned to the Graphic element of the Toggle object so that’s why it works without you needing to assign anything to the graphic element or creating additional image components
hey there, so i had the same problem.
i had an empty gameobject which had two childs and each childs had its own toggle group.
if i press a toggle, the toggle from the other goup gets unchecked.
so i found the problem:
we all wanted to be smart and thought we dont need the checkmark
so yeah, in my case i didnt need checkmarks, because i just wanted to color tint it.
but it didnt work.
so i used sprite swap.
but it didnt work.
so i put the checkmark back in and used spriteswap.
in that case the child “background” is ur normal state of the toggle and the checkmark is the selected state.
just change the checkmark with your image that represents the “checked” state of the button.
thats it.
This will not work properly. The transitions are only for selection states, not toggle states. when clicking a selectable (like a toggle). The selected state will remain as long as you don’t click anywhere else.
I created an Asset (Better UI - see signature) which allows you to assign individual transitions for toggle states. Without my asset you will have to listen to the onValueChanged event and do the sprite swap in code.
