Item Context Menu
- 50541507
- Mar 28, 2022
- 3 min read
Updated: Mar 30, 2022
To be able to make use of the items in the player's inventory, a context menu needs to be made to let them do things like equip it, inspect it, rename it and sell it.


When asking others which style they preferred, everyone said the second, even Harrison, who was very reluctant to answer because he said it was "not at all important". Oh well. Anyway, I made the button widget, then used a list of those to make the menu itself, then put that in a Menu Anchor widget in the inventory item widget and opened it when clicked on. So the hierarchy is like this:
- Context Menu Button
- Context Menu
- Menu Anchor
- Inventory Item
The only problem with using a Menu Anchor and not just creating it is that I can't then easily access elements in the context menu (if I can access them at all) as there is no reference to it from the Menu Anchor, so I can't dynamically change what the context menu shows (like removing the Equip for T button on CT-only weapons and vice versa, which would be very helpful for players). However not using a Menu Anchor introduces some other problems, like possible Z Order confusion in the engine and unfocus events, something that the Menu Anchor is very useful for, because without it, how does the engine know when the player has clicked off the item? This is something I forgot about when trying to make a custom Combo Box, and was one of the reasons why I didn't finish it, I couldn't get the Menu Anchor effect without using a Menu Anchor.
Actually ignore that. After researching it a bit, I found that instead of setting the Menu Class in the Details panel, if I instead created the widget in the OnGetUserMenuContent function, I could bind that to the Menu Anchor, and that would let me get a reference to the context menu, allowing me to change certain things, like the equip buttons. So I created a new Enumeration which held which side/team the weapon was for (Terrorist/Counter-Terrorist/Both) and changed the visibility of the buttons depending on which was selected for each item.

I at first put this in the Construct event though, which runs before the function that creates the context menu, so it causes errors. After realising this and instead calling it when the Menu Anchor is opened, I successfully was able to customise the contents of the context menu while still using the Menu Anchor.
I wanted to be able to change the text colour of the menu to be the same as the item's rarity colour as to give players more of a sense of customisation and therefore uniqueness compared to common items. This involved making an array which held all the menu items in and can be referenced in other widgets (like the InventoryItem widget) to call functions. I called a function I made called "ChangeColour" which just sets the colours of the elements in the item button to a certain colour set when the function is called, so I used a Select node to choose which colour to use for which specified rarity, and because I did it this way, I can easily add elements and change the colours without error or lots of work.

After getting some feedback from different people, Harrison suggested to add a gradient to it, which I did, and changing the colour of that was really easily, as I could just add it to the end of my function and that's it.

I do like this effect, however it makes the text a bit harder to read (could make the background darker to fix that) and the transition from colour to background looks grey, which makes it less crisp and sharp.
I took away the highlight on hover and made the gradient slightly more transparent to make the effect less prominent so the text is more readable, and I think it works great.



Comments