CODEWITHSUNDEEP
iphoneiosuitableviewuiview
fabian789
fabian789

Reputation: 8412

Transparent View at the Top of a UITableView

When you open Mail on an iPhone and tap Edit, select an email and tap Move, a UITableView appears with all the folders you can put the mail in. At the top is a transparent view that shows the email you selected. When you move your finger down, the view stays in place, when you move it up, the cells are visible through the transparent view.

How did apple configure this view? I thought of two ways, but they both don't work:

Any ideas on how to recreate this effect?

Upvotes: 1

Views: 4847

Answers (2)

Marius
Marius

Reputation: 3617

For the XIB method:

  • Create a new UIViewController (with XIB)
  • Add to it your UITableView and your UIView.

  • Make them both subviews of the default UIView (called View) and make sure that they are added in the correct order. UITableView should be the first in the list, your view should be second (so your view is on top of the UITableView).

  • In the .m file implement the minimum for UITableViewDataSource and UITableViewDelegate:

    -(NSInteger)numberOfSectionsInTableView:(UITableView *)tableView;

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

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

    -(void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath;

  • In Interface Builder select the UITableView list and go to 'Connection Inspector'. There drag dataSource and delegate to 'File Owner'.

Save and run. You should be done now.

Upvotes: -1

Ben
Ben

Reputation: 1392

You need to create your transparent view and then add it as a subview to the view controller so it's a sibling of the UITableView. You would do this in the viewDidLoad() method.

- (void)viewDidLoad
{
    int viewHeight = 50;

    // Assume myTableView is a UITableView variable
    myTableView = [[UITableView alloc] initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height - 44) style:UITableViewStylePlain];
    myTableView.scrollIndicatorInsets = UIEdgeInsetsMake(viewHeight, 0, 0, 0);
    myTableView.contentInset = UIEdgeInsetsMake(viewHeight, 0, 0, 0);

    UIView *myView = [[UIView alloc] initWithFrame:CGRectMake(0,0,self.view.frame.size.width,viewHeight)]; 

    // Configure your view here.
    myView.backgroundColor = [UIColor colorWithRed:0.0 green:0.7 blue:0.8 alpha:0.75];

    [self.view addSubview:myTableView];
    [self.view addSubview:myView];
    [myView release];

}

You could also setup your view using an XIB, but I'll leave that as an exercise for you.

Edit: Removed the requirement for the the UITableView delegate methods and custom header view by using the contentInset property instead.

Note: see additional comments below.

Upvotes: 2

Related Questions