iOS 轮播图缩放动态图和网图混播

简介: iOS 轮播图缩放动态图和网图混播

KJBannerView


介绍一下自己之前写的无限轮播图库,无限自动循环滚动,大家有什么需求可以给我留言,持续更新中...


Demo地址:KJBannerViewDemo


1.png


功能介绍


KJBannerView 是一款轮播Banner,支持动态图和网图混播

1、缩放无限自动循环滚动  √

2、支持四种方向滚动,从左往右、从右往左、从上往下、从下往上  √

3、自定义继承,定制不同样式,详情使用请见Demo  √

4、支持网络动态图和网络图片和本地图片混合轮播  √

5、支持在Storyboard和Xib中创建并配置其属性  √

6、提供多种分页控件PageControl显示  √

7、自带缓存加载,内部封装网图下载缓存工具  √


使用方法


pod 'KJBannerView' # 轮播图 


API & Property


NS_ASSUME_NONNULL_BEGIN
IB_DESIGNABLE
@interface KJBannerView : UIView
/// 代理方法
@property (nonatomic,weak) id<KJBannerViewDelegate> delegate;
@property (nonatomic,weak) id<KJBannerViewDataSource> dataSource;
/// Block回调
@property (nonatomic,readwrite,copy) void(^kSelectBlock)(KJBannerView *banner, NSInteger idx);
@property (nonatomic,readwrite,copy) void(^kScrollBlock)(KJBannerView *banner, NSInteger idx);
/// 暂停计时器滚动处理,备注:在viewDidDisappear当中实现
- (void)kj_pauseTimer;
/// 继续计时器滚动,备注:在viewDidAppear当中实现
- (void)kj_repauseTimer;
/// 滚动到指定位置,备注:需要在设置数据源之后调用
- (void)kj_makeScrollToIndex:(NSInteger)index;
/// 使用Masonry自动布局,请在设置布局之后调用该方法
- (void)kj_useMasonry;
//************************ 数据源API ************************
/// 数据源
@property (nonatomic,strong) NSArray<NSString*>*imageDatas;
/// 自动滚动间隔时间,默认2s
@property (nonatomic,assign) IBInspectable CGFloat autoTime;
/// 是否无线循环,默认yes
@property (nonatomic,assign) IBInspectable BOOL infiniteLoop;
/// 是否自动滑动,默认yes
@property (nonatomic,assign) IBInspectable BOOL autoScroll;
/// 是否缩放,默认不缩放
@property (nonatomic,assign) IBInspectable BOOL isZoom;
/// cell宽度,左右宽度
@property (nonatomic,assign) IBInspectable CGFloat itemWidth;
/// cell间距,默认为0
@property (nonatomic,assign) IBInspectable CGFloat itemSpace;
/// 是否显示分页控件,默认yes
@property (nonatomic,assign) IBInspectable BOOL showPageControl;
/// 滚动方向,默认从右到左
@property (nonatomic,assign) KJBannerViewRollDirectionType rollType;
/// 分页控制器
@property (nonatomic,strong,readonly) KJPageView *pageControl;
//************************ 废弃属性方法 *****************************/
/// 支持自定义Cell,自定义Cell需继承自 KJBannerViewCell
@property (nonatomic,strong) Class itemClass DEPRECATED_MSG_ATTRIBUTE("Please use dataSource [kj_BannerView:BannerViewCell:ImageDatas:Index:]");
@end
//******************** 自带KJBannerViewCell可设置属性 ********************
@interface KJBannerView (KJBannerViewCell)
/// 是否裁剪,默认NO
@property (nonatomic,assign) IBInspectable BOOL bannerScale;
/// imagView圆角,默认为0px
@property (nonatomic,assign) IBInspectable CGFloat bannerRadius;
/// cell的占位图,用于网络未加载到图片时
@property (nonatomic,strong) IBInspectable UIImage *placeholderImage;
/// 轮播图片的ContentMode,默认为 UIViewContentModeScaleToFill
@property (nonatomic,assign) UIViewContentMode bannerContentMode;
/// 图片的样式,默认 KJBannerViewImageTypeNetIamge 网络图片
@property (nonatomic,assign) KJBannerViewImageType imageType;
/// 是否采用动态图缓存,默认NO
@property (nonatomic,assign) BOOL openGIFCache;
@end
NS_ASSUME_NONNULL_END


