-1

Currently i am doing a native ios app and my layout is to be as follow mock image

So from the mock image, i have two tab, tab 1 and tab 2 with 3 sub tab. Wish to get advice on what kind of object component in native IOS can i use to achieve the look and functionalities.

So what i wish to achieve is something like an accordion, where user are shown different content based on the tab that they used.

For example when they click on tab1, they are shown content and for the sub tab, it is default to sub tab 1, if they click other sub tab, it will change content.

So overall, i will have total of 6 different contents.

I search abit online, and the closest i found is navigation but not sure is that the way to do it or there is a better way.

This question is not to provide me code or what, just need to provide me the solution or the component to be use so that i can search it online.

Mat
  • 21
  • 4

1 Answers1

0

There are many possible solutions to this.

Probably the easiest one is to use table view. This looks like 4 cells are being used. I am not sure if this is scrollable but you could compute the cell sizes to fit the screen and disable the scrolling. You would also be able to use some animations when a cell changes like sliding them in-out sideways or fading them. Maintaining your model may be a bit difficult for a beginner but that probably goes for any of the cases.

Second is collection view. It has a bit more flexibility but for the case you provided it would only complicate things. Rather use horizontal collection views inside cells if needed. Though in your case either a horizontal stack view or even segment control should do.

Another solution would be to simply put on all different kind of views and then hiding them according to your situation. I wouldn't want to go there but it is A solution.

An upgrade from putting all views there and hiding them is to use content controller view. An example of it can be found here. This would mean that every inner part would be its own view controller. You would just have a few containers on top level then in runtime you would switch which view controller is shown where. This procedures has some pros and cons. Mostly you need to communicate all with delegates or you should consider MVVM.

Matic Oblak
  • 16,318
  • 3
  • 24
  • 43
  • Hi @matic oblak, Thanks for your advice. I will look into online on tableview. But just a check, when you mention 4 cell being used, what are the 4 cell ? – Mat Jul 22 '19 at 09:32
  • @Mat 1. The orange one on top. 2 some tab selector. 3 another tab selector. 4 the purple bottom view. – Matic Oblak Jul 22 '19 at 09:36
  • Hi @matic oblak, The orange container on top is just some static content, maybe banner, the purple one is contents that based on selection of the first 2 tab and the 3 sub tab. – Mat Jul 22 '19 at 09:54
  • @Mat it makes little difference. It can still all be as part of table view. You could in this case then maybe pack all top 3 views into a single cell or even as table view header. Then the bottom part would be some other cell. – Matic Oblak Jul 22 '19 at 11:08