Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Build a timeline using custom view

I'm building an Android App with a timed events and i'm not sure what layout i should use to build my timeline.

Events can have different heights and can grow when user tap them but they have the same width;

              .
              .
              .
------------- |
| Event 4   > | --------------
------------- | < Event 7    |
              | |            |
              | --------------
              .
              .
              .

I have two view types :

  • EventView witch hold the event info and drow his outline
  • TimeBarView witch is the bar on the middle (have some property and is extended on a very long span

How can i place my items so it's respectful of the time on my time-line (for example 1 week could be 10px)

Any help is appreciated. Thanks !

like image 393
Romain Avatar asked Nov 13 '22 08:11

Romain


1 Answers

I'm tackling the same problem now.

I don't have a full solution yet, but I have an idea:

Since you have to sides to the timeline, ListView is not appropriate because events can overlap.

Instead consider using a 2-column GridView. I recommend using AndroidStaggeredGrid, that support different item sizes.

For the actual "Time bar" that runs in the middle, I'll simply use a narrow line as the background for the GridView.

There will be no markers on the timeline. Instead, the markers will be on the EventView themselves, either on the left or the right, in such a way that the marker falls exactly on the Time Bar.

This way, when you scroll the grid, it will give the illusion that the Time bar itself is scrolling.

To signify an empty time interval, just add an empty view which it's height is proportional to the interval it represents.

Hope it helps...

like image 76
Avi Shukron Avatar answered Nov 14 '22 22:11

Avi Shukron