KJBannerView类介绍


Class 功能区
KJBannerView 轮播图主控件
KJPageView 自定义分页控件
KJBannerViewFlowLayout Cell缩放管理
KJBannerViewCell 基类,自定义需继承该Cell
KJBannerDatasInfo 自带BannerViewCell数据模型
KJLoadImageView 不依赖三方网络加载图片显示控件
KJBannerTool 工具方法
KJBannerViewType 枚举文件夹
KJBannerViewProtocol 委托协议相关
NSTimer+KJSolve 计时器分类
UIImage+KJBannerGIF 动态图分类
KJBannerViewCacheManager 缓存工具
KJBannerViewDownloader 网络请求工具
KJBannerViewLoadManager 网图下载工具


支持Xib快捷设置属性

1.png


效果图

1.png


下载测试效果图,图片采用信号量方式获取

1.png


用法示例


Masonry自动布局


使用Masonry自动布局,请在设置布局之后调用该方法kj_useMasonry

- (void)setMasonry{
    self.banner2 = [[KJBannerView alloc]init];
    self.banner2.autoTime = 2;
    self.banner2.isZoom = YES;
    self.banner2.itemSpace = -10;
    self.banner2.itemWidth = 280;
    self.banner2.delegate = self;
    self.banner2.dataSource = self;
    self.banner2.imageType = KJBannerViewImageTypeMix;
    self.banner2.pageControl.pageType = PageControlStyleSizeDot;
    self.banner2.pageControl.displayType = KJPageControlDisplayTypeRight;
    self.banner2.pageControl.backgroundColor = [UIColor.blackColor colorWithAlphaComponent:0.5];
    [self.backView addSubview:self.banner2];
    [self.banner2 mas_makeConstraints:^(MASConstraintMaker *make) {
        make.top.left.right.bottom.mas_equalTo(0);
    }];
    [self.banner2 kj_useMasonry];
    self.banner2.imageDatas = self.temp;
}


Xib布局

- (void)setXib{
    self.banner.delegate = self;
    self.banner.pageControl.pageType = PageControlStyleRectangle;
    self.banner.pageControl.selectColor = UIColor.greenColor;
    self.banner.pageControl.dotwidth = 20;
    self.banner.pageControl.dotheight = 2;
    self.banner.pageControl.backgroundColor = [UIColor.blackColor colorWithAlphaComponent:0.5];
    self.banner.pageControl.displayType = KJPageControlDisplayTypeLeft;
    self.banner.imageType = KJBannerViewImageTypeMix;
    self.banner.bannerScale = YES;
    self.banner.rollType = KJBannerViewRollDirectionTypeBottomToTop;
    self.banner.bannerContentMode = UIViewContentModeScaleAspectFill;
    self.banner.imageDatas = @[tu2,gif2,@"IMG_0139",@"tu3"];
    [self.banner kj_makeScrollToIndex:1];
}


委托自定义控件

#pragma mark - KJBannerViewDataSource
- (UIView*)kj_BannerView:(KJBannerView*)banner BannerViewCell:(KJBannerViewCell*)bannercell ImageDatas:(NSArray*)imageDatas Index:(NSInteger)index{
    KJBannerModel *model = imageDatas[index];
    CGRect rect = {0, 0, 100, 20};
    UILabel *label = [[UILabel alloc]initWithFrame:rect];
    if (index == 0) {
        label.text = @"定制不同的控件";
        label.frame = CGRectMake(0, 0, bannercell.contentView.frame.size.width, 40);
        label.font = [UIFont boldSystemFontOfSize:35];
        label.textColor = UIColor.greenColor;
        label.textAlignment = NSTextAlignmentCenter;
    }
    KJLoadImageView *imageView = [[KJLoadImageView alloc]initWithFrame:bannercell.contentView.bounds];
    imageView.kj_isScale = YES;
    [imageView kj_setImageWithURLString:model.customImageUrl Placeholder:[UIImage imageNamed:@"tu3"]];
    [imageView addSubview:label];
    return imageView;
}


继承方式自定义控件


