How to customize a UITableview's index look?

Question

http://imgur.com/rxVYsV2 - reddit's index

I want to create an index similar to the one in reddit's app, especially adding icons to it and having it highlight the letter(see link for picture). Any suggestions for how to do it(in xamarin ios)?

Answer 1

Since, you didn't ask for code, I'll just help you get started. :)

Use a UITableView to create a row, a cell would be like

Add another UITableView to create the side listing, with just an alphabet as cell. Something like

Now, on selection of any row from the second UITableView, modify the highlight and scroll the left UITableView accordingly. As well as on scroll of left TableView, change the highlight according to the first alphabet.

UPDATE

For StoryBoards follow the following steps:

1. Drag and drop two UITableViews in StoryBoard, place and resize them however you want (according to the layout you want), apply constraints.
2. Give each StoryBoard a reference like you do for other elements such as buttons etc. or give them a Tag.
3. In your ViewController make two Nested Classes, two of them for 1st TableView, one inheriting from UITableViewDataSource and other from UITableViewDelegate. Override the mandatory methods (link).

Now once you have the classes done, assign them to your TableViews like

//With Tag
UITableView myTableView1 = (UITableView) this.View.ViewWithTag(1);
myTableView1.DataSource = new MyTableView1DataSourceClass();

//OR

//With reference
myTableView1.DataSource = new MyTableView1DataSourceClass();
myTableView1.Delegate = new MyTableView1DelegateClass();

Please look at Create UI Objects for more help with making objects.

Please upvote and mark it as the correct answer if you feel it is. Besides, let me know if you need more help. Have a great time coding :)