iOS－仿网易新闻首页（上篇）

高仿网易新闻，实现头部滚动条的滚动和每个按钮对应的界面（包括tableView,webView）以及有tableView的不同cell风格，在选中的按钮下方指示器。

首先创建一个类 “NewsHeadView.h”继承于UIView，声明相应的属性：tagFromView－是Viewcontroller中页面被拖动后穿过来的应该选中的按钮的tag值；myScrollView－就是页面头部的滚动条；dataArray－作为滚动条上的按钮的数据源；linVew：作为被选中按钮下方的指示器，

下面这段代码是NewsHeadView.h文件

#import <UIKit/UIKit.h>

@protocol NewsHeadViewDelegate <NSObject>

- (void)NewsHeadViewTransLatebuttonTag:(NSInteger)tag SubId:(NSString *)subId type:(NSString *)type;

@end

@interface NewsHeadView : UIView

@property (nonatomic,assign) NSInteger tagFromView;//要接收的按钮的tag值

@property (nonatomic,strong) NSArray *dataArray;//数据

@property (nonatomic,strong) UIView *linVew;//按钮的指示View

@property (nonatomic,strong) UIScrollView *myScrollView;

@property (nonatomic,weak) id<NewsHeadViewDelegate>delegate;

@end

- (void)NewsHeadViewTransLatebuttonTag:(NSInteger)tag SubId:(NSString *)subId type:(NSString *)type;、

该方法作为代理传值方法，把当前选中的按钮的相关数据传到congtroller中。其中tag－当前被选中的按钮的tag值；subId－该ID作为请求对应按钮的列表数据；type－用于判断当前按钮对应的要展示出的按钮的类型。

在上面完成了NewsHeadView.h文件后，下面就来实现NewsHeadView.m文件，那么就带大家一步一步来实现：

第一部分：添加下面这段代码来声明几个需要的变量

@property (nonatomic,strong) NSMutableArray *buttonArray;//存放创建的所有按钮按钮

@property (nonatomic,strong) NSMutableArray *btnOrignXArray;//存放每个按钮的横坐标的起点

@property (nonatomic,strong) NSMutableArray *btnWArray;//存放每个按钮的宽度

@property (nonatomic,assign) NSInteger currentTag;//当前被选中按钮的tag值

第二部分：对当前按钮的tag值currentTag 初始化为 1 ；添加myScrollView滚动条，用来装载多个按钮

- (instancetype)initWithFrame:(CGRect)frame{

    self = [superinitWithFrame:frame];

    if (self) {

//初始化数据

        self.currentTag =1;

        self.buttonArray = [NSMutableArrayarray];

        self.btnOrignXArray = [NSMutableArrayarray];

        self.btnWArray = [NSMutableArrayarray];

//添加滚动条

        myScrollView = [[UIScrollViewalloc] initWithFrame:CGRectMake(0,0, myWidth,myHeight)];

        myScrollView.backgroundColor = [UIColorcolorWithWhite:0.90alpha:1];

        myScrollView.showsHorizontalScrollIndicator =NO;

        myScrollView.delegate =self;

        [selfaddSubview:myScrollView];

//添加指示器

        linVew = [[UIViewalloc] init];

        linVew.backgroundColor = [UIColorcolorWithRed:0.1green:0.6blue:0.8alpha:1];

        [myScrollViewaddSubview:linVew];

    }

    returnself;

}

第三部分：当拿到按钮菜单的数据后，下面就来创建按钮；

orignX －每个按钮的横坐标起始值； buttonH－按钮的高度； btnW－按钮的宽度

#pragma mark - 按钮

