【iOS】开源组件 BRPickerView

作者: irenb | 来源:发表于2020-09-29 21:50 被阅读0次

【iOS】开源组件 BRPickerView
记录开发中用到的好用的库
iOS组件化之CocoaPods
无标题文章
iOS新闻应用源码，高仿今日头条源码等
iOS开源项目组件
iOS开发-常用第三方开源框架倾情整理!
iOS开发交流群
iOS进公司后可能用到的开源库和第三方组件
公司用到的一些 iOS 开源库和第三方组件

BRPickerView

BRPickerView 封装的是iOS中常用的选择器组件，主要包括：日期选择器（支持年月日、年月等15种日期样式选择，支持设置星期、至今等）、地址选择器（支持省市区、省市、省三种地区选择）、自定义字符串选择器（支持单列、多列、二级联动、三级联动选择）。支持自定义主题样式，适配深色模式，支持将选择器组件添加到指定容器视图。

【说明】

当前最新版本为： 2.7.3 。
如果不能找到最新版本，请先执行一下 pod repo update 更新本地仓库，待更新完成后；再执行 pod search BRPickerView 进行搜索，就会看到最新版本。

效果演示

查看并运行 BRPickerViewDemo.xcodeproj

[图片上传失败...(image-31af38-1601391352040)]	[图片上传失败...(image-b99e25-1601391352041)]
框架Demo运行效果图1	框架Demo运行效果图2

安装

1. CocoaPods

在 Podfile 中添加 pod 'BRPickerView'。
执行 pod install 或 pod update 。
导入头文件 #import <BRPickerView.h>。

2. 手动导入

将与 README.md 同级目录下的 BRPickerView 文件夹拽入项目中
导入头文件 #import "BRPickerView.h"。

系统要求

iOS 8.0+
ARC

使用

1. 时间选择器：`BRDatePickerView`

查看 BRDatePickerView.h 头文件，里面提供了两种使用方式，参见源码。

/// 日期选择器格式
typedef NS_ENUM(NSInteger, BRDatePickerMode) {
    // ----- 以下4种是系统样式（兼容国际化日期格式） -----
    /** 【yyyy-MM-dd】UIDatePickerModeDate（美式日期：MM-dd-yyyy；英式日期：dd-MM-yyyy）*/
    BRDatePickerModeDate,
    /** 【yyyy-MM-dd HH:mm】 UIDatePickerModeDateAndTime */
    BRDatePickerModeDateAndTime,
    /** 【HH:mm】UIDatePickerModeTime */
    BRDatePickerModeTime,
    /** 【HH:mm】UIDatePickerModeCountDownTimer */
    BRDatePickerModeCountDownTimer,
    
    // ----- 以下11种是自定义样式 -----
    /** 【yyyy-MM-dd HH:mm:ss】年月日时分秒 */
    BRDatePickerModeYMDHMS,
    /** 【yyyy-MM-dd HH:mm】年月日时分 */
    BRDatePickerModeYMDHM,
    /** 【yyyy-MM-dd HH】年月日时 */
    BRDatePickerModeYMDH,
    /** 【MM-dd HH:mm】月日时分 */
    BRDatePickerModeMDHM,
    /** 【yyyy-MM-dd】年月日（兼容国际化日期：dd-MM-yyyy）*/
    BRDatePickerModeYMD,
    /** 【yyyy-MM】年月（兼容国际化日期：MM-yyyy）*/
    BRDatePickerModeYM,
    /** 【yyyy】年 */
    BRDatePickerModeY,
    /** 【MM-dd】月日 */
    BRDatePickerModeMD,
    /** 【HH:mm:ss】时分秒 */
    BRDatePickerModeHMS,
    /** 【HH:mm】时分 */
    BRDatePickerModeHM,
    /** 【mm:ss】分秒 */
    BRDatePickerModeMS
};

使用示例（参考Demo）：

// 1.创建日期选择器
BRDatePickerView *datePickerView = [[BRDatePickerView alloc]init];
// 2.设置属性
datePickerView.pickerMode = BRDatePickerModeYMD;
datePickerView.title = @"选择年月日";
// datePickerView.selectValue = @"2019-10-30";
datePickerView.selectDate = [NSDate br_setYear:2019 month:10 day:30];
datePickerView.minDate = [NSDate br_setYear:1949 month:3 day:12];
datePickerView.maxDate = [NSDate date];
datePickerView.isAutoSelect = YES;
datePickerView.resultBlock = ^(NSDate *selectDate, NSString *selectValue) {
    NSLog(@"选择的值：%@", selectValue);
};
// 设置自定义样式
BRPickerStyle *customStyle = [[BRPickerStyle alloc]init];
customStyle.pickerColor = BR_RGB_HEX(0xd9dbdf, 1.0f);
customStyle.pickerTextColor = [UIColor redColor];
customStyle.separatorColor = [UIColor redColor];
datePickerView.pickerStyle = customStyle;

