组件化之路2.封装一个简单的组件
2019-01-23 本文已影响46人
书包里的码农
引言:
在开发过程中, 我们经常会遇到一些需求是之前写过的, 或者类似的, 这时候我们可能会封装一个通用的工具, 调用封装好的方法, 获得想要的结果, 协同开发时, 其他人导入一下这个工具, 也可以使用, 提高开发效率, 这就构成了组件化的一部分--公共组件, 接下来我们试着提供一个简单的组件.
1.上传代码到git仓库, 本文使用的是GitHub, 其他平台如国内的码云码市也是支持的, 本文以GitHub为例.
- 我们之前的文章已经有讲过, 不了解的同学请查看这篇文章
2.其实本文中用到的功能还不需要上传到远端去管理代码, 这里我们是为了模拟我们在开发中, 先创建仓库, 在开始编码的习惯.
-
当我们有了一个基础的仓库, 并且仓库中有了一个项目, 那么我们就可以把我们封装的组件/工具放到工程中, 而工程其实就是我们为之提供的使用demo, 先来看看我们的仓库和工程目录吧.
仓库目录和Xcode中打开的效果
2.封装组件
1.现在我们开始封装一个简单的组件, 这里组件提供的主要功能是给UIView的实例增加一个阴影, 使用#import "UIView+ZZExtension.h"导入头文件之后可以使用UIView以及其子类对象直接调用实例方法, 以下是方法的实现.
2.这里是如何创建一个类别(工具可以是你写的任意代码, 我这里以类别作为演示)
类别的创建方法1 类别的创建方法2
3.附上类别中的代码
//UIView+ZZExtension.h
#import <UIKit/UIKit.h>
NS_ASSUME_NONNULL_BEGIN
@interface UIView (ZZExtension)
- (void)zz_setShadowWithColor:(UIColor *)color cornerRadius:(CGFloat)cornerRadius;
@end
NS_ASSUME_NONNULL_END
//UIView+ZZExtension.m
#import "UIView+ZZExtension.h"
@implementation UIView (ZZExtension)
- (void)zz_setShadowWithColor:(UIColor *)color cornerRadius:(CGFloat)cornerRadius {
self.layer.shadowColor = color.CGColor;
self.layer.shadowOffset = CGSizeMake(0,2);
self.layer.shadowOpacity = 1;
self.layer.shadowRadius = 4;
self.layer.cornerRadius = cornerRadius;
self.clipsToBounds = NO;
}
@end
3.组件的使用和效果
- (void)viewDidLoad {
[super viewDidLoad];
UIView *testView = [[UIView alloc] init];
[self.view addSubview:testView];
testView.bounds = CGRectMake(0, 0, 160, 80);
testView.center = self.view.center;
testView.backgroundColor = [UIColor yellowColor];
//这里是类别提供的方法, 我们要把自己写的类别(工具)以组件的方式提供给第三方使用, 这时候上传到cocoapods就是一个非常重要的方式.
[testView zz_setShadowWithColor:[UIColor redColor] cornerRadius:10];
}
给黄色view添加添加了一个红色阴影
最终效果demo GitHub地址, 这里是分支, 请确保下载的分支名称为:CompleteThePackaging