- (void)setDataArray:(NSArray *)dataArray{

    _dataArray = dataArray;

    CGFloat orignX =0;

    CGFloat buttonH =myHeight-CGRectGetHeight(linVew.frame);

    for (NSInteger i =0; i < self.buttonArray.count; i++) {

        UIButton *btn =self.buttonArray[i];

        [btn removeFromSuperview];

    }

    [self.buttonArrayremoveAllObjects];

    [self.btnOrignXArrayremoveAllObjects];

    [self.btnWArrayremoveAllObjects];

    for (NSInteger i =0; i < dataArray.count; i++) {

        UIButton *button = [UIButtonbuttonWithType:UIButtonTypeCustom];

        NSString *title = [NSStringstringWithFormat:@"%@",[dataArray[i]objectForKey:@"name"]];

        CGSize size = [titlesizeWithfont:[UIFontsystemFontOfSize:17.0f]maxSize:CGSizeMake(CGFLOAT_MAX, buttonH)];

        CGFloat btnW = size.width+20;

        [self.btnWArrayaddObject:@(btnW)];

        button.frame =CGRectMake(orignX, 0, btnW, buttonH);

        [button setTitle:titleforState:UIControlStateNormal];

        button.titleLabel.font = [UIFontsystemFontOfSize:15.0f];

        if (i ==self.currentTag-1) {

            button.selected =YES;

            button.titleLabel.font = [UIFontsystemFontOfSize:17.0f];

            linVew.frame =CGRectMake(orignX, myHeight-2, btnW,2);

        }

        [self.btnOrignXArrayaddObject:@(orignX)];        orignX += btnW;

        [button setTitleColor:[UIColorblackColor] forState:UIControlStateNormal];

        [button setTitleColor:[UIColorcolorWithRed:0.1green:0.6blue:0.8alpha:1]forState:UIControlStateSelected];

        button.tag = i+1;

        [button addTarget:selfaction:@selector(btnClicked:)forControlEvents:UIControlEventTouchUpInside];

        [myScrollViewaddSubview:button];

        [self.buttonArrayaddObject:button];

        if (i == dataArray.count-1) {

            myScrollView.contentSize = CGSizeMake(CGRectGetMaxX(button.frame),myHeight);

        }

    }

}

第四部分：对滚动条上的每个按钮的点击事件的进行处理

- (void)btnClicked:(UIButton *)sender{

    if (self.currentTag != sender.tag) {

        sender.selected = !sender.selected;

        sender.titleLabel.font = [UIFontsystemFontOfSize:17.0f];

        [selfchangeSelectButtonWithTag:sender.tag];

        [selfsetScrollViewContentOffsetWithButton:sender];

        NSString * subid = [self.dataArray[sender.tag-1]objectForKey:@"subid"];

        NSString *type = [self.dataArray[sender.tag-1]objectForKey:@"type"];

        [self.delegateNewsHeadViewTransLatebuttonTag:sender.tagSubId:subid type:type];

    }else{

        return;

    }

}

第五部分：设置从controller传来的按钮的的tag值

- (void)setTagFromView:(NSInteger)tagFromView{

    _tagFromView = tagFromView;

    if (tagFromView !=self.currentTag) {

        //找到对应的按钮

        UIButton *button = (UIButton *)[selfviewWithTag:tagFromView];

        button.selected =YES;

        button.titleLabel.font = [UIFontsystemFontOfSize:17.0f];

        [selfchangeSelectButtonWithTag:tagFromView];

        [selfsetScrollViewContentOffsetWithButton:button];

        NSString * subid = [NSStringstringWithFormat:@"%@",[self.dataArray[tagFromView-1]objectForKey:@"subid"]];

        NSString *type = [self.dataArray[tagFromView-1]objectForKey:@"type"];

        [self.delegateNewsHeadViewTransLatebuttonTag:tagFromViewSubId:subid type:type];

    }else{

        return;

    }

}

第六部分：交换当前寻中的按钮和之前选中的按钮

- (void)changeSelectButtonWithTag:(NSInteger)tag{

    UIButton *btn = (UIButton *)[selfviewWithTag:self.currentTag];

    btn.selected =NO;

    btn.titleLabel.font = [UIFontsystemFontOfSize:15.0f];

    CGFloat orignX = [[self.btnOrignXArrayobjectAtIndex:tag-1]floatValue];

    CGFloat btnW = [[self.btnWArrayobjectAtIndex:tag-1]floatValue];

    linVew.frame =CGRectMake(orignX, myHeight-2, btnW,2);

    self.currentTag = tag;

}

第七部分：

#pragma mark - 调整滚动按钮显示

- (void)setScrollViewContentOffsetWithButton:(UIButton *)sender{

    CGFloat offsetX =CGRectGetMaxX(sender.frame) -myWidth/3*2;

    if (self.myScrollView.contentSize.width-offsetX < myWidth) {

        [self.myScrollViewsetContentOffset:CGPointMake(self.myScrollView.contentSize.width-myWidth,0) animated:YES];

    }else{

        if(offsetX >0){

            [self.myScrollViewsetContentOffset:CGPointMake(offsetX,0) animated:YES];

        }

        if(offsetX <0){

            [self.myScrollViewsetContentOffset:CGPointMake(0,0) animated:YES];

        }

    }

}

到此，就实现了NewsHeadView.h和NewsHeadView.m两个文件中的所有属性和方法，接下来就是congtroller中的具体实现，请参考下篇文章