// 3.显示
[datePickerView show];

时间选择器显示类型的效果图（默认样式）：

以下4种样式是使用 UIDatePicker 类进行封装的，支持循环滚动

[图片上传失败...(image-2a755d-1601391352041)]	[图片上传失败...(image-db4e94-1601391352041)]
样式1：BRDatePickerModeDate	样式2：BRDatePickerModeDateAndTime

[图片上传失败...(image-7660dd-1601391352041)]	[图片上传失败...(image-cd9d48-1601391352041)]
样式3：BRDatePickerModeTime	样式4：BRDatePickerModeCountDownTimer

以下11种样式是使用 UIPickerView 类进行封装的。

[图片上传失败...(image-ae9f9a-1601391352041)]	[图片上传失败...(image-b1d085-1601391352041)]
样式5：BRDatePickerModeYMDHMS	样式6：BRDatePickerModeYMDHM

[图片上传失败...(image-b2f1b5-1601391352041)]	[图片上传失败...(image-75d9d4-1601391352041)]
样式7：BRDatePickerModeYMDH	样式8：BRDatePickerModeMDHM

[图片上传失败...(image-110177-1601391352041)]	[图片上传失败...(image-a1e7a5-1601391352041)]
样式9：BRDatePickerModeYMD	样式10：BRDatePickerModeYM

[图片上传失败...(image-ecfda0-1601391352041)]	[图片上传失败...(image-3b0128-1601391352041)]
样式11：BRDatePickerModeY	样式12：BRDatePickerModeMD

[图片上传失败...(image-cbe74e-1601391352041)]	[图片上传失败...(image-9d0f34-1601391352041)]
样式13：BRDatePickerModeHMS	样式14：BRDatePickerModeHM

[图片上传失败...(image-3b809c-1601391352041)]
样式15：BRDatePickerModeMS

其它日期样式

[图片上传失败...(image-5ed95d-1601391352041)]	[图片上传失败...(image-bdd5d7-1601391352041)]
设置显示星期：datePickerView.showWeek = YES;	设置显示星期：datePickerView.showWeek = YES;

[图片上传失败...(image-37bf39-1601391352041)]	[图片上传失败...(image-a8d4e2-1601391352041)]
设置添加至今：datePickerView.addToNow = YES;	设置显示今天：datePickerView.showToday = YES;

[图片上传失败...(image-6c7d1f-1601391352041)]	[图片上传失败...(image-249545-1601391352041)]
日期单位显示样式：datePickerView.showUnitType = BRShowUnitTypeOnlyCenter;	设置选择器中间选中行的背景颜色：selectRowColor

// 设置选择器中间选中行的样式
BRPickerStyle *customStyle = [[BRPickerStyle alloc]init];
customStyle.selectRowColor = [UIColor blueColor];
customStyle.selectRowTextFont = [UIFont boldSystemFontOfSize:20.0f];
customStyle.selectRowTextColor = [UIColor redColor];
datePickerView.pickerStyle = customStyle;

[图片上传失败...(image-8c0b91-1601391352041)]	[图片上传失败...(image-e257ce-1601391352041)]
样式：BRDatePickerModeYMD （默认非中文环境显示英式日期）	样式：BRDatePickerModeYM （默认非中文环境显示英式日期）

几种常见的弹框样式模板

[图片上传失败...(image-6d9a32-1601391352041)]	[图片上传失败...(image-b24eb2-1601391352041)]
弹框样式模板1：datePickerView.pickerStyle = [BRPickerStyle pickerStyleWithThemeColor:[UIColor blueColor]];	弹框样式模板2：datePickerView.pickerStyle = [BRPickerStyle pickerStyleWithDoneTextColor:[UIColor blueColor]];

[图片上传失败...(image-e46484-1601391352041)]	[图片上传失败...(image-e39ca7-1601391352041)]
弹框样式模板3：datePickerView.pickerStyle = [BRPickerStyle pickerStyleWithDoneBtnImage:[UIImage imageNamed:@"icon_close"]];	添加选择器的头视图：pickerHeaderView

