iOS开发 -------- 九宫格坐标计算
一 要求
完成下面的布局
二 分析
寻找规律,每一个UIView的x坐标和y坐标
三 实现思路
(1) 明确每一块用得是什么View;
(2) 明确每个View之间的父子关系,每个视图都只有一个父视图,拥有很多的子视图;
(3) 可以先尝试逐个的添加格子,最后考虑使用for循环,完成所有的UIView创建;
(4) 加载app数据,根据数据长度创建对应个数的格子;
(5) 添加格子内部的子控件
(6) 给内部的子控件装配数据
四 代码示例
1 // 2 // RootViewController.m 3 // 九宫格坐标计算 4 // 5 // Created by lovestarfish on 15/11/1. 6 // Copyright © 2015年 S&G. All rights reserved. 7 // 8 9 #import "RootViewController.h" 10 11 @interface RootViewController () 12 //* 数据源数组 / 13 @property (nonatomic,retain) NSArray *apps; 14 15 @end 16 17 @implementation RootViewController 18 19 - (NSArray *)apps { 20 //1. 加载数据 21 if (!_apps) { 22 NSString *filePath = [[NSBundle mainBundle] pathForResource:@"app" ofType:@"plist"]; 23 NSDictionary *dic = [NSDictionary dictionaryWithContentsOfFile:filePath]; 24 self.apps = dic[@"app"]; 25 } 26 return _apps; 27 } 28 29 - (void)viewDidLoad { 30 [super viewDidLoad]; 31 32 self.title = @"九宫格展示"; 33 34 //2. 完成布局设计 35 //三列 36 int totalloc = 3; 37 CGFloat appViewWidth = 80; 38 CGFloat appViewHeight = 90; 39 CGFloat margin = (self.view.frame.size.width- totalloc * appViewWidth) / (totalloc + 1); 40 int appCount = (int)self.apps.count; 41 for (int i = 0; i < appCount; i++) { 42 int row = i / totalloc;//行号 43 int loc = i % totalloc;//列号 44 CGFloat appViewX = margin + (margin + appViewWidth) * loc; 45 CGFloat appViewY = margin + (margin + appViewHeight) * row; 46 //创建UIView控件 47 UIView *appView = [[UIView alloc] initWithFrame:CGRectMake(appViewX, appViewY + 80, appViewWidth, appViewHeight)]; 48 [self.view addSubview:appView]; 49 [appView release]; 50 51 //创建UIView控件中的子视图 52 UIImageView *appImageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 80, 50)]; 53 appImageView.image = [UIImage imageNamed:self.apps[i][@"image"]]; 54 appImageView.contentMode = UIViewContentModeScaleAspectFit; 55 [appView addSubview:appImageView]; 56 [appImageView release]; 57 58 //创建文本标签 59 UILabel *appLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, 50, 80, 20)]; 60 appLabel.text = self.apps[i][@"name"]; 61 appLabel.textAlignment = NSTextAlignmentCenter; 62 appLabel.font = [UIFont systemFontOfSize:12]; 63 [appView addSubview:appLabel]; 64 [appLabel release]; 65 66 //创建按钮 67 UIButton *appButton = [UIButton buttonWithType:UIButtonTypeSystem]; 68 appButton.frame = CGRectMake(10, 70, 60, 20); 69 [appButton setTitle:@"下载" forState:UIControlStateNormal]; 70 appButton.backgroundColor = [UIColor greenColor]; 71 appButton.titleLabel.font = [UIFont systemFontOfSize:12]; 72 [appButton setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal]; 73 [appView addSubview:appButton]; 74 [appButton addTarget:self action:@selector(click) forControlEvents:UIControlEventTouchUpInside]; 75 } 76 } 77 78 /** 79 * 下载按钮的响应事件 80 */ 81 - (void)click { 82 //动画标签 83 UILabel *animaLabel = [[UILabel alloc] initWithFrame:CGRectMake(self.view.center.x - 100, self.view.center.y - 64 + 20, 200, 40)]; 84 animaLabel.text = @"下载成功"; 85 animaLabel.font = [UIFont systemFontOfSize:20]; 86 animaLabel.textAlignment = NSTextAlignmentCenter; 87 animaLabel.backgroundColor = [UIColor brownColor]; 88 animaLabel.alpha = 0; 89 [self.view addSubview:animaLabel]; 90 [animaLabel release]; 91 92 //执行完之后,还得把这给删除了,推荐使用block动画 93 [UIView animateWithDuration:4.0 animations:^{ 94 animaLabel.alpha = 1.0; 95 } completion:^(BOOL finished) { 96 [animaLabel removeFromSuperview]; 97 }]; 98 99 } 100 101 - (void)didReceiveMemoryWarning { 102 [super didReceiveMemoryWarning]; 103 } 104 105 @end
五 执行效果
