Playmaker Forum

PlayMaker Help & Tips => PlayMaker Help => Topic started by: jess84 on May 15, 2014, 09:02:51 AM

Title: Daikon Forge - Help with Scroll Panels/Buttons
Post by: jess84 on May 15, 2014, 09:02:51 AM
Hi,

So I've got a scroll panel that contains my buttons for each level (see screenshot), and a panel that displays each level's information when the corresponding button is pressed.

The scrolling works fine, but as I'm using 'DFGUI Control Mouse Down Event' on my buttons to detect presses, it also selects whichever button i have my finger on, and updates the level panel.

How can I stop this from happening, so there's a difference between pressing and swiping? I only want the level panel to update if it's an intentional press on the button, not merely me touching the screen to scroll down the list.

Ideas?
Title: Re: Daikon Forge - Help with Scroll Panels/Buttons
Post by: jeanfabre on May 15, 2014, 10:30:43 AM
Hi,

 It's going to be a tricky deal here:

First, for a scroll behavior to be great it has to be instantanious, so I would not suggest implementing a timeout to detect if indeed the user it swiping or not to then enable scrolling.

I am currently playing with IOS homescreen and pressing down dims out the icon, YET I can can still scroll. But if a scroll happen ( I guess 1 or 2 pixel threshold), then releasing the touch do not select the app my finger was down on.

 I think you should go for the same thing.

allow scrolling and pressing down to be happening at the same time, but don't allow TAP to work if a scroll was detected for that finger.

 Does that make sense?

Bye,

 Jean
Title: Re: Daikon Forge - Help with Scroll Panels/Buttons
Post by: jess84 on May 15, 2014, 10:56:02 AM
Thanks for that.

It does make sense, your suggestion at the bottom, but I'm not sure how to go about implementing that - e.g. which actions?

Title: Re: Daikon Forge - Help with Scroll Panels/Buttons
Post by: jeanfabre on May 15, 2014, 11:48:51 AM
Hi,

 Use "Scroll position changed event" action to trigger a state where you set a boolean variable "is scrolling" to true

then catch the click event as well and if "is scrolling" is true, then exit the logic and don't perform the click action that was supposed the happen

Yes?

Bye,

 Jean
Title: Re: Daikon Forge - Help with Scroll Panels/Buttons
Post by: jess84 on May 15, 2014, 11:50:25 AM
Sounds good in theory, thanks! I'll let you know how I get on with it in a while  :)
Title: Re: Daikon Forge - Help with Scroll Panels/Buttons
Post by: jeanfabre on May 15, 2014, 12:43:32 PM
Hi,

 Let me know if you struggle, I'll create a micro sample in that case.

bye,

 Jean
Title: Re: Daikon Forge - Help with Scroll Panels/Buttons
Post by: jess84 on May 15, 2014, 01:10:23 PM
Having some trouble getting it to work, so a micro sample would be very helpful!
Title: Re: Daikon Forge - Help with Scroll Panels/Buttons
Post by: jeanfabre on May 15, 2014, 03:02:04 PM
Hi,

 ok, please find attached a template that shows how to do this.

1: Open the "Daiken Forge/Examples/Containers/ScrollPanel" example shipped with DFGUI

2: Select the gameobject "UI Root/Window/Scroll Panel" and check "Use Arrow Keys" to true

3: Select the top left "Placeholder" gameobject inside the scroll panel
4: add an fsm based on the template "ClickOrScroll" from the package attached to this post
5: on that fsm, select the variable "Vertical scrollBar" and point to "UI Root/Window/Vert Scrollbar"

6: run the scene

7: mouse down on this placehoder, while you are down, press the up and down arrow keys to scroll, and the state "nothing" is entered.
8: mouse down again on this placeholder, this time don't scroll, release the mouse, the state "Perform Action" is entered


If you have a specific setup, pm me with your scene, but that template will definitly work as it's agnostic to how you scroll basically.

I would trigger in turn a global event send to the gameobject like "PERFORM CLICK" or something so that you can have on template for all your similar placeholders withotu having to manually recreate this behavior again and again.

