I need to create an application that scales nicely from smartphones to tablets. While ionic2 has some basic support for responsive grids, what I really need is a concept for supporting different layouts/navigation schemes.
Take a master detail view, for example. On tablets I want the a list of items on the left and details about the selected item on the right. on the smartphone, however, selecting an item should trigger a navigation to a second details page.
I’m aware, that there is showWhen – but imo it feels tedious to put that everywhere…
Does anybody have experiences with this kind of adaptivity? How would you solve such issues?
I’m thankful for any suggestions and experience reports!
Totally agree, we need a way to do adaptive navigation with a preference for what should apply at what size(s). Not super easy. Sounds like you need (probably already have) your details view in a components and either show it in the grid or present a Page/Modal when the client width is too small. So far I’ve got different code paths for Page/Modal navigation depending on client width.
thanks for your kind answers! Indeed I’m using components that are instantiated next to the listview when in tablet mode or in another page when in smartphone mode.
a vague idea was to define two different templates for a Page and switch between them… But that touches the core of angular
The master-detail experience you are talking of is something different, but for my app which is already live on Android and Windows 10 , the app adapts quickly to the size of the layout. I am using grid layout to show the items in a list. For tab or any device of higher dimension than phone, the grid layout is shown and for a phone only 1 item for each row is shown.
There is no extra code to identify any device size, etc.
The app is a client for Stack Exchange and is called StackCook.
I really appreciate Ionic, your team, and its work.
I chose Ionic in 2014 (at beta stage) and we are still working with it (v1 branch).
We are targetting companies which are all using tablets (dealer, sales man, …).
We did our best to build a tablet first application (thanks to grids and little hacks) that can also be run on smartphones.
Since 2014, I keep an eye on one of your post: Tablet: how to made app for tablet and smartphone?
Ionic 2 will soon be released and I must admit that I am a bit disapointed regarding Ionic features for tablets.
We are almost in 2017, a lot of professional are using tablets, many software companies have chosen the hybrid way but there is still nothing about basic things such as master/details pattern.
I am convinced that there is a real market. Could you please share your thoughts?
!