// 添加选择器头视图（pickerHeaderView）
UIView *headerView = [[UIView alloc]initWithFrame:CGRectMake(0, 0, SCREEN_WIDTH, 36)];
headerView.backgroundColor = [[UIColor grayColor] colorWithAlphaComponent:0.1f];
NSArray *unitArr = @[@"年", @"月", @"日"];
for (NSInteger i = 0; i < unitArr.count; i++) {
    CGFloat width = SCREEN_WIDTH / unitArr.count;
    CGFloat orginX = i * (SCREEN_WIDTH / unitArr.count);
    UILabel *label = [[UILabel alloc]initWithFrame:CGRectMake(orginX, 0, width, 36)];
    label.backgroundColor = [UIColor clearColor];
    label.textAlignment = NSTextAlignmentCenter;
    label.font = [UIFont systemFontOfSize:16.0f];
    label.textColor = [UIColor darkGrayColor];
    label.text = unitArr[i];
    [headerView addSubview:label];
}
datePickerView.pickerHeaderView = headerView;

2. 地址选择器：`BRAddressPickerView`

查看 BRAddressPickerView.h 头文件，里面提供了两种使用方式，参见源码。

使用示例（参考Demo）：

/// 地址选择器
BRAddressPickerView *addressPickerView = [[BRAddressPickerView alloc]init];
addressPickerView.pickerMode = BRAddressPickerModeArea;
addressPickerView.title = @"请选择地区";
//addressPickerView.selectValues = @[@"浙江省", @"杭州市", @"西湖区"];
addressPickerView.selectIndexs = @[@10, @0, @4];
addressPickerView.isAutoSelect = YES;
addressPickerView.resultBlock = ^(BRProvinceModel *province, BRCityModel *city, BRAreaModel *area) {
    NSLog(@"选择的值：%@", [NSString stringWithFormat:@"%@ %@ %@", province.name, city.name, area.name]);
};

[addressPickerView show];

地址选择器的3种显示类型（showType 的3个枚举值）：

[图片上传失败...(image-5c4033-1601391352041)]	[图片上传失败...(image-2d3ca8-1601391352041)]
样式1：BRAddressPickerModeProvince	样式2：BRAddressPickerModeCity

[图片上传失败...(image-caa7f5-1601391352041)]
样式3：BRAddressPickerModeArea

3. 自定义字符串选择器：`BRStringPickerView`

查看 BRStringPickerView.h 头文件，里面提供了两种使用方式，参见源码。

使用示例（参考Demo）：

/// 1.单列字符串选择器（传字符串数组）
BRStringPickerView *stringPickerView = [[BRStringPickerView alloc]init];
stringPickerView.pickerMode = BRStringPickerComponentSingle;
stringPickerView.title = @"学历";
stringPickerView.dataSourceArr = @[@"大专以下", @"大专", @"本科", @"硕士", @"博士", @"博士后"];
stringPickerView.selectIndex = 2;
stringPickerView.resultModelBlock = ^(BRResultModel *resultModel) {
    NSLog(@"选择的值：%@", resultModel.value);
};

[stringPickerView show];


/// 2.单列字符串选择器（可以传模型数组）
NSArray *infoArr = @[@{@"key": @"1001", @"value": @"无融资", @"remark": @""},
                     @{@"key": @"2001", @"value": @"天使轮", @"remark": @""},
                     @{@"key": @"3001", @"value": @"A轮", @"remark": @""},
                     @{@"key": @"4001", @"value": @"B轮", @"remark": @""},
                     @{@"key": @"5001", @"value": @"C轮以后", @"remark": @""},
                     @{@"key": @"6001", @"value": @"已上市", @"remark": @""}];
NSMutableArray *modelArr = [[NSMutableArray alloc]init];
for (NSDictionary *dic in infoArr) {
    BRResultModel *model = [[BRResultModel alloc]init];
    model.key = dic[@"key"];
    model.value = dic[@"value"];
    model.remark = dic[@"remark"];
    [modelArr addObject:model];
}
BRStringPickerView *stringPickerView = [[BRStringPickerView alloc]init];
stringPickerView.pickerMode = BRStringPickerComponentSingle;
stringPickerView.title = @"融资情况";
stringPickerView.dataSourceArr = [modelArr copy];
stringPickerView.selectIndex = 2;
stringPickerView.resultModelBlock = ^(BRResultModel *resultModel) {
    NSLog(@"选择的索引：%@", @(resultModel.index));
    NSLog(@"选择的值：%@", resultModel.value);
};