trick: create an fsm and in the inspector "use template" and reference this "ClickOrScroll", if you create an fsm using a template, it's a hard copy which makes it not really flexible for global editing.

Bye,

 Jean

Title: Re: Daikon Forge - Help with Scroll Panels/Buttons
Post by: jess84 on May 15, 2014, 03:09:09 PM
Awesome. Thanks so much for that, grabbing it now.

And those actions/instructions should work identically on touchscreen, or would they need amending?
Title: Re: Daikon Forge - Help with Scroll Panels/Buttons
Post by: jeanfabre on May 15, 2014, 03:12:44 PM
Hi,

You'll need to enable "Use Touch" in "DF Input Manager" component of "UI Root" and you'll be good for IOS.

Also, you should know that many complains where made on dfgui on mobile ( never tried it myself), I think v2 is about this as well as other issues. So if you will deal with heavy content, you may want to switch to nGui or wait for v2.


Bye,

 Jean
Title: Re: Daikon Forge - Help with Scroll Panels/Buttons
Post by: jess84 on May 15, 2014, 03:15:43 PM
I decided on sticking to GUI Textures in-game, and on basic screens - but as I'd already bought dkforge in the sale, I figured I'd use it just for the level select screen, which is my only non-complicated GUI related screen. I figure that if it's just a menu screen, it should be able to keep up, even on mobile.

Title: Re: Daikon Forge - Help with Scroll Panels/Buttons
Post by: jess84 on May 15, 2014, 04:33:58 PM
Got your sample working, and applied to my own scene... and it works!

Thank you!

One small thing that I need to fix though - even though it then doesn't register as a click when scrolling, it does set the text/graphic state to Focused. (I use that to change button sprite and text colour to indicate which button is currently active).

Any ideas on forcing it to not set as focused? I'm guessing an action in the 'nothing' state.
Title: Re: Daikon Forge - Help with Scroll Panels/Buttons
Post by: jess84 on May 16, 2014, 09:28:26 AM
Bit stuck with this.

Although 'DFGUI Call Unfocus' on the 'nothing' state will prevent it setting the focus to the button I'm touching whilst scrolling, it also removes the focus from the button corresponding to the information displayed in my panel.

Any ideas on how to leave the focus on the last button actually clicked?
Title: Re: Daikon Forge - Help with Scroll Panels/Buttons
Post by: jeanfabre on May 16, 2014, 09:56:07 AM
Hi,

 Confused, you can only have one focused ui element at a time right? so you can't expect two elements to have focus at the same time.

Bye,

Jean

Title: Re: Daikon Forge - Help with Scroll Panels/Buttons
Post by: jess84 on May 16, 2014, 11:21:14 AM
You can set up Font Colour for focused elements. I have that set to that when I press Button 1, level 1 information is shown in the panel and the font colour is purple on Button 1.

Then...

If I'm scrolling and have my finger on say Button 6, and it correctly leaves the panel showing Level 1 information, it will set the focus state to Button 6 (to Button 1 is black again, and Button 6 is purple).  I want to prevent this - as the button that corresponds to what's shown in the panel should match the button.

There is an action to prevent focus from happening, but that cancels all focus. I want to just clear the focus from the scrolling event. Focus only happening when a click is done.

Does that make sense?
Title: Re: Daikon Forge - Help with Scroll Panels/Buttons
Post by: jess84 on May 21, 2014, 09:34:35 AM
bump  :)

What I'm trying to achieve isn't 2 focuses - I'm trying to have the focus not updated when scrolling so that the original item of focus still maintains the focus.
Title: Re: Daikon Forge - Help with Scroll Panels/Buttons
Post by: jeanfabre on May 23, 2014, 12:56:27 AM
Hi,

 I think you are mis using the focus paradigm here. focus is given to what ever ui element you are interacting with so I doubt you will be able to achieve what you want here trying to control or alter the focus behavior.

 instead. prefer an approach with you hilight manually the button or its surounding that is related to what it's showing on the panel. Typically, I would simply swith the background graphics for the item in the list, or swith the button graphics all together.

Bye,

 Jean