iOS 陌陌客户端 首页切换的那个 类似pageControl 小圆点 切换的动画 怎么实现的?
迷茫
迷茫 2017-04-17 14:36:28
[iOS讨论组]

就是首页切换的时候pageControl 小圆点 有那种拉扯的感觉,这种效果是怎么实现的啊?谁有类似的开源项目 能告诉我 来学习学习吗?

迷茫
迷茫

业精于勤,荒于嬉;行成于思,毁于随。

全部回复(1)
阿神

看了一下小圆点 简单实现了下

#import "ViewController.h"

#define ITEM_SIZE   10
#define DISTANCE    20

@interface ViewController ()<UIScrollViewDelegate>
@end

@implementation ViewController {
    UIView *_vCircle;
}

- (void)viewDidLoad {
    [super viewDidLoad];

    UIScrollView *sv = [UIScrollView new];
    sv.delegate = self;
    [self.view addSubview:sv];

    [sv makeConstraints:^(MASConstraintMaker *make) {
        make.edges.equalTo(self.view);
    }];

    UIView *vContain = [UIView new];
    vContain.backgroundColor = [UIColor grayColor];
    [sv addSubview:vContain];

    [vContain makeConstraints:^(MASConstraintMaker *make) {
        make.edges.equalTo(sv);
        make.height.equalTo(self.view.height);
        make.width.equalTo(self.view).multipliedBy(2);
    }];

    _vCircle = [UIView new];
    _vCircle.backgroundColor = [UIColor redColor];
    _vCircle.layer.masksToBounds = YES;
    _vCircle.layer.cornerRadius = ITEM_SIZE / 2.;
    [self.view addSubview:_vCircle];

    [_vCircle makeConstraints:^(MASConstraintMaker *make) {
        make.centerX.equalTo(self.view);
        make.top.equalTo(20);
        make.size.equalTo(CGSizeMake(ITEM_SIZE, ITEM_SIZE));
    }];
}

///基本思路是在横向滑动过程中改变小圆点的宽和X坐标
- (void)scrollViewDidScroll:(UIScrollView *)scrollView {
    CGFloat percent = scrollView.contentOffset.x / scrollView.contentSize.width * 2;
    percent = MIN(1, MAX(0, percent));

///小圆点是先变宽 移动到一半后开始恢复
    CGFloat scalePercent = percent < .5 ? percent : 1 - percent;

    [_vCircle updateConstraints:^(MASConstraintMaker *make) {
        make.width.equalTo(ITEM_SIZE + ITEM_SIZE * scalePercent);
        make.centerX.equalTo(DISTANCE * percent);
    }];
    [_vCircle layoutIfNeeded];
}

@end

顺手写的 如果没有masonry 稍微改动下就好了

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号