IOS之UI--小实例项目--添加商品和商品名（纯代码终结版）

时间：2015-11-17 06:47:50 阅读：351 评论：0 收藏：0 [点我收藏+]

标签：

前言：这个小实例项目是完完全全以MJ视频传授的优化方案一步一个思路从零开始敲出代码的，而且每一步都有思路，都有逻辑所以然。敲代码讲究思路，我个人不建议记忆太多东西，反正我记性很差的。

小贴士：文章末尾有 项目资源 的百度云下载链接。

小实例项目--添加商品和商品名

技术分享

好，现在完成了 plist文件的数据 --转换到--> 集合对象存储这些数据 ,接下来根据MVC的原则，我们当然需要一个Model(数据模型)，所以需要新建数据模型类：

技术分享

到这里MVC中的Model准备好了，接着就要准备View了：

技术分享

为了能够将控件给多个控制器共享

继承自系统自带的控件，写一个属于自己的控件
目的：封装控件内部的细节，不让外界关心
步骤：
- 新建一个继承UIView的类
- 在init方法中添加子控件
- 在layoutSubViews方法中设置子控件的frame
  - 一定要调用[super layoutSubView]
- 提供一个模型属性(我个人发现：其实可以直接通过初始化方法传入局部参数，然后局部就使用这个模型属性)，重写模型属性的set方法
  - 在set方法中取出模型属性，给对应的子控件赋值

因为继承自UIView，所以就具有UIView的属性。
比如frame属性，比如addSubView方法，以及可以重写专门用来布局子控件的layoutSubViews方法

layoutSubviews这个方法专门用来布局子控件，设置子控件的frame

-(void)layoutSubviews
{
    //这个方法必须要实现
    [super layoutSubviews];
}

思考一下自定义控件在这个MVC综合项目应该怎么去自定义和使用：

1、首先因为组合模式，所以需要内部创建两个需要组合的控件：
        UIImageView和UILabel这两个子控件。
2、在什么地方创建这两个组合的控件呢？
        在初始化方法中创建最合适。因为我们需要一创建这个自定义控件，就创建好了两个子控件。
3、另外，创建子控件需要模型数据model，因为一个UIImageView对应一个icon，一个UILabel对应一个商品名称，
   而一个icon和一个UILabel是存储在一个model模型对象中的，所以，还需要创建一个模型对象的引用。

技术分享

九宫格算法思路：

逻辑过程描述：每点击一次，添加一次图片，而且一行添加超过三次会换行，而且所占位置是父控件的行距离的三分之一。
需要解决问题细分三点：
    1、每点击一次，添加一次图片
    2、一行添加超过三次换行
    3、所在位置是父控件行距离的三分之一

问题1解决思路：每点击一次，变化的是子控件添加1，所以可以通过父控件的子控件数来获取动态数据数值 n ：

int n = (int)self.shopsBoxView.subView.count

问题2解决思路：只要涉及到换行可以考虑求余数或者求模：

//行数：row 列：column
int row = n / 3;
int column = n % 3;

然后是九宫格的这个格子的坐标
(0,0)(0,1)(0,2)
(1,0)(1,1)(1,2)
(2,0)(2,1)(2,2)
结合对应子控件的个数的次第
 1，2，3
 4，5，6
 7，8，9

简单讲解一下逻辑关系，当我们第一次添加子控件之前，子控件个数count = 0，对应即将添加子控件的坐标是(0,0)，所以：count = 0 -> (0,0);count = 1 -> (0,1);count = 2 -> (0,2)...以此类推

总结：用当前子控件个数，通过求得行列的算法，就能算出对应的九宫格格子的坐标

问题3的解决思路：

通过问题二获取的坐标可以对应算出各需要添加的子控件坐标位置。

