Styled UITableViewCell (tries to copy Facebook App App App)

The iPhone app for iPhone has a slide view on the left side that shows UITableView

.

I'm trying to copy the look and feel of this table, with each cell having what appears to be a custom border (looks like a very thin light gray and black line?). Also, when you select a cell, the cell is highlighted in dark gray instead of blue by default.

enter image description here

I tried searching on stackoverflow and there was indeed a similar question, but only two answers answered using the library Three20

.

I would like to know how to achieve the same look with UIKit

and not use a library Three20

.

Any help on how to reproduce this particular style UITableViewCell

would be greatly appreciated!

EDIT # 1: To clarify, I know how to render UITableViewCells

myself, with images and text. The part I don't know how to do is adjust the borders and highlight color so they look like a Facebook figurative image.

EDIT # 2: To be sure, I also don't ask how to take a picture. I'm just asking how to style the table as per the screenshot below of the Facebook iphone app. :)

Thank!

+3


source to share


2 answers


This can be done using images for custom strings and animations for its sliding effect



+1


source


Here is a left and right menu slider, you can obviously turn off the correct code like I did!

Shutdown menu: DDMenuController

Here are a few tweaks I made that look like FB, not photos!



LeftController.m

#define UIColorFromRGB(rgbValue) [UIColor colorWithRed:((float)((rgbValue & 0xFF0000) >> 16))/255.0 green:((float)((rgbValue & 0xFF00) >> 8))/255.0 blue:((float)(rgbValue & 0xFF))/255.0 alpha:1.0]

- (void)viewDidLoad {
[super viewDidLoad];

navBarMenuArray = [[NSArray alloc] initWithObjects:
                   @"My Photos",
                   @"My Friends",
                   @"Inbox",
                   @"Stores",
                   @"Offers",
                   @"Settings",nil];

navBarImagesArray = [[NSArray alloc] initWithObjects:
                     @"photos.jpg",
                     @"friends.jpg",
                     @"inbox.jpg",
                     @"stores.jpg",
                     @"settings.jpg", nil];

searchBar = [[UISearchBar alloc] initWithFrame:CGRectMake(0.0, 0.0, 240.0, 45.0)];
searchBar.tintColor = UIColorFromRGB(0x0075bb);
searchBar.placeholder = @"Search a brand or store...";
[self.view addSubview:searchBar];
[searchBar release];

if (!_tableView) {
    //UITableView *tableView = [[UITableView alloc] initWithFrame:self.view.bounds style:UITableViewStylePlain];

    UITableView *tableView = [[UITableView alloc] initWithFrame:CGRectMake(0, 44, 320, 506) style:UITableViewStylePlain];
    tableView.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;
    tableView.delegate = (id<UITableViewDelegate>)self;
    tableView.dataSource = (id<UITableViewDataSource>)self;
    [self.view addSubview:tableView];
    self.tableView = tableView;
    }
}

- (void)viewDidUnload {
[super viewDidUnload];
self.tableView = nil;
}

- (NSInteger)tableView:(UITableView*)tableView numberOfRowsInSection:(NSInteger)section {
    return navBarMenuArray.count;
}

- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView {
    return 1;
}

- (UITableViewCell*)tableView:(UITableView*)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {

    static NSString *CellIdentifier = @"CellIdentifier";
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
    if(cell == nil) {
        cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier];
    }
    cell.textLabel.font = [UIFont fontWithName:@"ArialMT" size:17];
    cell.textLabel.text = [navBarMenuArray objectAtIndex:indexPath.row];
    cell.textLabel.textColor = UIColorFromRGB(0xa2a9b9);
    cell.textLabel.shadowColor = UIColorFromRGB(0x212838);
    cell.textLabel.shadowOffset = CGSizeMake(1.0, 1.0);
    cell.textLabel.backgroundColor = UIColorFromRGB(0x32394b);
    self.tableView.backgroundColor = UIColorFromRGB(0x32394b);
    self.tableView.separatorColor = UIColorFromRGB(0x262d3d);
    return cell;
}

      

0


source







All Articles