Hey
@gamingislove -
As I go through my UI build, I’m starting to make some progress but have a question:
I have my own Choice Input Button for use in the Battle menu of the 3D Turn Based RPG template, and using a simple gradient tween script with the goal of animating the gradient of the button - but I only want this to happen when the button is selected. So say player highlights “Magic” - the button would then tween the gradient.
I can achieve this with a Sprite Swap on the button component, but as that is, it’ll only swap the image of the button to my selected PNG - so what I really need to do is have two separate buttons, one with the tween script and own without.
So in the ORK editor, under Battle Menu, you can select to add a Custom Input Prefab for different options - but when I do this, it chops 95% of the button away. Is this the right path to achieve what I’m looking for and there is just something wrong with my button? Or should I be using Animation under the button component and have to achieve this a different way then using a tween script?
I hope this makes sense.
Thanks!
To use animations, the Unity UI's Button component already has options for that, change the Transition to Animation, I think this uses Mecanim animations.
If you're enjoying my products, updates and support, please consider supporting me on patreon.com!
https://youtu.be/5pDzCt8d7og
Thanks!
You could e.g. make your custom button component based on Makinom's UIButtonInput component and implement your tweening there. That gives you access to checking if the button is selected or not.
Simply use your custom version of it for your button prefab instead of the default one.
If you're enjoying my products, updates and support, please consider supporting me on patreon.com!
If you're enjoying my products, updates and support, please consider supporting me on patreon.com!
If you have an event system setup that you need, it's probably best to make a prefab out of that and use it to let ORK/Makinom create it for you.
If you're enjoying my products, updates and support, please consider supporting me on patreon.com!
My goal is to simply make the Choice Input Button tween a gradient On Selection. So if you select Fight, Magic, Items etc in the Battle Menu, the button tweens a gradient to show its selected. I can do this with sprite swap transition for selected, highlighted etc on the button component with a gradient overlay, but it’s lifeless, just want that pulsing effect for UX.
I downloaded a UI asset called Super UI, it’s basically a tween library that replaces the Button component with a script called UIButton that is exactly the same, but allows for a tween. It works fine in my UI Prefab scene (UI environment edit scene) - but I can’t get it to work in the Battle Menu or anywhere else. It’s like it plays ONE FRAME and pauses - so you’ll see the start color of the gradient, select Magic, and cancel back to main command and the color shifted once. I also get an error that it’s trying to destroy the tween systems event system, which is what I said before. The tween library has a script called UIMaster that needs to reference the main canvas, and I think that’s where it gets stuck as I can’t assign the Canvas Makinom creates at runtime maybe?
Here is an example of my UI Editing Environment scene where it works, in play mode - and what the hierarchy looks like. No errors, button tweens as expected.
So the Canvas selection for Rect Transform here is the issue, im almost sure of it. The skin, ignore that, its to setup a default skin for things but has no bearing. Super UI dev is crazy helpful as well.
This is how it affects my actual Battle Menu - you see it is stuck on the green beginning of the gradient tween, however if I select something, it continues 1 frame into the gradient... weird. The blue gradient is the UIButton Transition set to Sprite Swap and for now I use that instead of the gradient tween, both examples in one picture. I just want to make that blue gradient tween through itself. Maybe a material or something instead, but I can't think of a way to do that ONLY when selected. Hope this is something simple.
If that all sounds like a mess, do you have a different idea of how I can achieve this effect without going a ui tween? Just simply want the button to animate a gradient only when selected. Is this simply using the animate transition and I’m struggling to figure that out? I’ve been stuck for days on end for hours just going crazy trying to make this work. Anyone else who can guide me here to - @Scyra - maybe you?
Thanks all!!
First set things back the way they were in the video where every button was tweening. Then disable the script component on the game object. Make an Enable Component schematic that can toggle the script back on. Go to UI Boxes > General Settings > enable Cursor Over Selection. Then select your battle menu UI Box, scroll down to Schematics > Own Schematics > Input Selected Schematic (enable component).
UI > UI Layers allow you to use a prefab to create a canvas for a layer.
So, set up a canvas prefab that's working with that special setup, use it for a layer and set the Event System in UI > UI System to None.
Though, since I don't really know how your 3rd party UI solution here works, this might only work for one UI layer (canvas).
If you're enjoying my products, updates and support, please consider supporting me on patreon.com!
It’s weird - it’s like it does the complete opposite of what I’m trying to make it do. Tween on deselect and stop on select hahaha. Can’t wait to iron this one out.
GiL - I’m sure I’m missing something elementary here with that script, and why it still works disabled. Will this hurt me running like that down the road?
Lastly - please see it in action (sorry, too lazy for a screen grab video, iPhone will do lol) — for some reason though the very first selected button will not start to tween until I manually make the first selection with gamepad - I believe I have the auto select on in UI - UI Boxes - General. Any way to ensure it is indeed selecting it?
I got here thinking my issue was using a gamepad as I noticed the mouse would work on hover. Man. The basics.
*Edit - scratch the issue with first selection. Added a couple lines of code and fixed that. Good good, just need to figure out what’s up with UI Button Input
I.e. remove the Button component and use your UIButton component in ORK's UI Button Input component as Button.
If you're enjoying my products, updates and support, please consider supporting me on patreon.com!
What I’m asking about is the UI Button Input component ORK adds when you use the context menu to create a choice button. It adds several necessary components like the canvas, and the Content stuff that you can enter text codes into. I’ll snap a screenshot in a bit and post it. Just looking to see what that particular ORK component does as when enabled, it causes my script to run every frame. But if I keep it attached and simply disable it, everything works as expected. If I remove it entirely, all my button content is gone. Thanks!