[stringPickerView show];


/// 3.多列字符串选择器
BRStringPickerView *stringPickerView = [[BRStringPickerView alloc]init];
stringPickerView.pickerMode = BRStringPickerComponentMulti;
stringPickerView.title = @"自定义多列字符串";
stringPickerView.dataSourceArr = @[@[@"语文", @"数学", @"英语", @"物理", @"化学", @"生物"], @[@"优秀", @"良好", @"及格", @"不及格"]];
stringPickerView.selectIndexs = @[@2, @1];
stringPickerView.resultModelArrayBlock = ^(NSArray<BRResultModel *> *resultModelArr) {
    NSLog(@"选择的值：%@", [NSString stringWithFormat:@"%@，%@", resultModelArr[0].value, resultModelArr[1].value]);
};

// 设置选择器中间选中行的样式
BRPickerStyle *customStyle = [[BRPickerStyle alloc]init];
customStyle.selectRowTextFont = [UIFont boldSystemFontOfSize:20.0f];
customStyle.selectRowTextColor = [UIColor blueColor];
stringPickerView.pickerStyle = customStyle;

[stringPickerView show];

字符串选择器效果图：

[图片上传失败...(image-48f3d5-1601391352041)]	[图片上传失败...(image-aa5232-1601391352041)]
单列字符串选择器	单列字符串选择器

[图片上传失败...(image-151fe5-1601391352041)]
多列字符串选择器

【iOS】开源组件 BRPickerView
BRPickerView BRPickerView 封装的是iOS中常用的选择器组件，主要包括：日期选择器（支持年...
记录开发中用到的好用的库
andorid 选择器:Android-PickerView ios 选择器:BRPickerView
iOS组件化之CocoaPods
如何创建私有 CocoaPods 仓库如何发布自己的开源框架到CocoaPods组件化架构漫谈 iOS组件化之组件...
无标题文章
iOS开源项目：FlatUIKit FlatUIKit是iOS中具有扁平化风格的UI（Flat UI）组件。Fla...
iOS新闻应用源码，高仿今日头条源码等
iOS精选源码城市列表选择一款非常时尚的照片选择插件优酷播放按钮动画 BRPickerView是iOS的选择...
iOS开源项目组件
在这里收集一些最近出现的比较实用好玩的框架或者项目,会不断更新项目简述日期 JHChainableAnimatio...
iOS开发-常用第三方开源框架倾情整理!
iOS开发-常用第三方开源框架分享一下我目前所在公司 iOS 项目中用到的一些 iOS 开源库和第三方组件, 感谢...
iOS开发交流群
iOS开发交流群674228487，欢迎加入。纯技术交流。不定时共享开源库、开源组件、等优质资源。不定时推送...
iOS进公司后可能用到的开源库和第三方组件
公司 iOS 项目中可能用到的一些 iOS 开源库和第三方组件, 感谢开源, 减少了我们的劳动力, 节约了我们大量...
公司用到的一些 iOS 开源库和第三方组件
分享一下我目前所在公司 iOS 项目中用到的一些 iOS 开源库和第三方组件, 感谢开源, 减少了我们的劳动力, ...

【iOS】开源组件 BRPickerView

BRPickerView

效果演示

安装

1. CocoaPods

2. 手动导入

系统要求

使用

1. 时间选择器：`BRDatePickerView`

2. 地址选择器：`BRAddressPickerView`

3. 自定义字符串选择器：`BRStringPickerView`

相关文章

【iOS】开源组件 BRPickerView

记录开发中用到的好用的库

iOS组件化之CocoaPods

无标题文章

iOS新闻应用源码，高仿今日头条源码等

iOS开源项目组件

iOS开发-常用第三方开源框架倾情整理!

iOS开发交流群

iOS进公司后可能用到的开源库和第三方组件

公司用到的一些 iOS 开源库和第三方组件

网友评论

延伸阅读

深度阅读

栏目导航

热点阅读

iOS 技巧

【iOS】开源组件 BRPickerView

BRPickerView

效果演示

安装

1. CocoaPods

2. 手动导入

系统要求

使用

1. 时间选择器：BRDatePickerView

2. 地址选择器：BRAddressPickerView

3. 自定义字符串选择器：BRStringPickerView

相关文章

网友评论

延伸阅读

深度阅读

栏目导航

热点阅读

1. 时间选择器：`BRDatePickerView`

2. 地址选择器：`BRAddressPickerView`

3. 自定义字符串选择器：`BRStringPickerView`