九宫格案例——封装xib

来源:互联网 发布:淘宝sma特卖什么意思 编辑:程序博客网 时间:2024/05/20 07:36

1、创建xib文件



想要随意改变view的大小必须设置view的size为FreeForm


2、在手机根目录下找到xib文件(开发时是xib文件,存到手机中是nib文件)

// 1.1> 找到应用的根目录

    NSBundle *rootBundle = [NSBundlemainBundle];// //NSLog(@"%@", [mainBundle bundlePath]);

    // 1.2> 在应用程序根目录下取搜索对应的Xib(nib)文件

    return [[rootBundleloadNibNamed:@"CZAppView"owner:niloptions:nil]lastObject];

loadNibNamed方法返回的是一个数组(因为一个xib文件中可以创建多个控件,虽然在这里我们只有一个控件)


/******************************************************************************************************************************/

app的排列规律

appX = marginX + (appW + marginX) * colIndex;  // colIndex: app所在的列索引

appY = marginTop + (appH + marginY) * rowIndex; // rowIndex:app所在行的索引

关键代码:

- (void)viewDidLoad {

    [super viewDidLoad];        // 假设每行的应用的个数    int columns = 3;        // 获取控制器所管理的view的宽度    CGFloat viewWidth = self.view.frame.size.width;        // 每个应用的宽和高    CGFloat appW = 75;    CGFloat appH = 90;    CGFloat marginTop = 30; // 第一行距离顶部的距离    CGFloat marginX = (viewWidth - columns * appW) / (columns + 1);    CGFloat marginY = marginX; // 假设每行之间的间距与marginX相等        for (int i = 0; i < self.apps.count; i++) {                // 获取当前这个应用的数据字典        CZApp *appModel = self.apps[i];                                // 创建view        CZAppView *appView = [CZAppView appView];                        // 2.2 设置appView的frame属性        // 计算每个单元格所在的列的索引        int colIdx = i % columns;        // 计算每个单元格的行索引        int rowIdx = i / columns;                CGFloat appX = marginX + colIdx * (appW + marginX);        CGFloat appY = marginTop + rowIdx * (appH + marginY);        appView.frame = CGRectMake(appX, appY, appW, appH);                // 3. 将appView加到self.view(控制器所管理的那个view)        [self.view addSubview:appView];                        // 设置数据        // 把模型数据设置给“自定义view”的model属性        // 然后重写model属性的set方法, 在set方法中解析模型对象中的属性, 并把属性值设置给自定义view的各个子控件        appView.model = appModel;            }}
#import <UIKit/UIKit.h>@class CZApp;@interface CZAppView : UIView@property (nonatomic, strong) CZApp *model;// 为自定义view封装一个类方法, 这个类方法的作用就是创建一个view对象+ (instancetype)appView;@end

#import "CZAppView.h"#import "CZApp.h"@interface CZAppView ()@property (weak, nonatomic) IBOutlet UIImageView *imgViewIcon;@property (weak, nonatomic) IBOutlet UILabel *lblName;@property (weak, nonatomic) IBOutlet UIButton *btnDownload;- (IBAction)btnDownloadClick:(UIButton *)sender;@end@implementation CZAppView+ (instancetype)appView{    // 1. 通过xib创建每个应用(UIView)    // 通过动态加载xib文件创建里面的view    // 1.1> 找到应用的根目录    NSBundle *rootBundle = [NSBundle mainBundle]; // //NSLog(@"%@", [mainBundle bundlePath]);    // 1.2> 在应用程序根目录下取搜索对应的Xib(nib)文件    return [[rootBundle loadNibNamed:@"CZAppView" owner:nil options:nil] lastObject];}// 重写model属性的set方法- (void)setModel:(CZApp *)model{    // 先赋值    _model = model;            // 解析模型数据, 把模型数据赋值给UIView中的各个子控件    self.imgViewIcon.image = [UIImage imageNamed:model.icon];    self.lblName.text = model.name;}// 下载按钮的单击事件- (IBAction)btnDownloadClick:(UIButton *)sender {    // 1. 禁用当前被点击的按钮    sender.enabled = NO;        // 2. 弹出一个消息提醒框(这个消息提醒框其实就是一个UILabel)    UILabel *lblMsg = [[UILabel alloc] init];    // 2.1 设置lblMsg的显示文字    lblMsg.text = @"正在下载...";    // 2.2 设置lblMsg的背景色    lblMsg.backgroundColor = [UIColor blackColor];    // 2.3 设置lblMsg的frame    CGFloat viewW = self.superview.frame.size.width;    CGFloat viewH = self.superview.frame.size.height;    CGFloat msgW = 200;    CGFloat msgH = 30;    CGFloat msgX = (viewW - msgW) / 2;    CGFloat msgY = (viewH - msgH) * 0.5;    lblMsg.frame = CGRectMake(msgX, msgY, msgW, msgH);    // 2.4 设置label的文字颜色    lblMsg.textColor = [UIColor redColor];    // 2.5 设置label居中显示    lblMsg.textAlignment = NSTextAlignmentCenter;    // 2.6 设置文字粗体    lblMsg.font = [UIFont boldSystemFontOfSize:17];    // 2.7 设置Label的透明度    lblMsg.alpha = 0.0; // 一开始把透明度设置为0, 然后通过动画的方式慢慢的改变透明度    // 2.8 设置Label为"圆角"    // 设置四个角的“半径”    lblMsg.layer.cornerRadius = 10;    // 把多余的部分裁剪掉    lblMsg.layer.masksToBounds = YES;        // 开启一个动画, 这个动画要执行1.5秒钟    [UIView animateWithDuration:1.5 animations:^{        // 动画代码: 将透明度变成0.6        lblMsg.alpha = 0.6;            } completion:^(BOOL finished) {        // 当上面的动画执行完毕以后执行这个代码                if (finished) {            // 这个代码的含义是, 隔一段时间后再启动另外一个动画            // 这个动画的执行时间是1.5秒钟, 但是这个动画会在1.0秒之后再开始执行            // UIViewAnimationOptionCurveLinear表示是匀速执行动画            [UIView animateWithDuration:1.5 delay:1.0 options:UIViewAnimationOptionCurveLinear animations:^{                // 这个动画的代码                lblMsg.alpha = 0;                            } completion:^(BOOL finished) {                if (finished) {                    // 当Label的透明度变成0以后, 再把这个Label从view中移除                    [lblMsg removeFromSuperview];                }            }];        }    }];                // 3. 把lblMsg加到控制器所管理的那个view上    [self.superview addSubview:lblMsg];    }@end



0 0
原创粉丝点击