喜马拉雅FM

效果图

步骤:
MVC设计模式
一 , 拖入AFNetworiing
二 , 打开网络请求
三 , 创建

1. MyModel , 继承于object
2. HeaderView (头部视图) , 继承于UIView
3. MyCell , XML , 继承于 UITableViewCell

4. AppDelegate创建导航控制器

   四 , 代码
   MyModel.h

#import <Foundation/Foundation.h>

@interface MyModel : NSObject
@property(nonatomic,strong) NSString *coverLarge,*createdAt,*playtimes,*duration,*likes,*title;
@end

MyModel.m

#import "MyModel.h"

@implementation MyModel
-(void)setValue:(id)value forUndefinedKey:(NSString *)key{

}
@end

HeaderView.h

#import <UIKit/UIKit.h>

@interface HeaderView : UIView
@property (nonatomic , strong)UIImageView *imageView;
@property (nonatomic , strong)UIImageView *imageView2;
@property (nonatomic , strong)UILabel *label1;
@property (nonatomic , strong)UILabel *label2;
@property (nonatomic , strong)UILabel *label3;
@property (nonatomic , strong)UILabel *label4;
- (void)setValueHeaderView:(NSDictionary *)dic;
@end

HeaderView.m

#import "HeaderView.h"

@implementation HeaderView
-(instancetype)initWithFrame:(CGRect)frame{
    if ([super initWithFrame:frame]) {
        [self addView];
    }
    return self;
}
-(void)setValueHeaderView:(NSDictionary *)dic{
    //此处   "+++   dic[@"coverOrigin"]  +++" ,  @""内名字取鬼脸内相对应数据的名字
    NSLog(@"_____________________________________________-%@",dic);
    self.imageView.image = [UIImage imageWithData:[NSData dataWithContentsOfURL:[NSURL URLWithString:dic[@"coverOrigin"]]]];
    self.imageView2.image = [UIImage imageWithData:[NSData dataWithContentsOfURL:[NSURL URLWithString:dic[@"avatarPath"]]]];
    self.label1.text = dic[@"customTitle"];
    self.label2.text = dic[@"shortIntro"];
    self.label4.text = dic[@"categoryName"];
//    时间缀   label 3   是 时间 需要转换
    NSString *timeStampString = [NSString stringWithFormat:@"%@",dic[@"lastUptrackAt"]];
    NSTimeInterval interval = [timeStampString doubleValue] /1000.0;
    NSDate *date = [NSDate dateWithTimeIntervalSince1970:interval];
    NSDateFormatter *formatter = [[NSDateFormatter alloc] init];
    //年-月-日
    [formatter setDateFormat:@"yyyy-MM-dd"];
    self.label3.text = [NSString stringWithFormat:@"%@更新",[formatter stringFromDate:date]];
}
- (void)addView{
    _imageView = [[UIImageView alloc]initWithFrame:CGRectMake(10, 10, 100, 110)];
    [self addSubview:_imageView];

    _label1 = [[UILabel alloc]initWithFrame:CGRectMake(120, 10, self.frame.size.width - 120, 30)];
    _label1.font = [UIFont systemFontOfSize:14];
    _label1.textColor = [UIColor lightGrayColor];
    _label1.numberOfLines = 0;
    [self addSubview:_label1];

    _imageView2 =[[UIImageView alloc]initWithFrame:CGRectMake(120, 40, 20, 20)];
    _imageView2.layer.cornerRadius = 10;
    _imageView2.layer.masksToBounds = YES;
    [self addSubview:_imageView2];

    _label2 = [[UILabel alloc]initWithFrame:CGRectMake(150, 40, self.frame.size.width- 180, 20)];
    _label2.font = [UIFont systemFontOfSize:12];
    _label2.textColor = [UIColor lightGrayColor];
    [self addSubview:_label2];

    _label3 = [[UILabel alloc]initWithFrame:CGRectMake(120, 70, self.frame.size.width- 100, 20)];
    _label3.font = [UIFont systemFontOfSize:12];
    _label3.textColor = [UIColor lightGrayColor];
    [self addSubview:_label3];

    _label4 = [[UILabel alloc]initWithFrame:CGRectMake(120, 100, self.frame.size.width- 100, 20)];
    _label4.font = [UIFont systemFontOfSize:12];
    _label4.textColor = [UIColor lightGrayColor];
    [self addSubview:_label4];

    NSArray * array = @[@"订阅（609）",@"分享",@"播放"];
    for (int i =0; i<array.count; i++) {

        UIButton * btn = [[UIButton alloc]initWithFrame:CGRectMake(50 + (self.frame.size.width - 160)/2 * i + 20*i, 130, 20, 20)];
        [btn setBackgroundImage:[UIImage imageNamed:@"分享"] forState:UIControlStateNormal];
        UILabel * label = [[UILabel alloc]initWithFrame:CGRectMake(i* (self.frame.size.width/3), 180, self.frame.size.width/3, 20)];
        label.textAlignment = NSTextAlignmentCenter;
        label.center = CGPointMake(btn.center.x, 160);
        label.textColor = [UIColor lightGrayColor];
        label.text = array[i];
        label.font= [UIFont systemFontOfSize:12];
        [self addSubview:btn];
        [self addSubview:label];
    }
}
@end

