iOS-个人整理01 - 创建工程和UIView

传说中生成UI界面有三种方法，纯代码，xib，stroybroad，代码编辑是一切的基础，我们首先学习用代码创建视图。

一、UI工程建立

1.创建工程（xcode6.4）
快捷键Shift+command+n创建工程
选择ios->Application->SingleVIewApplication
创建后打开工程文件列表如下图

点开左侧的文件列表，进入info.plist文件，它是一个字典，将key值为Main storyboard file base name，value值为main的一行内容删去，点击该行会有个加号和减号，点击减号即可删除，运行工程就不会关联到Main.storyboard，可以删去

接着点开AppDelegate.m文件，在下面的launch函数中添加代码：

• (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions { // Override point for customization after application launch. return YES;}

2.添加代码，创建应用程序主窗口UIWindow

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {  
     
    //1.创建window  
    self.window = [[UIWindow alloc]initWithFrame:[UIScreen mainScreen].bounds];  
      
    //Frame：代表视图的大小  
    //[UIScreen mainScreen].bounds是整个屏幕的大小，初始化时将window大小设置为整个屏幕  
      
    //2.将window的背景颜色设置为灰色，默认为透明  
    [self.window setBackgroundColor:[UIColor grayColor]];  
      
    //3.将初始化好的window设置为主window并且显示  
    [self.window makeKeyAndVisible];  
      
    //如果Xcode是7.0以上版本，必须添加以下代码，创建视图控制器  
    //4.设置根视图控制器  
    [self.window setRootViewController:[[UIViewController alloc]init]];  
      
      
    //下面创建UIView  
    CGRect frame = CGRectMake(0, 0, 150, 150);//创建一个长方形结构体，用于UIView的位置和大学  
      
    UIView *myView = [[UIView alloc]initWithFrame:frame];//初始化UIView  
      
    [myView setBackgroundColor:[UIColor redColor]];//设置背景色，ios9之后，基本所有视图默认为透明色，为了看见要设置背景色  
      
    [self.window addSubview:myView];//添加子视图  
      
    //这就是在UIWindow上面添加UIView，相当于图片一层层贴上去，同样我们也可以给UIView添加UIView子视图  
      
    return YES;  
}  

运行后可以看见灰色背景左上角贴了一块红色方块
二、UI期的基础类 UIView简介

1.什么是UIView?
UIView表示屏幕上的一块矩形区域
它在App中占有绝对重要的地位
因为iOS几乎所有可视化控件都是UIview的子类
负责渲染区域的内容
并且影响该区域内发生的触摸事件
2.基本使用
i.确定视图的位置和大小，在视图初始化的时候（initWithFrame）需要传递一个参数，此参数为结构体（CGRect），也就是一个矩形，包含矩形的左上点（orgin.x&orgin.y），以及矩形的长宽（size.width&size.height)，iOS中以左上点为原点（0,0)
ii.背景颜色的设置：每一个视图及其子类都会有一个属性backgroundColor，参数为UIColor类型
iii.将初始化好的视图呈现在父视图上面：[父视图 addSubview:子视图]，addSubview调用越早，视图层级越底层

 

#pragma mark -- 基本方法和属性  
    //初始化和设置frame  
    UIView *myView = [[UIView alloc]initWithFrame:CGRectMake(10, 10, 100, 100)];  
    UIView *redView = [[UIView alloc]initWithFrame:CGRectMake(10, 10, 10, 10)];  
      
    //设置中心点  
    myView.center = CGPointMake(100, 100);  
      
    //背景色  
    myView.backgroundColor = [UIColor blueColor];  
      
    //显示和隐藏  
    myView.hidden = NO;  
      
    //设置透明度0~1  
    myView.alpha = 1;  
      
    //获取父视图  
    UIView *mySuperView = [myView superview];  
      
    //获得子视图，得到一个数值  
    NSArray *viewArray = [myView subviews];  
      
    //标记tag,为避免与系统冲突，设置1000以上  
    myView.tag = 1000;  
      
#pragma mark -- 层级关系变换的方法  
    //添加到父视图  
    [self.view addSubview:myView];  
      
    //在指定的index插入子视图  
    [self.view insertSubview:myView atIndex:1];  
      
    //在指定的视图上添加子视图  
    [mySuperView insertSubview:myView aboveSubview:redView];  
      
    //在指定的视图下面添加子视图  
    [mySuperView insertSubview:myView belowSubview:redView];  
      ```
      

**三、示例代码，创建5x8彩色贴图**

在AppDelegate.m中launch函数中写上如下代码即可

• (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
  self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]];
  // Override point for customization after application launch.
  self.window.backgroundColor = [UIColor whiteColor];
  [self.window makeKeyAndVisible];

  float screenWith = self.window.frame.size.width;
  float screenHeight = self.window.frame.size.height;
  float width = screenWith/5;
  float height = screenHeight/8;
  NSLog(@"width = %f,height = %f",width,height);
  for (int i = 0; i < 5; i++) {
  for (int j = 0; j< 8; j ++) {
  UIView myView = [[UIView alloc]initWithFrame:CGRectMake(widthi, height*j, width, height)];
  //产生随机颜色
  //给每个视图设置数组中的颜色
  [myView setBackgroundColor:[UIColor colorWithRed:arc4random()%256/255.0 green:arc4random()%256/255.0 blue:arc4random()%256/255.0 alpha:1]];
  [self.window addSubview:myView];
  }
  }
  return YES;
  }

运行效果如下（每次不一样）:
![](http://upload-images.jianshu.io/upload_images/1819486-baa67d9c706fea42?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
谢谢观看，错误之处欢迎指正，明天继续