- (void)setText{
    self.banner3.showPageControl = NO;
#pragma clang diagnostic push
#pragma clang diagnostic ignored "-Wdeprecated-declarations"
    self.banner3.itemClass = [KJCollectionViewCell class];
#pragma clang diagnostic pop
    self.banner3.rollType = KJBannerViewRollDirectionTypeBottomToTop;
    self.banner3.imageDatas = @[@"测试文本滚动",@"觉得好用请给我点个星",@"有什么问题也可以联系我",@"邮箱: ykj310@126.com"];
}

自定义Cell使用

- (void)setModel:(NSObject*)model{
    self.label.text = (NSString*)model;
}

轮播图介绍就到此完毕,后面有相关再补充,写文章不容易,还请点个**小星星**传送门

相关文章
|
5月前
|
iOS开发
技术好文:xcode动态图,ios实现动态图,iosgif,暂停和继续播放
技术好文:xcode动态图,ios实现动态图,iosgif,暂停和继续播放
58 1
|
iOS开发
iOS 特价秒杀(轮播图内嵌倒计时)
iOS 特价秒杀(轮播图内嵌倒计时)
163 0
|
Android开发 iOS开发 开发者
iOS中播放gif动态图的方式探讨
iOS中播放gif动态图的方式探讨
239 0
|
Android开发 iOS开发
|
iOS开发
iOS中 轮播图放哪最合适? 技术分享
我们知道,轮播图放在cell或collectionViewCell上会影响用户层级交互事件,并且实现起来比较麻烦,现在推出一个技术点:答题思路是:将UIScrollView放在UIView或UICollectionView或者UITableView上,将UIScrollView的y设为需要的大小...
806 0
|
6天前
|
开发框架 前端开发 Android开发
安卓与iOS开发中的跨平台策略
在移动应用开发的战场上,安卓和iOS两大阵营各据一方。随着技术的演进,跨平台开发框架成为开发者的新宠,旨在实现一次编码、多平台部署的梦想。本文将探讨跨平台开发的优势与挑战,并分享实用的开发技巧,帮助开发者在安卓和iOS的世界中游刃有余。
|
1月前
|
Java Android开发 Swift
安卓与iOS开发对比:平台选择对项目成功的影响
【10月更文挑战第4天】在移动应用开发的世界中,选择合适的平台是至关重要的。本文将深入探讨安卓和iOS两大主流平台的开发环境、用户基础、市场份额和开发成本等方面的差异,并分析这些差异如何影响项目的最终成果。通过比较这两个平台的优势与挑战,开发者可以更好地决定哪个平台更适合他们的项目需求。
114 1
|
14天前
|
安全 数据处理 Swift
深入探索iOS开发中的Swift语言特性
本文旨在为开发者提供对Swift语言在iOS平台开发的深度理解,涵盖从基础语法到高级特性的全面分析。通过具体案例和代码示例,揭示Swift如何简化编程过程、提高代码效率,并促进iOS应用的创新。文章不仅适合初学者作为入门指南,也适合有经验的开发者深化对Swift语言的认识。
35 9
|
10天前
|
设计模式 Swift iOS开发
探索iOS开发:从基础到高级,打造你的第一款App
【10月更文挑战第40天】在这个数字时代,掌握移动应用开发已成为许多技术爱好者的梦想。本文将带你走进iOS开发的世界,从最基础的概念出发,逐步深入到高级功能实现,最终指导你完成自己的第一款App。无论你是编程新手还是有志于扩展技能的开发者,这篇文章都将为你提供一条清晰的学习路径。让我们一起开始这段旅程吧!
|
13天前
|
Android开发 Swift iOS开发
探索安卓与iOS开发的差异和挑战
【10月更文挑战第37天】在移动应用开发的广阔舞台上,安卓和iOS这两大操作系统扮演着主角。它们各自拥有独特的特性、优势以及面临的开发挑战。本文将深入探讨这两个平台在开发过程中的主要差异,从编程语言到用户界面设计,再到市场分布的不同影响,旨在为开发者提供一个全面的视角,帮助他们更好地理解并应对在不同平台上进行应用开发时可能遇到的难题和机遇。
下一篇
无影云桌面