top of page

Improving the Queue Button

  • 50541507
  • Mar 23, 2022
  • 2 min read

Updated: May 16, 2022

After wanting to make the Queue and Cancel buttons in the multiplayer screen more satisfying to use, I created two animations which played similarly to CS:GO "GO" button:

These work fine, because I have two buttons for it instead of one now, one for Queue, and one for Cancel, which means I no longer have to change the colour and text in Blueprints each time. After showing Harrison, he suggested to add hazard lines in the Cancel button, which I thought would be easy, considering I had set a Named Slot for the button to be used for something like this. I ended up having to reorder the Named Slot in the button widget to be behind the text and bottom line, as well as redoing some blueprints to make it so I can have both the text and the Named Slot visible at the same time. After doing this however, I tried to make the hazard lines.


I started out with a Horizontal Box with lots of images in. I skewed the Horizontal Box which gave the effect, but the Canvas Panel clipping wasn't working very well on it, and I realised I couldn't animate it this way either, so went for an image approach. I made a repeatable hazard image in Photoshop, and imported it into UE4.

I made a new widget blueprint just to animate it, which I did by having lots of images at the correct size in a Horizontal Box (making sure not to Fill them), and I then animated the Horizontal Box's translation which loops endlessly from Event Construct.

Then I put that widget in the Cancel button's Canvas Panel in its Named Slot and clipped it to bounds - Always (Advanced) which is useful for animations like mine where it should never not be clipped. This was the result, and I feel it's quite good, and so does Harrison.

The speed of the hazard lines may need adjusting, but for now it's great.

 
 
 

Comments


bottom of page