今天是2017年7月7日-星期六
2017/7/5-2017/7/6,我作为一个新人进入到公司任职iOS开发实习生,在今天对这两天的工作进行一下总结:
1.我作为一个新人加入到艺网这个大家庭之中,通过这两天的工作感觉这是一个很和谐的大家庭,并且不论是工作氛围,还是休息时的氛围都很是不错。
2.在这两天之中我做了一个分类的Demo并且学习了一下Masonry这个第三方的使用方法:
2.1 分类Demo
先上一个结果图
-------------------------
做的Demo比较low,但不要在意这些细节。
介绍一下文件
SudokuViewAndButton.h //这个View用来放集合视图和按钮
SudokuButtonShadowView.h //这个View用来实现按钮
CustomCollectionView.h //这个View用来实现集合视图
SudokuCollectionCell.h //这个一看就知道是集合视图的item
CollectionHeaderView.h //这个也很易懂的,用来实现集合视图的头视图
简单介绍下各个文件
注:代码并不全,如果想要完整代码请到<a href='https://github.com/9527xiaoyu/SudokuDemo.git'>这里</a>下载。
CustomCollectionView
//这个类主要是做一个类似九宫格的集合视图
@interface CustomCollectionView()
@property(nonatomic,strong)UICollectionView *collection;
@property(nonatomic,strong)NSArray *itemsArray;
@property(nonatomic,strong)NSArray *categoryArray;
@property(nonatomic,strong)NSMutableArray *tempArr;
@property(nonatomic,strong)UILabel *itemsLab;
@end
@implementation CustomCollectionView
//由于是自定义的view必须有个init
- (instancetype)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self) {
[self anywayInit];
}
return self;
}
- (void)anywayInit
{
[self configParam];
[self configView];
[self configData];
[self configConstraint];
}
//参数的设置填入这里
- (void)configParam
{
}
//加载视图
- (void)configView
{
[self addSubview:self.collection];
}
//做一些控件的布局 -- 用的是Masonry
- (void)configConstraint
{
[self.collection mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.and.left.equalTo(self).offset(0);
make.right.equalTo(self).offset(0);
make.bottom.equalTo(self).offset(-20);
}];
[self.itemsLab mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.and.left.equalTo(self).offset(25);
make.left.equalTo(self).offset(18);
make.bottom.equalTo(self).offset(-29);
make.width.offset(35);
}];
}
//用于存储数据
- (void)configData
{
}
//懒加载
-(UICollectionView *)collection{
if (!_collection) {
UICollectionViewFlowLayout *layout = [[UICollectionViewFlowLayout alloc]init];
//添加头 三步
layout.headerReferenceSize=CGSizeMake(self.bounds.size.width, 40);
//添加按钮控件
layout.itemSize = CGSizeMake(78, 56);
layout.minimumInteritemSpacing = 20;//行间隔
layout.minimumLineSpacing = 11;//列间隔
layout.scrollDirection = UICollectionViewScrollDirectionVertical;//水平排列
_collection = [[UICollectionView alloc]initWithFrame:CGRectZero collectionViewLayout:layout];
_collection.delegate=self;
_collection.dataSource=self;
//注册MYCollectionViewCell
[_collection registerClass:[SudokuCollectionCell class] forCellWithReuseIdentifier:@"cell"];
//添加头 一步:注册头视图,不注册则奔溃
[_collection registerClass:[CollectionHeaderView class] forSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"collectionHeader"];
_collection.backgroundColor = [UIColor whiteColor];
}
return _collection;
}
//block回调
-(void)CustomCollectionViewWithItemsArray:(NSArray *)itemsArray CategoryArray:(NSArray *)categoryArray Requst:(CustomCollectionCheckedBlock)block{
self.itemsArray=itemsArray;
self.categoryArray=categoryArray;
self.tempArr = [NSMutableArray arrayWithArray:self.categoryArray];
self.callback = block;
[self anywayInit];
}
#pragma MARK - delegate
-(NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView{
return 4;
}
-(NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{
return 4;
}
//添加一个补充视图(头/脚) 二步
-(UICollectionReusableView *)collectionView:(UICollectionView *)collectionView viewForSupplementaryElementOfKind:(NSString *)kind atIndexPath:(NSIndexPath *)indexPath{
CollectionHeaderView *headView=[collectionView dequeueReusableSupplementaryViewOfKind:kind withReuseIdentifier:@"collectionHeader" forIndexPath:indexPath];
headView.titleLabel.text=_itemsArray[indexPath.section];
return headView;
}
-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
SudokuCollectionCell *cell=[collectionView dequeueReusableCellWithReuseIdentifier:@"cell" forIndexPath:indexPath];
cell.pictureView.image=[UIImage imageNamed:@"placeholder.png"];
cell.titleName.text=self.categoryArray[indexPath.section][indexPath.row];
return cell;
}
-(void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath{
self.callback(indexPath.section, indexPath.row,self.categoryArray[indexPath.section][indexPath.row]);
}
@end
SudokuCollectionCell
//.h文件中需要定义
@property(nonatomic,strong)UIImageView *pictureView;
@property(nonatomic,strong)UILabel *titleName;
//.m文件
//@implementation SudokuCollectionCell
- (instancetype)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self) {
[self anywayInit];
}
return self;
}
- (void)awakeFromNib
{
[super awakeFromNib];
[self anywayInit];
}
- (void)anywayInit
{
[self configParam];
[self configView];
[self configData];
[self configConstraint];
}
- (void)configParam
{
self.layer.cornerRadius=5;
// self.backgroundColor=[UIColor redColor];
// self.titleName.textColor = [UIColor colorWithRed:255.0 green:255.0 blue:255.0 alpha:1];
self.titleName.textColor = [UIColor blackColor];
}
- (void)configView
{
[self.contentView addSubview:self.pictureView];
[self.contentView addSubview:self.titleName];
}
- (void)configConstraint
{
//图片
[self.pictureView mas_makeConstraints:^(MASConstraintMaker *make) {
make.edges.equalTo(self.contentView).offset(0);
make.center.equalTo(self.contentView);
}];
//标题
[self.titleName mas_makeConstraints:^(MASConstraintMaker *make) {
make.center.equalTo(self.pictureView);
make.size.mas_equalTo(CGSizeMake(78, 56));
}];
}
- (void)configData
{
}
-(UIImageView *)pictureView{
if (!_pictureView) {
self.pictureView = [[UIImageView alloc]init];
}
return _pictureView;
}
-(UILabel *)titleName{
if (!_titleName) {
self.titleName = [[UILabel alloc]init];
self.titleName.font = [UIFont fontWithName:@".PingFang-SC-Medium" size:14];
self.titleName.textAlignment = NSTextAlignmentCenter;
}
return _titleName;
}
CollectionHeaderView
//.h
@property(nonatomic,strong)UILabel* titleLabel;
//.m
@implementation CollectionHeaderView
- (instancetype)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self) {
[self anywayInit];
}
return self;
}
- (void)anywayInit
{
[self configParam];
[self configView];
[self configData];
[self configConstraint];
}
- (void)configParam
{
self.titleLabel.textColor=[UIColor blackColor];
// self.backgroundColor = [UIColor blueColor];
}
- (void)configView
{
[self addSubview:self.titleLabel];
}
- (void)configConstraint
{
[self.titleLabel mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.and.bottom.equalTo(self).offset(0);
make.left.equalTo(self).offset(0);
make.right.mas_equalTo(-10.0);
}];
}
-(UILabel *)titleLabel{
if (!_titleLabel) {
_titleLabel=[[UILabel alloc]init];
_titleLabel.font=[UIFont fontWithName:@".PingFang-SC-Medium" size:16];
_titleLabel.textAlignment=NSTextAlignmentLeft;
}
return _titleLabel;
}
@end
SudokuViewAndButton与SudokuButtonShadowView
这里就不再拷贝代码,仅仅做一下说明。原因是这两个类中的方法与之前的文件方法相差不多。
先说一下SudokuButtonShadowView这个类的组成,这个类中实现了一个-(void)ButtonShadowViewWithRequst:(SudokuButtonShadowViewBlock)block;
方法用于回调点击事件。其次在.m文件中阴影的效果实现是通过在按钮(button)下添加一个View,用这个View做阴影实现的。
SudokuViewAndButton这个类就更简单了,它主要实现的是将SudokuButtonShadowView和集合视图显示出来。