视图关联

2018-07-29  本文已影响0人  呵邢

1.先做准备工作

    1.1  对屏幕宽高做一个宏定义方便引用(该屏幕宽高是以8P模拟机为参照)

             #define S_Width [UIScreen mainScreen].bounds.size.width

            #define S_Height [UIScreen mainScreen].bounds.size.height

    1.2 将属性设为全局属性 

            @property(nonatomic,strong)UIView *lineView;//随button滑动的下划线

            @property(nonatomic,strong)UIScrollView *bigScrollView;//与button关联的视图

    1.3签署滚动视图的代理(后面用到的):UIScrollViewDelegate

2.对顶部按钮进行布局

2.1创建按钮

     NSArray*arr = [NSArray arrayWithObjects:@"1",@"2",@"3",nil];

    for(inti =0; i < arr.count; i++) {

        UIButton*btn = [UIButtonbuttonWithType:1];

        btn.frame=CGRectMake(S_Width/3.0*i,64,S_Width/3.0,50);

        [self.viewaddSubview:btn];

        btn.tag=20+ i;

        [btnsetTitle:[arr objectAtIndex:i] forState:UIControlStateNormal];

        [btnaddTarget:self action:@selector(click:) forControlEvents:UIControlEventTouchUpInside];

        if(i ==0) {

            [btnsetTitleColor:[UIColor blackColor] forState:UIControlStateNormal];

        }

    }

2.2创建按钮下划线

    _lineView = [[UIView alloc]init];

    _lineView.frame=CGRectMake(0,64+50,S_Width/3.0,2);

    _lineView.backgroundColor = [UIColor blackColor];

    [self.view addSubview:_lineView];

3.Button与视图关联(正向关联)

    -(void)click:(UIButton*)btn{

    //button的标题

    for(inti =0; i <3; i++) {

        UIButton*newBtn = [self.viewviewWithTag:20+ i];

        if(newBtn.tag== btn.tag) {

            [newBtnsetTitleColor:[UIColor orangeColor] forState:UIControlStateNormal];

        }else{

            [newBtnsetTitleColor:[UIColor blueColor] forState:UIControlStateNormal];

        }

    }

    //下划条随Button滚动变化位置

    _lineView.frame=CGRectMake((btn.tag-20) *S_Width/3,64+50,S_Width/3.0,2);

    //滚动视图随Button变化位置

    [_bigScrollView setContentOffset:CGPointMake((btn.tag - 20)*S_Width, 0)];

}

3.视图布局

-(void)createView{

    UIScrollView*bigScrollView = [[UIScrollView alloc]initWithFrame:CGRectMake(0,64+52,S_Width,S_Height- (64+52)-49)];

    bigScrollView.backgroundColor= [UIColorwhiteColor];

    bigScrollView.delegate=self;

    _bigScrollView= bigScrollView;

    bigScrollView.tag=10;

    [self.viewaddSubview:bigScrollView];

    bigScrollView.contentSize=CGSizeMake(S_Width*3,0);

    bigScrollView.pagingEnabled=YES;

}

4.视图与button关联(反向关联)

    -(void)scrollViewDidScroll:(UIScrollView*)scrollView{

    CGFloatview_x = (scrollView.contentOffset.x/S_Width);

    _lineView.frame=CGRectMake(view_x*S_Width/3.0,64+50,S_Width/3.0,2);

    for(inti =0; i <3; i++) {

        UIButton*newBtn = [self.viewviewWithTag:20+i];

        if(newBtn.tag-20== view_x) {

            [newBtnsetTitleColor:[UIColor orangeColor] forState:UIControlStateNormal];

        }else{

            [newBtnsetTitleColor:[UIColor blueColor] forState:UIControlStateNormal];

        }

    }

}

                                                                       分割线


亦可为视图添加数据,表格/网格、走定义标表格/网格

1.添加自定义表格

-(void)creatTableView{

    for(inti =0; i <3; i++) {

        UITableView *tableview = [[UITableView alloc]initWithFrame:CGRectMake(S_Width * i, 0, S_Width, _bigScrollView.bounds.size.height) style:UITableViewStylePlain];

        tableview.tag=100+ i;

        tableview.delegate=self;

        tableview.dataSource=self;

        tableview.rowHeight=80;

        [tableviewregisterClass:[oneTableViewCell class] forCellReuseIdentifier:@"oneTableViewCell"];

        [tableviewregisterClass:[twoTableViewCell class] forCellReuseIdentifier:@"twoTableViewCell"];

        [tableviewregisterClass:[threeTableViewCell class] forCellReuseIdentifier:@"threeTableViewCell"];

        [_bigScrollViewaddSubview:tableview];

    }

}

2.表格协议方法

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

    return 1;

}

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

    return 10;

}

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

    if(tableView.tag==100) {

        oneTableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"oneTableViewCell"];

        returncell;

    }elseif(tableView.tag==101){

        twoTableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"twoTableViewCell"];

        returncell;

    }else{

        threeTableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"threeTableViewCell"];

        returncell;

    }

}

3.自定义cell

    3.1声明cell中所需要的属性:

        @property(nonatomic,strong)UIImageView *pic;

        @property(nonatomic,strong)UILabel *title;

        @property(nonatomic,strong)UILabel *desTitle;

        @property(nonatomic,strong)UILabel *timeTitle;

3.2懒加载进行视图布局

  -(instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString*)reuseIdentifier{

    if(self= [superinitWithStyle:stylereuseIdentifier:reuseIdentifier]) {

        [self.contentViewaddSubview:self.pic];

        [self.contentViewaddSubview:self.title];

        [self.contentViewaddSubview:self.desTitle];

        [self.contentViewaddSubview:self.timeTitle];

    }

    return self;

}

-(UIImageView *)pic{

    if(!_pic) {

        _pic = [[UIImageView alloc]initWithFrame:CGRectMake(10, 5, 60, 60)];

        _pic.layer.cornerRadius = _pic.bounds.size.width / 2;

        _pic.layer.masksToBounds = YES;

        _pic.backgroundColor = [UIColor redColor];

    }

    return _pic;

}

-(UILabel*)title{

    if(!_title) {

        _title = [[UILabel alloc]initWithFrame:CGRectMake(80, 5, 200, 28)];

        _title.backgroundColor = [UIColor yellowColor];

    }

    return _title;

}

-(UILabel*)desTitle{

    if(!_desTitle) {

        _desTitle = [[UILabel alloc]initWithFrame:CGRectMake(80, 37, 200, 28)];

        _desTitle.backgroundColor = [UIColor purpleColor];

    }

    return _desTitle;

}

-(UILabel*)timeTitle{

    if (!_timeTitle) {

        _timeTitle = [[UILabel alloc]initWithFrame:CGRectMake(330, 25, 80, 30)];

        _timeTitle.backgroundColor = [UIColor blueColor];

    }

    return _timeTitle;

}

4.点击表格亦可进行下一级界面跳转

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

    if(tableView.tag==100) {

        FourViewController *vc = [[FourViewController alloc]init];

        [self.navigationController pushViewController:vc animated:YES];

    }elseif(tableView.tag==101){

        FourViewController *vc = [[FourViewController alloc]init];

        [self.navigationController pushViewController:vc animated:YES];

    }else{

        FourViewController *vc = [[FourViewController alloc]init];

        [self.navigationController pushViewController:vc animated:YES];

    }

}

上一篇下一篇

猜你喜欢

热点阅读