How to design the menus in the table format?

You must Login before you can answer or comment on any questions.

Hi all, I want to design the menu items in the table format with scrollable view. The table should be 2 rows x 3 columns format. Example link : http://www.awwwards.com/gallery/7200/30-recent-inspirational-ui-examples-in-mobile-device-screens . Please guide me.

1 Answer

Hi

Your example links does not show a table, at least not a tableView which is designed to provide a specific table layout.

However it is very easy to create the layout your link depicts.

  • Create 6 views
  • Inside each view place an image and a label underneath

This very simple structure should provide an example of how to think about the construction;

Window
  View
    Image
    Label
  View
    Image
    Label
  View
    Image
    Label
  View
    Image
    Label
  View
    Image
    Label
  View
    Image
    Label
Add touchEnabled: false to each Image and Label and attach a click event to each view. You can control the layout by setting layout: horizontal to the parent window and setting the width: 50% and height: 33%, then each parent view will sit next to each other and flow underneath to create new rows.

— answered 7 months ago by Malcolm Hollingsworth
answer permalink
1 Comment
  • Hi Malcolm, I m not having the 6 views, i have 12 views. I separate these 12 views in to 6 and put it in to the scrollable view. Suppose if the device size is too large, the view is appearing also large. So i want to add two more view to the first page to reduce the size of the view and remaining four to the second page. How to do this? Thanks,

    — commented 7 months ago by Dinesh Kumar

Your Answer

Think you can help? Login to answer this question!