iOS 轮播图(Banner)滑动时根据图片大小而改变自身高度
chenguangming9 · 254浏览量 · 发布于2020-11-13 +关注

作者MQTwist,源码AutoBanner,之前有小伙伴问我,轮播图(Banner)滑动时根据图片大小而改变自身高度,当时一想不是很难,细节拆分后也就几部分,但是就是懒,不想写。最近不是很忙,就动手撸了一遍。

第三方

  • 轮播用SDCycleScrollView

  • 想做到无侵入用Aspects

Aspects是什么?怎么用?

正文

核心细想就是,检测Banner滑动,实时计算高度。
用的UIScrollView的代理方法有:

  • - (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView;
    核心代码:

//记录当前位置
_currentOffSet = scrollView.contentOffset.x;
//改变contentSize,一定要改变height,因为有高度变化,如果一直为0或不变的话会闪
scrollView.contentSize = CGSizeMake(SCREEN_WIDTH * self.imageUrlArr.count, self.itemSize.height);
  • - (void)scrollViewDidScroll:(UIScrollView *)scrollView;
    核心代码:

CGFloat offset = scrollView.contentOffset.x;
if (offset == _currentOffSet) {
    return;
}
//偏移差,用来判断是左滑还是右滑
CGFloat offsetValue = offset - _currentOffSet;
//上一个图片的高度
NSDictionary *lastSizeDic = self.sizeArr[_lastIndex];
CGFloat lastHeight = [self getImageHWithImgW:lastSizeDic[@"width"] imgH:lastSizeDic[@"height"]];
//将要滑动到的图片的高度
NSInteger nextIndex = (offsetValue > 0) ? MIN(_lastIndex + 1, self.imageUrlArr.count - 1) : MAX(_lastIndex - 1, 0);
NSDictionary *nextSizeDic = self.sizeArr[nextIndex];
CGFloat nextHeight = [self getImageHWithImgW:nextSizeDic[@"width"] imgH:nextSizeDic[@"height"]];
//偏移量:偏移差取绝对值,用来计算实时高度
CGFloat offsetX = fabs(offsetValue);
//2图片的高度差
CGFloat value = lastHeight - nextHeight;
//单位位移下的缩放的距离
CGFloat scale = value / SCREEN_WIDTH;
self.itemSize = CGSizeMake(SCREEN_WIDTH, lastHeight - scale * offsetX);
NSLog(@">>>height %lf offsetValue:%lf", self.itemSize.height, offsetValue);
//改变contentSize,一定要改变height,因为有高度变化,如果一直为0或不变的话会闪
scrollView.contentSize = CGSizeMake(SCREEN_WIDTH * self.imageUrlArr.count, self.itemSize.height);
//可能丝滑了一点点
[UIView animateWithDuration:0 delay:0 options:UIViewAnimationOptionCurveLinear animations:^{
    self.headerView.frame = CGRectMake(0, 0, SCREEN_WIDTH, self.itemSize.height);
    self.tableView.tableHeaderView = self.headerView;
} completion:nil];
  • - (void)scrollViewDidEndScrollingAnimation:(UIScrollView *)scrollView;
    核心代码:

NSLog(@">>>index:%zd", index);_lastIndex = index;_currentOffSet = self.imageScrollView.contentOffset.x;

Demo地址

总结

其实没有什么复杂的点,就是一些简单的计算。

后记

总想写点什么,却又无从写起。

源码使用过程中,如无法搭建或有增加其他功能需求,可联系QQ:236-0248-666 ,付费搭建安装修改服务!
温馨提示:网站源码只作为学习或研究使用,如需商业使用请购买正版!

相关推荐

图片及文字自动滚动的控件案例源码

相关信息 我是陈晓 · 225浏览 · 2021-02-09 14:30:55
基于UICollectionView易用易扩展的banner的GXBanner

相关信息 kenrry1992 · 254浏览 · 2021-02-07 16:51:36
iOS仿百度地图滑动冲突解决案例

相关信息 我是陈晓 · 373浏览 · 2020-12-07 10:44:43
滚动视图的顶部悬浮效果

相关信息 吴振华 · 355浏览 · 2020-01-07 11:38:32
一个类似Excel轻量级的iOS表视图

相关信息 吴振华 · 420浏览 · 2019-12-25 10:22:58
iOS 嵌套滚动,分页滚动视图源码

相关信息 itnanba · 388浏览 · 2019-10-23 10:41:30
加载中

0评论

评论
  • 源码信息
  • 所需 1 点数
  • 源码作者:匿名作者
  • 源码大小:4.76MB
  • 源码类型:IOS源码
  • 运行环境:未知
分类专栏
小鸟云服务器
扫码进入手机网页