Material Design master-detail transitions with routing

ionic-v1
1

I am looking at the Material Design specs for master-detail transitions and it shows a master element animating to the top of the view, followed by the detail data animating in below it.

Does anyone have a good strategy to implement this pattern when using angular-ui-router and ion-nav-view? It would seem that the detail ion-nav-view must be a child of the master ion-nav-view and you have to choreograph the hiding of the unselected master records along with the showing of the detail view.

I had a quick look at ionic-material and it doesn’t seem to offer anything on this topic.

2

Sadly there isn’t any good solution to customize the view transitions in ionic (yet?!). You could try the solution from DeppV101 in this discussion (one of the last posts), to implement your own transition. But i think without doing hacky stuff around ionic, the only way is waiting for a native ionic way, to implement your own view transition.