上代码算法思路(另外直接写完了按钮在数量达到目标数值会自动变成disEnable状态)：

  1 #import "ViewController.h"
  2 #import "HYShopModel.h"
  3 #import "HYUIView.h"
  4 
  5 @interface ViewController ()
  6 
  7 @property (weak, nonatomic) IBOutlet UIView *shopsBoxView;
  8 
  9 /** 存储数据的引用 */
 10 @property (nonatomic,strong)NSMutableArray *shopsArray;
 11 
 12 /** shopView的宽 */
 13 @property (nonatomic,assign)CGFloat viewWidth;
 14 /** shopView的高 */
 15 @property (nonatomic,assign)CGFloat viewHeight;
 16 /** 宽间距 */
 17 @property (nonatomic,assign)CGFloat spaceWidth;
 18 /** 高间距 */
 19 @property (nonatomic,assign)CGFloat spaceHeight;
 20 
 21 @property (weak, nonatomic) IBOutlet UIButton *addBtn;
 22 @property (weak, nonatomic) IBOutlet UIButton *removeBtn;
 23 
 24 @end
 25 
 26 @implementation ViewController
 27 
 28 /**
 29  *  重写_shopsArray的get方法
 30  *
 31  *  @return NSMutableArray shosArray
 32  */
 33 -(NSMutableArray *)shopsArray{
 34     if (_shopsArray == nil) {
 35         
 36         _shopsArray = [NSMutableArray array];
 37         
 38         NSString* dataFilePath = [[NSBundle mainBundle] pathForResource:@"shopList.plist" ofType:nil];
 39         
 40         NSMutableArray* dataArray = [NSMutableArray arrayWithContentsOfFile: dataFilePath];
 41         
 42         for (NSDictionary *dic in dataArray) {
 43             HYShopModel * model = [HYShopModel shopModel:dic];
 44             [_shopsArray addObject:model];
 45         }
 46     }
 47     return _shopsArray;
 48 }
 49 
 50 - (void)viewDidLoad {
 51     [super viewDidLoad];
 52     
 53     [self loadData];
 54 }
 55 /**
 56  *  加载必要的数值
 57  */
 58 -(void)loadData
 59 {
 60     //抽取重复使用的必要的数值
 61     //shopView的宽高
 62     _viewWidth = 70;
 63     _viewHeight = 100;
 64     //间隔距离
 65     _spaceWidth = (self.shopsBoxView.frame.size.width - _viewWidth * 3) * 0.5;
 66     _spaceHeight = (self.shopsBoxView.frame.size.height - _viewHeight * 3) * 0.5;
 67     NSLog(@"%f,%f",_spaceWidth,_spaceHeight);
 68     NSLog(@"%f",self.shopsBoxView.frame.size.height);
 69     
 70 }
 71 - (IBAction)add {
 72     NSLog(@"添加商品展示");
 73     
 74     
 75     //shopsBoxView当前子控件的个数
 76     int n = (int)self.shopsBoxView.subviews.count;
 77     //行数：row 列：column
 78     int row = n % 3;
 79     int column = n / 3;
 80     NSLog(@"row:%d and column:%d",row,column);
 81     
 82     
 83     
 84     HYShopModel* model = self.shopsArray[n];
 85     NSLog(@"%@",model);
 86     NSLog(@"%@",model.name);
 87     HYUIView* shopView = [[HYUIView alloc] initWithShopModel:model];
 88     shopView.frame = CGRectMake(row * _spaceWidth + row * _viewWidth,
 89                                 column * _spaceHeight + column * _viewHeight,
 90                                 _viewWidth,
 91                                 _viewHeight);
 92     
 93     [self.shopsBoxView addSubview:shopView];
 94     
 95     self.addBtn.enabled = (self.shopsBoxView.subviews.count < 6);
 96     self.removeBtn.enabled = (self.shopsBoxView.subviews.count > 0);
 97 
 98 }
 99 - (IBAction)remove {
100     NSLog(@"去除商品展示");
101     //这里需要设置，如果没有商品，就应该取消按钮的可点击状态
102     [self.shopsBoxView.subviews.lastObject removeFromSuperview];
103     self.removeBtn.enabled = (self.shopsBoxView.subviews.count != 0);
104     self.addBtn.enabled = (self.shopsBoxView.subviews.count < 6);
105 }
106 
107 @end