MyCell.xib

MyCell.h

#import <UIKit/UIKit.h>
#import "MyModel.h"
@interface MyCell : UITableViewCell
//拖拽顺序 : 从左到右从上到下  下载图片是固定不变的 所以不用拖
@property (weak, nonatomic) IBOutlet UIImageView *imageView1;
@property (weak, nonatomic) IBOutlet UILabel *label1;
@property (weak, nonatomic) IBOutlet UILabel *label2;
@property (weak, nonatomic) IBOutlet UILabel *label3;
@property (weak, nonatomic) IBOutlet UILabel *label4;
@property (weak, nonatomic) IBOutlet UILabel *label5;
- (void)setValueForCell:(MyModel *)model;
@end

MyCell.m

#import "MyCell.h"

@implementation MyCell
-(void)setValueForCell:(MyModel *)model{
    if (model) {

        self.imageView1.image = [UIImage imageWithData:[NSData dataWithContentsOfURL:[NSURL URLWithString:model.coverLarge]]];
        self.label1.text = model.title;
        //时间戳
        NSString * timeStampString  = [NSString stringWithFormat:@"%@",model.createdAt];
        NSTimeInterval interval = [timeStampString doubleValue] /1000.0;
        NSDate * date = [NSDate dateWithTimeIntervalSince1970:interval];
         NSDateFormatter *formatter = [[NSDateFormatter alloc]init];
        [formatter setDateFormat:@"yyyy-MM"];
        self.label2.text = [formatter stringFromDate: date];
        self.label3.text = [NSString stringWithFormat:@"%@万",model.duration];
        self.label4.text = [NSString stringWithFormat:@"%@?",model.likes];
        self.label5.text = [NSString stringWithFormat:@"⏰%@",model.playtimes];
    }
}
@end

ViewController.m

#import "ViewController.h"
#import "HeaderView.h"
#import "MyCell.h"
#import "MyModel.h"
#import "AFHTTPSessionManager.h"
#define JSON_URL @"http://iappfree.candou.com:8080/free/categories/free"
#define WIDTH self.view.frame.size.width
#define HEIGHT self.view.frame.size.height
@interface ViewController ()<UITableViewDelegate,UITableViewDataSource,UIScrollViewDelegate>
@property(nonatomic,strong) UITableView * tableView;
@property(nonatomic,strong) HeaderView * headerView;
@property(nonatomic,strong) NSMutableArray * dataSource;
//顶部移动视图
@property (nonatomic,strong) UIView *moveView;
@property(nonatomic,strong) UIView * titleView;
@property(nonatomic,strong) UIScrollView * bigScrollView;
@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    [self setNav];

    self.headerView = [[HeaderView alloc]initWithFrame:CGRectMake(0, 0, WIDTH, 180)];
    [self.view addSubview:self.headerView];
    [self.view addSubview:self.bigScrollView];
    //移动视图
    [self createMoveView];


    [self requestData];
}
-(void)createMoveView{
    //创建顶部移动视图：
    _titleView = [[UIView alloc]initWithFrame:CGRectMake(0, 180, WIDTH, 44)];
    _moveView = [[UIView alloc]initWithFrame:CGRectMake(30,35, (WIDTH-180)/3, 2)];
    _moveView.backgroundColor = [UIColor orangeColor];
    [_titleView addSubview:_moveView];
    //循环创建按钮：
    NSArray *btnTitleArr = [NSArray arrayWithObjects:@"简介",@"节目(29)",@"找相似", nil];
    for (int i = 0; i < btnTitleArr.count; i++) {
        UIButton *btn = [UIButton buttonWithType:UIButtonTypeRoundedRect];
        //设置按钮的颜色：
        if (i == 0) {
            [btn setTitleColor:[UIColor orangeColor] forState:UIControlStateNormal];
        }else{
            [btn setTitleColor:[UIColor lightGrayColor] forState:UIControlStateNormal];
        }

        btn.tag = 100 + i;
        btn.frame = CGRectMake(i *( WIDTH/3), 5, WIDTH/3, 20);
        btn.titleLabel.font = [UIFont systemFontOfSize:15 weight:0.2];
        [btn setTitle:[btnTitleArr objectAtIndex:i] forState:UIControlStateNormal];
        [btn addTarget:self action:@selector(moveClick:) forControlEvents:UIControlEventTouchUpInside];
        [_titleView addSubview:btn];
    }
    [self.view addSubview:_titleView];
}
-(UIScrollView *)bigScrollView{

    if (!_bigScrollView) {
        _bigScrollView = [[UIScrollView alloc]initWithFrame:CGRectMake(0, 200, WIDTH, HEIGHT - 200)];
        _bigScrollView.delegate = self;
        _bigScrollView.contentSize = CGSizeMake(WIDTH * 3, HEIGHT-200);
        _bigScrollView.pagingEnabled = YES;
        _bigScrollView.bounces = YES;
        NSArray * array = @[@"7",@"8",@"7"];
        for (int i =0; i< array.count; i++) {

            if (i==0) {
                [_bigScrollView addSubview:self.tableView];
            }
            else{
                UITableView * tableView = [[UITableView alloc]initWithFrame:CGRectMake(i * WIDTH, 20, WIDTH, HEIGHT - 200)];
                tableView.tag = 2000 + i;
                tableView.dataSource = self;
                tableView.delegate = self;
                [_bigScrollView addSubview:tableView];
            }
        }
    }
    return _bigScrollView;
}
-(void)scrollViewDidScroll:(UIScrollView *)scrollView{
    if (scrollView == self.bigScrollView) {
        //根据当前视图的偏移量设置当前的按钮位置提示：
        _moveView.frame = CGRectMake(30 +(scrollView.contentOffset.x/WIDTH) * ((WIDTH-180)/3 +60), 35, (WIDTH-180)/3, 2);
        //根据当前的偏移量改变标题颜色：
        for (int i = 0; i <3; i++) {
            //根据tag获取按钮
            UIButton *btn1 = [self.titleView viewWithTag:100 + i];
            if (scrollView.contentOffset.x / WIDTH == (btn1.tag - 100)) {
                [btn1 setTitleColor:[UIColor orangeColor] forState:UIControlStateNormal];
            }else{
                [btn1 setTitleColor:[UIColor darkGrayColor] forState:UIControlStateNormal];
            }
        }
    }
}
-(void)moveClick:(UIButton *)btn{
    //根据点击位置改变moveView的位置
    _moveView.frame = CGRectMake( 30 +(btn.tag - 100) *((WIDTH-180)/3 +60), 35, (WIDTH-180)/3, 2);
    //根据点击的按钮改变UIscrollView的位置：
    [_bigScrollView setContentOffset:CGPointMake((btn.tag - 100) * WIDTH, 0)];
    //点击按钮改变标题颜色：
    for (int i = 0; i < 3; i++) {
        //根据tag获取按钮
        UIButton *btn1 = [_titleView viewWithTag:100 + i];

        if (btn.tag == btn1.tag) {
            [btn1 setTitleColor:[UIColor orangeColor] forState:UIControlStateNormal];
        }else{
            [btn1 setTitleColor:[UIColor lightGrayColor] forState:UIControlStateNormal];
        }
    }
}
-(void)requestData{

    AFHTTPSessionManager * mannage = [AFHTTPSessionManager manager];
    mannage.responseSerializer.acceptableContentTypes = [NSSet setWithObject:@"text/plain"];
    NSString *urlString = @"http://mobile.ximalaya.com/mobile/v1/album/ts-1531886212572?ac=4G&albumId=14659743&device=iPhone&isAsc=true&pageSize=20&source=0&statEvent=pageview%2Falbum%4012610571&statModule=精品&statPage=tab%40发现_推荐&statPosition=1";
    //url中含有中文解决方法
    NSString* encodedString = [urlString stringByAddingPercentEscapesUsingEncoding:NSUTF8StringEncoding];
    //他的这两个回调实在主线程里执行的,所以直接可以做UI操作
    [mannage GET:encodedString parameters:nil headers:nil progress:^(NSProgress * _Nonnull downloadProgress) {

    } success:^(NSURLSessionDataTask * _Nonnull task, id  _Nullable responseObject) {
        //数据请求成功的回调

        NSDictionary * dic = responseObject[@"data"][@"album"];
        [self.headerView setValueHeaderView:dic];

        self.dataSource = [[NSMutableArray alloc]init];
        for (NSDictionary * dic in responseObject[@"data"][@"tracks"][@"list"]) {
            MyModel * model = [MyModel new];
            [model setValuesForKeysWithDictionary:dic];
            [self.dataSource addObject:model];
        }
        dispatch_async(dispatch_get_main_queue(), ^{
            //刷新表格
            [self.tableView reloadData];

        });

    } failure:^(NSURLSessionDataTask * _Nullable task, NSError * _Nonnull error) {
        //请求失败的操作
        NSLog(@"%@",error.description);
    }];
}
-(void)setNav{
    self.title = @"专辑详情";
    self.navigationItem.rightBarButtonItem = [[UIBarButtonItem alloc]initWithTitle:@"..." style:UIBarButtonItemStylePlain target:self action:nil];
    self.navigationItem.leftBarButtonItem = [[UIBarButtonItem alloc]initWithTitle:@"<" style:UIBarButtonItemStylePlain target:self action:nil];
    self.navigationController.navigationBar.translucent = NO;
}
-(UITableView *)tableView{
    if (!_tableView) {
        _tableView = [[UITableView alloc]initWithFrame:CGRectMake(0,20, WIDTH, HEIGHT- 180) style:UITableViewStylePlain];
    }
    _tableView.delegate = self;
    _tableView.dataSource = self;
    [_tableView registerNib:[UINib nibWithNibName:@"MyCell" bundle:nil] forCellReuseIdentifier:@"cell"];
    return _tableView;
}
-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
    return self.dataSource.count;
}
-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
    MyCell * cell = [tableView dequeueReusableCellWithIdentifier:@"cell"];
    if (self.dataSource.count >0) {

        [cell setValueForCell:self.dataSource[indexPath.row]];
    }
    return cell;
}
-(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath{
    return 80;
}
-(void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath{

    [tableView deselectRowAtIndexPath:indexPath animated:NO];
}

@end