CODEWITHSUNDEEP
iosxcodeuitableviewuiview
Peter
Peter

Reputation: 1071

IOS - Have UITableViewCells scroll over UIView (like the shazam app)

I have a UIView above my UITableView. When the user scrolls down I want the UIView to stay in place at the top of the screen and have the cells scroll over it. The first page of the Shazam app does what I want. 

 - (void)scrollViewDidScroll:(UIScrollView *)scrollView{
    if (self.tableView.contentOffset.y > 0) {
        CGRect newframe = self.publicTopView.frame;
        newframe.origin.y = -self.tableView.contentOffset.y;
        self.publicTopView.frame = newframe;
}

}

This is what I've tried so far, but it doesn't do anything. Thanks

Upvotes: 1

Views: 278

Answers (4)

Benny Davidovitz
Benny Davidovitz

Reputation: 1202

basically all you have to do is to use UIScrollView's contentInset property

let topInset = topViewHeight.constant //based on your needs
sampleTableView.contentInset = UIEdgeInsets(top: topInset, left: 0, bottom: 0, right: 0)

see my github sample here

Upvotes: 0

beimenjun
beimenjun

Reputation: 783

If the UIView instance is called iconView, the UITableView instance is called tableView, If your view controller is UIViewController.

[self.view addSubview:iconView];
[self.view addSubview:tableView];
//and you need set tableView.background to transparent.

If your view controller is UITableViewController, read this question:

UITableViewController Background Image

Upvotes: 0

dave234
dave234

Reputation: 4955

You need to have a scrollView with a transparent background. Then add a subview to it that is not transparent and offset down a bit. Here's an overkill example. The TextureView is just so you can see that the background isn't moving.

#import "ViewController.h"
@interface TextureView : UIView
@end
@implementation TextureView

-(void)drawRect:(CGRect)rect{
    CGContextRef context = UIGraphicsGetCurrentContext();
    CGContextBeginPath(context);
    CGContextMoveToPoint(context, 0, 0);
    CGContextAddLineToPoint(context, rect.size.width, rect.size.height);
    CGContextMoveToPoint(context, 0, rect.size.height);
    CGContextAddLineToPoint(context, rect.size.width, 0);
    CGContextSetStrokeColorWithColor(context, [[UIColor whiteColor]CGColor]);
    CGContextSetLineWidth(context, 8);
    CGContextStrokePath(context);
}

@end

@interface ViewController ()

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];

    CGRect scrollViewFrame = self.view.frame;
    CGFloat sectionHeight = 300;
    int numberSections = 3;
    CGFloat clearSpaceAtTop = 300;

    CGRect sectionsViewFrame = CGRectMake(0, clearSpaceAtTop, scrollViewFrame.size.width, sectionHeight * numberSections);
    CGSize contentSize = CGSizeMake(scrollViewFrame.size.width, CGRectGetMaxY(sectionsViewFrame));



    TextureView *backGroundView = [[TextureView alloc]initWithFrame:scrollViewFrame];
    backGroundView.backgroundColor = [UIColor blueColor];
    [self.view addSubview:backGroundView];

    UIScrollView *scrollView = [[UIScrollView alloc]initWithFrame:scrollViewFrame];
    scrollView.contentSize = contentSize;
    scrollView.backgroundColor = [UIColor clearColor];
    [self.view addSubview:scrollView];

    UIView *sectionViewsParent = [[UIView alloc]initWithFrame:sectionsViewFrame];
    sectionViewsParent.backgroundColor = [UIColor lightGrayColor];
    [scrollView addSubview:sectionViewsParent];

    NSArray *colors = @[[UIColor redColor],[UIColor greenColor],[UIColor purpleColor]];
    CGFloat spacer = 4;
    CGRect colorViewFrame = CGRectMake(0, 0, sectionsViewFrame.size.width, sectionHeight - spacer);
    for (UIColor *color in colors){
        UIView *sectionView = [[UIView alloc]initWithFrame:colorViewFrame];
        sectionView.backgroundColor = color;
        [sectionViewsParent addSubview:sectionView];
        colorViewFrame.origin.y += sectionHeight;
    }

}

@end

Upvotes: 0

Siriss
Siriss

Reputation: 3767

I would set the tableView.backgroundView to your view, and then set your cells to be clear (or whatever transparency you like). This will allow the cells to move over the view.

Upvotes: 1

Related Questions