Author Topic: paged drag panel  (Read 5417 times)

Alan Gray

  • Guest
paged drag panel
« on: May 30, 2012, 12:19:04 PM »
I need to implement a "paged" drag panel - something similar the the icon pages on iOS. Is there any built-in support for this in NGUI? Or should I just use a draggable panel and play with the spring/momentum and stop positions?

ArenMook

  • Administrator
  • Hero Member
  • *****
  • Thank You
  • -Given: 337
  • -Receive: 1171
  • Posts: 22,128
  • Toronto, Canada
    • View Profile
Re: paged drag panel
« Reply #1 on: May 30, 2012, 01:09:34 PM »
The latter. It's fairly easy to do -- OnPress(false), figure out where the closest "cell" is, and SpringPosition (or SpringPanel) to it.

Ferazel

  • Full Member
  • ***
  • Thank You
  • -Given: 1
  • -Receive: 2
  • Posts: 150
    • View Profile
Re: paged drag panel
« Reply #2 on: May 30, 2012, 05:18:11 PM »
I guess the question is what am I scrolling and what element position am I supposed to use? There are clip bounds, internal grid/layout positions, Panel centering, etc.

ArenMook

  • Administrator
  • Hero Member
  • *****
  • Thank You
  • -Given: 337
  • -Receive: 1171
  • Posts: 22,128
  • Toronto, Canada
    • View Profile
Re: paged drag panel
« Reply #3 on: May 31, 2012, 01:45:20 AM »
That really depends on your implementation and how you want to handle it.

Alan Gray

  • Guest
Re: paged drag panel
« Reply #4 on: June 11, 2012, 06:00:39 PM »
I finally got around to trying to implement this. It seems like I am fighting with the UIDraggablePanel code when I try to set the SpringPanel target position. I call SpringPanel.Begin() with OnPress(false) - which creates the SpringPanel (if it hasn't already been created) and sets the correct Target. Then UIDraggablePanel immediately disables the SpringPanel. Do I need to replace the UIDraggablePanel with my custom script?

Alan Gray

  • Guest
Re: paged drag panel
« Reply #5 on: June 13, 2012, 03:07:05 PM »
Was that question too stupid to answer? :-[
« Last Edit: June 13, 2012, 04:27:46 PM by AlanG »

PhilipC

  • Guest
Re: paged drag panel
« Reply #6 on: June 13, 2012, 03:24:57 PM »
No thats not it, its because Mike (ArenMook) is away for the week and i'm not sure where he was going with his idea.

Have you tried replacing UIDraggablePanel with you custom script as you suggested?

If i come up with a solution I will let you know.

ENAY

  • Full Member
  • ***
  • Thank You
  • -Given: 0
  • -Receive: 0
  • Posts: 248
    • View Profile
Re: paged drag panel
« Reply #7 on: June 13, 2012, 10:16:49 PM »
I think what is needed it a "snap to page size" function adding to NGUI.
For example "snap to page size = 400"

You drag your UIPanel and then it calculates which is the nearest multiple (ie 400,800,1200 etc) and then snaps to that direction. Right now the spring function only works at the very beginning or end of your UIPanel but it would be great if would spring in the middle of the UIPanel too.

PhilipC

  • Guest
Re: paged drag panel
« Reply #8 on: June 14, 2012, 02:22:48 PM »
Something we can look into for sure. Its always about how much time we have :(

Alan Gray

  • Guest
Re: paged drag panel
« Reply #9 on: June 14, 2012, 06:28:28 PM »
I tried replacing the UIDragPanel with my custom script. It sprang to my first "page" as expected but I lost all the important features of UIDragPanel - like panel layout and dragging. Haven't had time to look into it to see how much I would need to replicate from UIDragPanel to really make it work right. Somehow this seems like the wrong approach (duplicating an NGUI script and changing a few lines).

Alan Gray

  • Guest
Re: paged drag panel
« Reply #10 on: June 17, 2012, 09:40:02 PM »
Got it working (without duplicating a bunch of UIDraggablePanel code). Just disabled "Restrict Within Panel" on UIDraggablePanel - then it quit fighting with my paged version of SpringPanel. I have a "DragPanelPager" script everywhere I have a UIDragPanelContents. The script triggers on OnPress(false) and sets the SpringPanel to the desired page position.
  1.         void OnPress(bool isPressed)
  2.         {
  3.                 if(!isPressed && (DragPanel != null))
  4.                 {
  5.                         Vector3 panelPos = DragPanel.localPosition;
  6.                         panelPos.x = getPage() * -pageSize;
  7.                         SpringPanel.Begin(DragPanel.gameObject, panelPos, 13f);
  8.                 }
  9.         }
  10.  

If there is a better way, I'm all ears. Now I just need to take the swipe velocity into account so that it feels like iOS paged swipe. :)

ArenMook

  • Administrator
  • Hero Member
  • *****
  • Thank You
  • -Given: 337
  • -Receive: 1171
  • Posts: 22,128
  • Toronto, Canada
    • View Profile
Re: paged drag panel
« Reply #11 on: June 17, 2012, 09:53:13 PM »
Sounds like the right way to go, actually.