BAGridView
示例
要运行示例项目，请克隆仓库，然后首先从 Example 目录运行 pod install。
需求
安装
BAGridView 通过 CocoaPods 提供。要安装它，只需将以下行添加到 Podfile 中
pod 'BAGridView'作者
boai, [email protected]
许可
BAGridView可在MIT许可下使用。更多信息请查看LICENSE文件。
1、功能及简介
- 1、支付宝首页 九宫格 布局封装
- 2、自适应按钮位置和数量、badge
- 3、自定义文字图片 或者 两行文字样式
- 4、自定义分割线：显示/隐藏
- 5、自定义分割线：颜色
- 6、新增 支持 自定义 图片文字间距功能（感谢群里 @武汉-马阿飞 同学提出的 需求！）
- 7、新增 自定义 所有文字字体（感谢群里 @武汉-马阿飞 同学提出的 需求！）
- 8、新增 支持 自定义 item 背景颜色 和 选中背景颜色（感谢群里 @武汉-马阿飞 同学提出的 需求！）
- 9、新增网络图片、placdholderImage功能（感谢群里 @武汉-马阿飞 同学提出的 需求！）
2、图片示例
3、安装、导入示例和源码地址
- 1、pod 导入【最新版本：
】：
pod 'BAGridView'
如果发现pod search BAGridView搜索出的不是最新版本，需要在终端执行 cd 命令退回到 desktop，然后执行pod setup命令更新本地spec缓存（可能需要几分钟），然后再搜索。
具体步骤：
- pod setup : 初始化
- pod repo update : 更新仓库
- pod search BAGridView
- 2、文件夹拖入：下载demo，把 BAGridView 文件夹拖入项目即可，
- 3、导入头文件：
#import "BAKit_BAGridView.h" - 4、项目源码地址：
OC 版：https://github.com/BAHome/BAGridView
4、BAGridView 的类结构及 demo 示例
BAGridView.h
#import <UIKit/UIKit.h>
@class BAGridView_Config;
@interface BAGridView : UIView
/**
快速创建宫格
@param config view 基础配置
@param block 点击事件回调
@return BAGridView
*/
+ (instancetype)ba_creatGridViewWithGridViewConfig:(BAGridView_Config *)config
block:(BAGridViewBlock)block;
@end
demo 示例
// 示例1：
- (BAGridView *)gridView {
if (!_gridView) {
BAGridView_Config *config = self.ba_GridViewConfig;
config.scrollEnabled = YES;
// 是否显示分割线
config.showLineView = YES;
// item：分割线颜色，默认：BAKit_Color_Gray_11【BAKit_Color_RGB(248, 248, 248)】
config.ba_gridView_lineColor = BAKit_Color_Red_pod;
// item：每行 item 的个数，默认为4个
config.ba_gridView_rowCount = kGridView_rowCount;
// item：高度/宽度
config.ba_gridView_itemHeight = kGridView_itemHeight;
config.ba_gridView_imageWidth = 40;
config.ba_gridView_imageHeight = 40;
// item：图片与文字间距（或者两行文字类型的间距），默认：0
config.ba_gridView_itemImageInset = 5;
// item：title 颜色，默认：BAKit_Color_Black【[UIColor blackColor]】
// config.ba_gridView_titleColor = BAKit_Color_Black;
// item：title Font，默认：图文样式下 16，两行文字下（上25，下12）
config.ba_gridView_titleFont = [UIFont boldSystemFontOfSize:15];
// item：背景颜色，默认：BAKit_Color_White
config.ba_gridView_backgroundColor = [UIColor yellowColor];
// item：背景选中颜色，默认：无色
config.ba_gridView_selectedBackgroundColor = BAKit_Color_Red_pod;
// badge
config.ba_gridView_badgeType = kBAGridViewBadgeType_Center;
config.ba_gridView_badgeFont = [UIFont systemFontOfSize:10];
config.ba_gridView_badgeRectCorners = UIRectCornerTopLeft | UIRectCornerTopRight | UIRectCornerBottomRight;
// config.ba_gridView_badgeCornerRadius = 3;
// config.ba_gridView_badgeBgColor = UIColor.orangeColor;
// config.ba_gridView_badgeTextColor = UIColor.greenColor;
// config.ba_gridView_badgeHeight = 30;
// config.ba_gridView_badgeOffsetPoint = CGPointMake(10, -10);
config.dataArray = self.gridDataArray;
// config.ba_gridView_itemEdgeInsets = UIEdgeInsetsMake(10, 10, 10, 10);
// config.minimumLineSpacing = 10;
// config.minimumInteritemSpacing = 10;
_gridView = [BAGridView ba_creatGridViewWithGridViewConfig:self.ba_GridViewConfig
placdholderImage:[UIImage imageNamed:@"icon_placeholder"]
block:^(BAGridItemModel *model, NSIndexPath *indexPath) {
BAKit_ShowAlertWithMsg_ios8(model.titleString);
}];
}
return _gridView;
}
- (BAGridView *)gridView2 {
if (!_gridView2) {
BAGridView_Config *config = self.ba_GridViewConfig2;
config.showLineView = YES;
// item：分割线颜色，默认：BAKit_Color_Gray_11【BAKit_Color_RGB(248, 248, 248)】
config.ba_gridView_lineColor = BAKit_Color_Red_pod;
// item：每行 item 的个数，默认为4个
config.ba_gridView_rowCount = kGridView_rowCount2;
// item：高度
config.ba_gridView_itemHeight = kGridView_itemHeight2;
config.ba_gridView_itemWidth = 0;
// item：图片与文字间距（或者两行文字类型的间距），默认：0
// config.ba_gridView_itemImageInset = 10;
// item：title 颜色，默认：BAKit_Color_Black【[UIColor blackColor]】
config.ba_gridView_titleColor = BAKit_Color_Black_pod;
// item：Desc 颜色，默认：BAKit_Color_Gray_9【BAKit_Color_RGB(216, 220, 228)】
config.ba_gridView_titleDescColor = BAKit_Color_Gray_7_pod;
// item：title Font，默认：图文样式下 16，两行文字下（上25，下12）
config.ba_gridView_titleFont = [UIFont boldSystemFontOfSize:25];
// item：Desc Font，默认：两行文字下 12
config.ba_gridView_titleDescFont = [UIFont boldSystemFontOfSize:15];
// item：背景颜色，默认：BAKit_Color_White
config.ba_gridView_backgroundColor = [UIColor yellowColor];
// item：背景选中颜色，默认：无色
config.ba_gridView_selectedBackgroundColor = [UIColor greenColor];
config.dataArray = self.gridDataArray2;
_gridView2 = [BAGridView ba_creatGridViewWithGridViewConfig:config block:^(BAGridItemModel *model, NSIndexPath *indexPath) {
BAKit_ShowAlertWithMsg_ios8(model.titleString);
}];
}
return _gridView2;
}
- (NSMutableArray <BAGridItemModel *> *)gridDataArray {
if (!_gridDataArray) {
_gridDataArray = @[].mutableCopy;
BAGridView_Config *config = self.ba_GridViewConfig;
// 可以为本地图片
// NSArray *imageNameArray = @[@"tabbar_mainframeHL", @"tabbar_mainframeHL", @"tabbar_mainframeHL", @"tabbar_mainframeHL", @"tabbar_mainframeHL"];
// 也可以是网络图片
NSArray *imageNameArray;
NSArray *bgImageNameArray;
if (config.gridViewType == BAGridViewTypeBgImageTitle) {
bgImageNameArray = @[@"http://d.hiphotos.baidu.com/image/pic/item/b21c8701a18b87d67cda2ef50d0828381e30fd44.jpg",
@"http://d.hiphotos.baidu.com/image/pic/item/b21c8701a18b87d67cda2ef50d0828381e30fd44.jpg",
@"http://d.hiphotos.baidu.com/image/pic/item/b21c8701a18b87d67cda2ef50d0828381e30fd44.jpg",
@"http://d.hiphotos.baidu.com/image/pic/item/b21c8701a18b87d67cda2ef50d0828381e30fd44.jpg",
@"http://d.hiphotos.baidu.com/image/pic/item/b21c8701a18b87d67cda2ef50d0828381e30fd44.jpg"
];
} else {
imageNameArray = @[@"http://d.hiphotos.baidu.com/image/pic/item/b21c8701a18b87d67cda2ef50d0828381e30fd44.jpg",
@"http://d.hiphotos.baidu.com/image/pic/item/b21c8701a18b87d67cda2ef50d0828381e30fd41.jpg",
@"http://d.hiphotos.baidu.com/image/pic/item/b21c8701a18b87d67cda2ef50d0828381e30fd442.jpg",
@"http://d.hiphotos.baidu.com/image/pic/item/b21c8701a18b87d67cda2ef50d0828381e30fd443.jpg",
@"http://d.hiphotos.baidu.com/image/pic/item/b21c8701a18b87d67cda2ef50d0828381e30fd44.jpg"
];
}
if (config.gridViewType == BAGridViewTypeImageTitle || config.gridViewType == BAGridViewTypeTitleImage) {
bgImageNameArray = @[
@"http://img.qq1234.org/uploads/allimg/161212/16012W921-11.jpg",
@"http://img.qq1234.org/uploads/allimg/161212/16012W921-11.jpg",
@"http://img.qq1234.org/uploads/allimg/161212/16012W921-11.jpg",
@"http://img.qq1234.org/uploads/allimg/161212/16012W921-11.jpg",
@"http://img.qq1234.org/uploads/allimg/161212/16012W921-11.jpg",
];
}
NSArray *titleArray = @[@"小区tabbar_main", @"商圈", @"社交57128423", @"出行", @"武术"];
for (NSInteger i = 0; i < titleArray.count; i++) {
BAGridItemModel *model = [BAGridItemModel new];
if (imageNameArray.count > 0) {
model.imageName = imageNameArray[i];
}
if (bgImageNameArray.count > 0) {
model.bgImageName = bgImageNameArray[i];
}
model.titleString = titleArray[i];
if (config.gridViewType == BAGridViewTypeImageTitle) {
model.badge = @(BAKit_RandomNumber(2000)).stringValue;
if (i == 1) {
model.badge = @"新功能";
}
}
[self.gridDataArray addObject:model];
}
}
return _gridDataArray;
}
- (NSMutableArray <BAGridItemModel *> *)gridDataArray2 {
if (!_gridDataArray2) {
_gridDataArray2 = @[].mutableCopy;
NSArray *titleArray = @[@"200", @"20", @"200",
@"10", @"￥3899989", @"30",
@"10", @"300", @"30", ];
NSArray *descArray = @[@"1新增积分总量",
@"2返还积分总量",
@"3全返单元总量",
@"4每单元返还积分",
@"5全返单元总量",
@"6每单元返还积分",
@"7每单元返还积分",
@"8全返单元总量",
@"9每单元返还积分"];
for (NSInteger i = 0; i < titleArray.count; i++) {
BAGridItemModel *model = [BAGridItemModel new];
model.desc = descArray[i];
if (i == 4) {
//初始化一个attriburitedString对象
NSMutableAttributedString *attributeString = [[NSMutableAttributedString alloc] initWithString:titleArray[i]];
//给这个属性添加一个属性前3个字符的背景颜色
NSRange orRange = NSMakeRange(0, 1);
[attributeString addAttributes:@{NSForegroundColorAttributeName:[UIColor orangeColor], NSFontAttributeName:[UIFont systemFontOfSize:11]} range:orRange];
//添加多个属性
NSRange seRange = NSMakeRange(3, 2);
[attributeString addAttributes:@{ NSForegroundColorAttributeName: [UIColor redColor], NSBackgroundColorAttributeName: [UIColor blueColor]} range:seRange];
model.titleAttributedString = attributeString;
} else {
model.titleString = titleArray[i];
}
[_gridDataArray2 addObject:model];
}
}
return _gridDataArray2;
}
其他示例可下载demo查看源码！
5、更新记录：【倒叙】
欢迎使用 【BAHome】 系列开源代码！如有更多需求，请前往：【https://github.com/BAHome】
最新更新时间：2022-3-07 【倒叙】
最新版本：【Version：1.2.6】
更新内容：
1.2.6.1 新增两行文字样式下的 badge 显示！
最新更新时间：2021-07-15 【倒叙】
最新版本：【Version：1.2.5】
更新内容：
1.2.5.1 新增 NSMutableAttributedString 标题和副标题！
最新更新时间：2020-11-16 【倒叙】
最新版本：【Version：1.2.4】
更新内容：
1.2.4.1 新增自定义横向滚动排列样式！
最新更新时间：2020-07-30 【倒叙】
最新版本：【Version：1.2.2】
更新内容：
1.2.2.1、 新增背景图片填充模式！详见：code
最新更新时间：2020-05-13 【倒叙】
最新版本：【Version：1.2.1】
更新内容：
1.2.1.1、修复 scrollEnabled 无效的问题！详见：code
最新更新时间：2020-04-15 【倒叙】
最新版本：【Version：1.2.0】
更新内容：
1.2.0.1、新增 图片的填充样式！详见：code
最新更新时间：2020-04-09 【倒叙】
最新版本：【Version：1.1.9】
更新内容：
1.1.9.1、新增 图片的圆角设置！详见：code
最新更新时间：2020-03-21 【倒叙】
最新版本：【Version：1.1.7】
更新内容：
1.1.7.1、修复 角标第一次隐藏后刷新数据无法再次显示的entity！详见：code
最新更新时间：2020-03-14 【倒叙】
最新版本：【Version：1.1.6】
更新内容：
1.1.6.1、新增自定义 badge，可以实现自定义 badge 样式、字体、字体颜色、背景颜色、圆角、偏移等，满足大部分用户的角标需求！详见：code
最新更新时间：2019-10-09 【倒叙】
最新版本：【Version：1.1.5】
更新内容：
1.1.5.1、新增自定义图片的宽高！详见：code
1.1.5.2、新增自定义背景图片！详见：demo
最新更新时间：2019-09-10 【倒叙】
最新版本：【Version：1.1.4】
更新内容：
1.1.4.1、优化部分代码，公开属性 config，新增 获取网络数据后的刷新操作示例！详见：demo
1.1.4.1、优化部分代码，优化默认不设置 itemWidth 时的自适应宽度设置，详见：demo
最新更新时间：2018-05-31 【倒叙】
最新版本：【Version：1.1.3】
更新内容：
1.1.3.1、优化部分代码，新增 是否可以滑动属性【scrollEnabled】！详见：demo
最新更新时间：2018-05-31 【倒叙】
最新版本：【Version：1.1.2】
更新内容：
1.1.2.1、优化部分代码，新增 是否可以滑动属性【scrollEnabled】！详见：demo
最新更新时间：2018-05-29 【倒叙】
最新版本：【Version：1.1.1】
更新内容：
1.1.1.1、优化部分代码，新增背景图片设置！详见：demo
最新更新时间：2018-05-28 【倒叙】
最新版本：【Version：1.1.0】
更新内容：
1.1.0.1、全新版本适配，适配更加简洁！详见：demo
1.1.0.2、原 配置方法 单独抽成 BAGridView_Config 类，所有的配置都可以单独设置！更加简洁明了！如果代码中有使用老版本的，可以更改适配，也可以选择锁定上一版本【1.0.7】
最新更新时间：2017-12-23 【倒叙】
最新版本：【Version：1.0.7】
更新内容：
1.0.7.1、新增图文样式下文字 title 内容可以显示最多两行！详见：demo 1
1.0.7.2、新增 BAGridView_Version.h 类，版本更新分离更易读！
最新更新时间：2017-07-07 【倒叙】
最新版本：【版本：1.0.6】
更新内容：
1.0.6.1、新增网络图片、占位符图像功能（感谢群内 @武汉-马阿飞 同学提出的需求！）
最新更新时间：2017-06-23 【时间递减】
最新版本：【版本：1.0.5】
更新内容：
1.0.5.1、优化部分宏定义
最新更新时间：2017-06-23 【时间递减】
最新版本：【版本：1.0.4】
更新内容：
1.0.4.1、优化部分宏定义
最新更新时间：2017-06-23 【时间递减】
最新版本：【版本：1.0.3】
更新内容：
1.0.3.1、新增 支持 自定义 item 选中后自动还原背景颜色功能（感谢群内 @武汉-马阿飞 同学提出的需求！）
最新更新时间：2017-06-21 【时间递减】
最新版本：【版本：1.0.1】
更新内容：
1.0.1.1、新增 支持 自定义 图片文字间距功能（感谢群内 @武汉-马阿飞 同学提出的需求！）
1.0.1.2、新增 自定义 所有文字字体功能（感谢群内 @武汉-马阿飞 同学提出的需求！）
最新更新时间：2017-06-20 【时间递减】
最新版本：【版本：1.0.0】
更新内容：
1.0.0.1、支付宝首页 九宫格 布局封装
1.0.0.2、自适应按钮位置和数量
1.0.0.3、自定义文字图片 或 两行文字样式
1.0.0.4、自定义分割线：显示/隐藏
1.0.0.5、自定义分割线：颜色
6、bug 反馈
1、开发中遇到 bug，希望小伙伴们能够及时反馈给我们 BAHome 团队，我们必定会认真对待每一个问题！
2、以后提需求和 bug 的同学，记得把 git 或者博客链接给我们，我们可以直接超链到你们那里！希望大家积极参与测试！
7、BAHome 团队成员
1、QQ 群 479663605
【注意：此群为 2 元收费群，介意的小伙伴儿请勿打扰！】
孙博岩
QQ：137361770
git：https://github.com/boai
简书：http://www.jianshu.com/u/95c9800fdf47
微博：
马景丽
QQ：1253540493
git：https://github.com/MaJingli
陆晓峰
QQ：442171865
git：https://github.com/zeR0Lu
陈集
QQ：3161182978
git：https://github.com/chenjipdc
简书：http://www.jianshu.com/u/90ae559fc21d
任子丰
QQ：459643690
git：https://github.com/renzifeng
吴丰收
QQ：498121294
石少庸
QQ：363605775
git：https://github.com/CrazyCoderShi
简书：http://www.jianshu.com/u/0726f4d689a3
8、开发环境和支持版本
开发使用最新版本 Xcode，理论上支持 iOS 8 及以上版本，如有版本适配问题，请及时反馈！多谢合作！
9、感谢
感谢 BAHome 团队成员共同努力，后期将推出一系列常用 UI 控件的封装，大家有需求也可以在 issue 中提出，如果合理，我们会尽快推出新版本！
BAHome 的发展离不开大家的信任与推广，再次感谢各位小伙伴的支持！