MAFUITableView and MAFUITableViewCell

You can populate the MAFUITableView with MAFUITableViewCells. Cells are grouped by sections:

Construct and populate the table view in the same way as for the native table view:

/*The interface of the ViewController implementing the MAFUITableView*/
#import <UIKit/UIKit.h>
#import "MAFUITableView.h"
@interface ViewController1 : UIViewController<UITableViewDelegate, UITableViewDataSource> {
    NSMutableArray* m_TableData;
    MAFUITableView* m_TableView;
}

@property (nonatomic, retain) NSMutableArray* tableData;
@property (nonatomic, retain) MAFUITableView* tableView;

@end

The UIViewController must implement the two UITableView delegates. m_TableView is a reference to the MAFUITableView instance. NSMutableArray is the example data store for the table view. This is one of the many ways provided by the iOS platform to construct a table view interface. The implementation of the controller is similar to constructing a native UITableView:

/*Implement required methods from UITableViewDataSource Protocol*/

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section;

// Row display. Implementers should *always* try to reuse cells by setting each cell's reuseIdentifier and querying for available reusable cells with dequeueReusableCellWithIdentifier:
// Cell gets various attributes set automatically based on table (separators) and data source (accessory views, editing controls)

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
	…
MAFUITableViewCell *cell = [self.tableView dequeueReusableCellWithIdentifier:cellIdentifier];
    if (cell == nil) {
	cell = [[[MAFUITableViewCell alloc] initWithStyle: UITableViewCellStyleValue1
                                              reuseIdentifier: cellIdentifier] autorelease];

}

	…
}

To present a grouped MAFUITableView, use the appropriate constructor call and pass the style parameter to it:

MAFUITableView* tempTableView = [[MAFUITableView alloc] initWithFrame:CGRectMake(10, 10, 320, 400) style:UITableViewStyleGrouped];

An alternative way to do this is to use the Storyboard UI designer, which is built into Xcode.

To change the appearance of the MAFUITableView and the MAFUITableViewCell classes, declare your custom style XML classes:

<!-- ListBox is mapped to TableView on iOS -->
    <Style basedOn="ListBox" Key="myListBox" TargetType="ListBox" platform="ios">
        <Setter Property="Background" Value="#BBCCFF"/>
       <Border BorderBrush="#FF9595" BorderThickness="4" CornerRadius="8" />
    </Style>

<!-- ListBoxItem is mapped to TableViewCell on iOS -->
    <Style BasedOn="ListBoxItem" Key="myListBoxItem"
        TargetType="ListBoxItem" platform="ios">
        <Setter Property="DetailsFontFamily" Value="Helvetica-Bold"/>
        <Setter Property="DetailsFontSize" Value="17"/>
        <Setter Property="DetailsTextColor" Value="#666666"/>
    </Style>

To apply your custom style classes, set the key value to match the mafStyleName properties of the controls:

/* set custom style for table view */
…
tempTableView.mafStyleName = @"myListbox";

/* set custom style for table view cells*/
…
cell.mafStyleName = @"myListboxItem";

You can change these properties of the MAFUITableView in the skinning XML:

You can change these properties of the MAFUITableViewCell in the skinning XML: