登录 立即注册
金钱:

Code4App-iOS开发-iOS 开源代码库-iOS代码实例搜索-iOS特效示例-iOS代码例子下载-Code4App.com

仿简书个人页面

[复制链接]
来自: 李世铿 分类: iOS精品源码 上传时间: 2016-5-20 12:11:05
Tag:个人首页 简书 个人

项目介绍:

文:徐老茂 (简书作者)


一直觉得个人页面挺有意思的,今天就写了一个仿个人页面的demo,这里只是给大家一个思路,写的不一定好。


在写的时候我想了很多,先想如果它整体是个tableview的话,那动态文章那个view可以设为sectionView,这样没问题,可是下面的cell里面就要用scrollerview,scrollerview里面又是tableview,这样总是会scrollerview里面的tableview就会吸收整个tableview的滑动事件.然后我就整体用一个scrollerview,下面也是一个scrollerview,动态,文章和更多那个view就在滑动的代理方法里判断scrollerview的contentOffset.y是否超过一个临界值,如果超过就让他scrollerview的contentoffset停留在那里不动.具体的看看代码吧,我是用storyboard写的.

1.png


然后看看代码吧.

[Objective-C] 查看源文件 复制代码
#import "ViewController.h"
#import "UIView+UIView_Add.h"
#define SCREEN_HEIGHT     ([[UIScreen mainScreen] bounds].size.height)
#define SCREEN_WIDTH      ([[UIScreen mainScreen] bounds].size.width)
@interface ViewController ()<UIScrollViewDelegate,UITableViewDataSource,UITableViewDelegate>
@property (strong, nonatomic) IBOutlet UIImageView *userImg;
@property (strong, nonatomic) IBOutlet UITableView *wenjiTableView;
@property (strong, nonatomic) IBOutlet UINavigationBar *navBar;
@property (strong, nonatomic) IBOutlet UIButton *bianjiBtn;
@property (strong, nonatomic) IBOutlet UIView *selectView;

@property (strong, nonatomic) IBOutlet UIScrollView *scrollview;
@property (strong, nonatomic) IBOutlet UIButton *dongtaiBtn;
@property (strong, nonatomic) IBOutlet UIButton *wenzhangBtn;
@property (strong, nonatomic) IBOutlet UIView *huakuaiView;
@property (strong, nonatomic) IBOutlet UIButton *moreBtn;
@property (strong, nonatomic) IBOutlet UIView *moreView;
@property (strong, nonatomic) IBOutlet UIScrollView *subScroll;
@property (strong, nonatomic) IBOutlet UITableView *dongtaiTableView;
@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    //头像和编辑按钮的的设置
    _userImg.layer.masksToBounds = YES;
    _userImg.layer.cornerRadius = 30;
    _navBar.barTintColor = [UIColor whiteColor];
    _navBar.clipsToBounds = NO;
    _bianjiBtn.layer.masksToBounds = YES;
    _bianjiBtn.layer.borderColor = [UIColor colorWithRed:0.53 green:0.91 blue:0.56 alpha:1].CGColor;
    _bianjiBtn.layer.borderWidth = 1;
    _bianjiBtn.layer.cornerRadius = 3;
    //在小的scrollerview里面添加2个tableview和一个view
    _subScroll.contentSize = CGSizeMake(SCREEN_WIDTH * 3, SCREEN_HEIGHT);
    _moreView.x = SCREEN_WIDTH * 2;
    _moreView.width = SCREEN_WIDTH;
    [_subScroll addSubview:_moreView];
    _wenjiTableView.x = SCREEN_WIDTH ;
    [_subScroll addSubview:_wenjiTableView];
    _dongtaiTableView.x = 0;
    [_subScroll addSubview:_dongtaiTableView];
}
#pragma mark UIScrollViewDelegate
-(void)scrollViewDidScroll:(UIScrollView *)scrollView
{
    //当整体滑动到一个临界值时将tableview设为可滑动或者不可活动
    if (_scrollview.contentOffset.y / 3 <= 53.00 && _wenjiTableView.contentOffset.y <= 0.1) {
        [_wenjiTableView setScrollEnabled:NO];
    }
    if (_scrollview.contentOffset.y / 3 <= 53.00 && _dongtaiTableView.contentOffset.y <= 0.1) {
        [_dongtaiTableView setScrollEnabled:NO];
    }
    //左右滑动小的scrollerview让文字颜色改变和小滑块滑动
    if (scrollView == _subScroll) {
        CGFloat i = _subScroll.contentOffset.x / SCREEN_WIDTH;
        if (i == 0) {
            _dongtaiBtn.selected = YES;
            _wenzhangBtn.selected = NO;
            _moreBtn.selected = NO;
            [UIView animateWithDuration:0.5 animations:^{
                _huakuaiView.centerX = _dongtaiBtn.centerX;
            }];
        }else if ( i == 1){
            _wenzhangBtn.selected = YES;
            _dongtaiBtn.selected = NO;
            _moreBtn.selected = NO;
            [UIView animateWithDuration:0.5 animations:^{
                _huakuaiView.centerX = _wenzhangBtn.centerX;
            }];
            [UIView animateWithDuration:0.5 animations:^{
                _subScroll.contentOffset = CGPointMake(SCREEN_WIDTH , 0);
            }];
        }else if (i == 2){
            _moreBtn.selected = YES;
            _dongtaiBtn.selected = NO;
            _wenzhangBtn.selected = NO;
            [UIView animateWithDuration:0.5 animations:^{
                _huakuaiView.centerX = _moreBtn.centerX;
            }];
            [UIView animateWithDuration:0.5 animations:^{
                _subScroll.contentOffset = CGPointMake(SCREEN_WIDTH * 2, 0);
            }];
        }
        return;
    }
    if (scrollView == _scrollview) {
        CGFloat contentY = _scrollview.contentOffset.y / 3;
        if (contentY <= 25 && contentY >= 0) {
            //改变头像的大小
            [_userImg setHeight:60 - contentY];
            _userImg.centerX = self.view.centerX;
            [_userImg setWidth:60 - contentY];
            _userImg.layer.cornerRadius = _userImg.width/2;
        }
        if (contentY >= 53) {
            //让scrollerview停留之
            _scrollview.contentOffset = CGPointMake(0, 53 * 3);
            [_wenjiTableView setScrollEnabled:YES];
            [_dongtaiTableView setScrollEnabled:YES];
        }
    }
}
//点击按钮的动作

- (IBAction)dongtaiAction:(UIButton *)sender {
    sender.selected = YES;
    _wenzhangBtn.selected = NO;
    _moreBtn.selected = NO;
    [UIView animateWithDuration:0.5 animations:^{
         _huakuaiView.centerX = sender.centerX;
    }];
    [UIView animateWithDuration:0.5 animations:^{
        _subScroll.contentOffset = CGPointMake(0, 0);
        _scrollview.contentOffset = CGPointMake(0, 159);
    }];
    [self changeImage];

}

- (IBAction)wenzhangAction:(UIButton *)sender {
    sender.selected = YES;
    _dongtaiBtn.selected = NO;
    _moreBtn.selected = NO;
    [UIView animateWithDuration:0.5 animations:^{
        _huakuaiView.centerX = sender.centerX;
    }];
    [UIView animateWithDuration:0.5 animations:^{
        _subScroll.contentOffset = CGPointMake(SCREEN_WIDTH , 0);
         _scrollview.contentOffset = CGPointMake(0, 159);
    }];
    [self changeImage];
}
- (IBAction)moreAction:(UIButton *)sender {
    sender.selected = YES;
    _dongtaiBtn.selected = NO;
    _wenzhangBtn.selected = NO;
    [UIView animateWithDuration:0.5 animations:^{
        _huakuaiView.centerX = sender.centerX;
    }];
    [UIView animateWithDuration:0.5 animations:^{
        _subScroll.contentOffset = CGPointMake(SCREEN_WIDTH * 2, 0);
         _scrollview.contentOffset = CGPointMake(0, 159);
    }];
    [self changeImage];
}

-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
    if ([tableView isEqual:_dongtaiTableView]) {
        return 100;
    }
    return 100;
}

-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    if ([tableView isEqual:_dongtaiTableView]) {
        UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"dongtaicell" forIndexPath:indexPath];
        return cell;
    }
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"wenzhangcell" forIndexPath:indexPath];
    return cell;
}

-(void)changeImage
{
    [UIView animateWithDuration:0.5 animations:^{
        CGRect frame = _userImg.frame;
        frame.size.height = 36.57;
        frame.size.width = 35.5;
        _userImg.frame = frame;
        _userImg.layer.cornerRadius = _userImg.width / 2;
        _userImg.centerX = self.view.centerX;
    }];
}

- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}

@end



里面写了主要的注释,思路差不多就是这样,也是可以理解的,但是在上下滑动滑动到临界值时总是有点卡顿,这是因为在-(void)scrollViewDidScroll: (UIScrollView *)scrollView方法里面判断滑动的临界值然后再决定tableview是否可以滑动,这肯定是会卡主,要松手再划一下才能行,还有一个bug就是当头像放大了之后,点击中间的按钮时,头像会先变方,然后缩小变圆,我估计是和cornerRadius的使用有很大关系吧.而且简书app上面也是这个bug.这2个问题我还没想到更好的解决方法,如果有知道的朋友可以简单的给我指点一下.谢谢大家.
好了,今天就到这里了,住大家天天开心he'he

DEMO下载:




相关源码推荐:

我来说两句
*滑动验证:
所有评论(184)
墨染风 2016-5-20 12:41:05
虽不明,但觉厉!
回复
songismxs 2016-5-20 13:45:19
我只是路过打酱油的。
回复
那些年の执着 2016-5-20 14:38:47
强烈支持楼主ing……
回复
刘成 2016-5-20 14:47:38
虽不明,但觉厉!
回复
埋头干 2016-5-20 16:00:48
学习学习!
回复
1467306558 2016-5-20 16:44:23
学习学习!
回复
1467306558 2016-5-20 16:45:44
精华内容,楼主V5!
回复
阶梯8 2016-5-20 17:22:03
我发现你好强呀
回复
阶梯8 2016-5-20 17:22:38
虽不明,但觉厉!
回复
提取码:  下载次数:254 状态:已购或VIP 售价:0(原价:10)金钱 下载权限:初级码农 
5122 0 254
联系我们
首页/微信公众账号投稿

帖子代码编辑/版权问题

QQ:435399051,742864542

如何获得代码达人称号?

代码贡献英雄榜
用户名 下载数
通过邮件订阅最新 Code4App 信息
上一条 /4 下一条
联系我们
关闭
合作电话:
13802416937
Email:
435399051@qq.com
商务市场合作/投稿
问题反馈及帮助
联系我们

广告投放| Github|申请友链|手机版|Code4App ( 粤ICP备15117877号-1 )

快速回复 返回顶部 返回列表