Radio Buttons
- 50541507
- Mar 21, 2022
- 3 min read
I reused the map checkbox buttons in the New Game section of the Campaign screen, but since the map buttons work independently from each other, I had to adjust the base widget blueprint to add radio button support, where only one out of a group can be selected at a time. These changes were:
Making the button not uncheckable
Only playing a certain animation if it isn't a radio button (otherwise "snapping" happens)
Creating a new custom event for playing two animations to make it easier for parent widgets
The parent widget's blueprints are very similar to how a tab system works, since it's more or less the same thing. For each button that's clicked that isn't selected, it deselects the last selected button.

After some feedback from peers, I decided to add some information on the button about what the difficulties change about the game (like making the enemies deal less damage, etc.). The first way I tried to do this was tough. Harrison suggested that I use text in the bottom right so it's in the strip, however this created issues at 4:3 resolution where the text would move into the checkbox, or wrap and no longer be aligned. I then tried using a Named Slot, something that I haven't used much but know enough of to warrant trying it. A Named Slot essentially adds a child to the widget which can be added to in parent widgets. The only limitations of them are the properties you can change about them. You can't, for example, choose if the slot contains a certain widget, to then change something about that widget. Everything in the Named Slot is treated widget agnostically, so those are the only properties you can edit, the widget agnostic ones. This isn't too bad for me however, as I only wanted text to be in there anyway, and I'd just animated a fade and scale effect for hovering and unhovering.


There was another barrier in my way though, the brighten effect. Since the text is white and a lot smaller than the title text on the button, it was a lot harder to see, so I wanted to make the object that does the brightness instead make it go darker. This was easy actually, as I could just make the colour of the object an instance editable variable, and change it on a button-by-button basis. I also set the lerp values of the animation of it fading to be instance editable variables too, as I wanted to allow it to be more opaque than the brightness effect. I also wanted it to fade in on hovering instead of only when it's selected, as the text fades in on hovered too. I achieved this with a Branch in the hover animation blueprint which checked if the widget was a radio button, and if so, played the animation. Since the multiplayer map buttons were not set as radio buttons, this animation won't play for them. A "snap" occurred when selecting the difficulty from hovering, because the selected animation started the lerp from 0 instead of the hovering opacity. I couldn't just set the 0 to be the hover opacity because then that would break the multiplayer map buttons, so I instead used a Select Float to check if the button is a radio button, and Pick A if it was, and Pick B if it wasn't. This allowed me to make a more-or-less perfect difficulty radio button set for the campaign menu.





Comments