Author Topic: Createa timeline with NGUI  (Read 3579 times)

BaconBobsleigh

  • Newbie
  • *
  • Thank You
  • -Given: 1
  • -Receive: 0
  • Posts: 2
    • View Profile
Createa timeline with NGUI
« on: September 29, 2015, 10:17:48 AM »
Hi!

I'm trying to create a Timeline with NGUI but I couldn't find an approach that fits my project needs.

The timeline would basically work like a video editing software timeline:
  • It control the Scene's time forward and backward with a cursor dragged over the timeline items
  • You can drag and drop item wherever you want in the time line
  • Timeline precision is not important, one second per block is enough (no zoom needed)

This is the target idea I want:


The scene itself won't be that long (3-4 minutes max) and it is mandatory that the whole timeline content is always displayed (no scrollview).

My first approach was to generate all my "Second blocks" which are custom DragDropContainer classes with a panel and a grid.
That's ~250 block in a parent grid. It seems not to be too beefy, but I might need a confirmation here.
I made the cursor as a custom DragDrop item that is on a layer above the Second blocks.

This is what it looks like in the Hierarchy:


While this approach seems to be good for the drag and drop items on the timeline, I could't manage to get my timeline cursor working as I want.
I can't find a way to manage both the drag and drop of the cursor and the timeline content.

I have a feeling I'm not going the right way here, but I can't find something else.

Any help would be much appreciated!  :)

ArenMook

  • Administrator
  • Hero Member
  • *****
  • Thank You
  • -Given: 337
  • -Receive: 1171
  • Posts: 22,128
  • Toronto, Canada
    • View Profile
Re: Createa timeline with NGUI
« Reply #1 on: September 29, 2015, 04:43:28 PM »
Why do you need a grid for this? Drag & drop alone is fine. On drop event you can adjust the position of the widget if you need it aligned to specific time intervals. The cursor as a custom dragdrop item is also very strange... Did you mean the UICursor example script? If you need a custom cursor, just use a sprite that will follow a mouse. Drag & drop operation makes the widget follow the mouse separately, completely unrelated to the cursor. Make sure you're using the drag & drop example as your example, not the inventory example.

BaconBobsleigh

  • Newbie
  • *
  • Thank You
  • -Given: 1
  • -Receive: 0
  • Posts: 2
    • View Profile
Re: Createa timeline with NGUI
« Reply #2 on: October 02, 2015, 02:45:19 AM »
Sorry for the late response.

You are correct. I thought I needed a grid but it turns out I don't.
I didn't use the UICursor script: only a class derived from UIDragDropItem, but it was overkill for this usage. A simple mouse follow works much better.

Thanks again!