So I have a DataView (List) that is using made up of data items. which is loading items from a store and displaying fine. When the app loads I get a load mask until the data is retrieved from the server, loaded into the store, then list of items is displayed.
My goal is to animate the way this list appears. (ideally slideIn from the bottom).
I've tried using the following in the DataView config
This doesn't work the way I would like it to though. Here is why.
Since this first time the DataView is being shown the show event fires except there isn't any data yet. A few second later the data is loaded but the showAnimation has already happened (i think) with no content.
At this point if I switch tabs and switch back I can see the animation work. This I believe is because the data is already loaded (Note: This only works because I'm not re-loading the store each time load the view.) so when the show action is called the animation works as desired.
So basically as I understand it, I would need to find a way to get the show action to fire once the data in the store is loaded and updates the data view.
My thought would be to find a way to add a showAnimation to the DataView so that I can slide it up from the bottom the first time it loads. Then remove the showAnimation for all subsequent displays of that DataView tab. Which will provided a nice animation of the first load then instant data for each load thereafter.
I'm played around with a few things but ultimately can't find a way to get the show action to fire again. (i know HOW to get it to fire just not a place to place the fireEvent() call. i.e. an action that happens once the store loads with a reference to that data view.
Anyone know if something like this is possible?