美文网首页
UI基础(一):从UIView这个最纯粹的容器开始

UI基础(一):从UIView这个最纯粹的容器开始

作者: 指尖书法 | 来源:发表于2017-04-29 00:28 被阅读53次

UIKit坐标系

  • frame的坐标原点: 子控件相对于父控件的左上角为坐标原点。
  • bound的坐标原点: 以自己的左上角为坐标原点

UIView简单介绍

  • UI界面上,我们能够看到的所有的东西,都是UIView
  1. 所有的控件,都直接,或者间接继承UIView
  2. UIView是一个容器,里面可以添加其他的控件
  3. 我们可以通过UIView来制作一些最纯粹的界面

UIView的常见属性

  • SuperView:父控件
  • frame属性:CGRect类型:决定了控件的位置和尺寸
  • UIView的tag属性
    1.所有直接或者间接继承UIVIew的控件都有一个tag属性
    2.这个属性,只能用来保存一个数字,对控件的外观没有任何影响
    3.但是我们可以通过这个属性的值,来判断是哪个控件
    4.连线注意:不同的按钮,可以连同一个方法

UIView的常见方法

  • removeFromSuperView:从父控件中删除
  • 在subviews中,删除了其中的一个元素(控件),后面的元素会前移,注意数组越界。
  • 如果删除了父控件,它的所有子控件也会跟着从view上移除
  • addsubView:添加子控件
  • subViews:调用addsubView 这个方法 添加的所有子控件 都在这里面
  • viewWithTag:获取子控件,如果tag跟自己一样,优先获取自己
    这个方法之前还真的没用过
//1.获取View
    UILabel *label1 = [self.whiteView viewWithTag:1];
  • transform:可以改变位置,大小,旋转 需要注意的是 有两套方法,一套是直接创建固定值,一套是在某一个基础上偏移

颜色UIColor

  • 可以直接通过类方法,获取纯色,比如 红色 绿色等等[UIColor redColor] [UIColor blackColor]

  • 可以通过[UIColor colorWithRed:randomR green:randomG blue:randomB alpha:1]; 来创建颜色 通过 红色,绿色,蓝色 三种 来组成一个新的颜色

  • 2.来一个随机的颜色
    传入的是 0-1的 浮点数(之前我一直以为是0-255。。。)
    alpha: 0看不到 1完全看到

    //能够获取到 0-254的随机数

    float randomR =arc4random_uniform(255)/255.0; //oc中随机数函数
    float randomG =arc4random_uniform(255)/255.0;
    float randomB =arc4random_uniform(255)/255.0;
    UIColor *randomColor =[UIColor colorWithRed:randomR green:randomG blue:randomB alpha:1];

动画初体验

  • 第一种,头尾式
    //开始动画
    [UIView beginAnimations:nil context:nil];
    //修改动画的各种属性
    [UIView setAnimationDuration:3];
    [UIView setAnimationDelay:2];
    
    //赋值回去
    creaeView.frame=oldFrame;
    
    //提交动画
    [UIView commitAnimations];
  • 第二种,block式
    [UIView animateWithDuration:3 animations:^{
        creaeView.frame=oldFrame;
    }];

按钮的使用

  • image属性可以设置按钮的图片 这样设置的图片跟文字平级
  1. 按钮默认的type是system 当设置了image以后就是custom 我们一般使用custom
  2. 设置background图片,是在文字的后面
  3. 按钮有很多种状态
    默认default:可以设置一套样式
    点击以后是highlighted:可以设置另外一套样式
    selected:需要使用代码设置
    disable:禁用状态
  4. 使用代码创建按钮 如果想要设置不同状态的样式,需要分别进行设置, 代码量较大
  5. 使用代码添加点击事件addTarget方法

UIImageView

  • 如果只是想要显示图片,不需要可以点击,或者说显示文字,那么选择UIImageView
  • UIImageView可以通过它的image属性 设置显示的图片

修改控件的位置、大小

不能直接赋值frame.origin.x = 0;
需要整体赋值:

//1.获取原始Frame
    CGRect oldFrame=self.tankImageView.frame;
    
    //2.判断tag值-并且修改frame
    switch (sender.tag) {
        case 1://向上
            oldFrame.origin.y-=10;
            break;
        case 2://向下
            oldFrame.origin.y+=10;
            break;
        case 3://向右
            oldFrame.origin.x+=10;
            break;
        case 4://向左
            oldFrame.origin.x-=10;
            break;
            
        default:
            break;
    }
    
    //3.使用动画的方式设置Frame给控件
    [UIView animateWithDuration:1 animations:^{
        self.tankImageView.frame=oldFrame;
    }];

transform属性相关

  • 下面这几个方法,都是 直接创建一个 固定值的 tranform
 CGAffineTransformMakeRotation(<#CGFloat angle#>)直接修改旋转角度
 CGAffineTransformMakeScale(<#CGFloat sx#>, <#CGFloat sy#>)直接修改缩放
 CGAffineTransformMakeTranslation(<#CGFloat tx#>, <#CGFloat ty#>)修改位
 CGAffineTransformMake(<#CGFloat a#>, <#CGFloat b#>, <#CGFloat c#>, <#CGFloat d#>, <#CGFloat tx#>, <#CGFloat ty#>)参数最多,的可定制型最强,用的不多置
  • 如果想要每次都累加一点,那么需要使用另外一组方法
 CGAffineTransformRotate(self.tankImageView.transform, M_PI_4);
 CGAffineTransformScale(self.tankImageView.transform, M_PI_4);
 CGAffineTransformTranslation(self.tankImageView.transform, M_PI_4);

M_PI M_PI_2 M_PI_4 分别 对应 π π/2 π/4

初次接触代码创建控件

自定义button 和View的创建

#warning viewDidLoad 在控制器的View 创建好加载到内存中的时候,就会执行
//一般在这里,可以初始化数据,或者创建控件,等等
- (void)viewDidLoad {
    [super viewDidLoad];
    
    //1.创建某一个种type的按钮
    UIButton *btn=[UIButton buttonWithType:UIButtonTypeCustom];
    
    //2.frame
    btn.frame=CGRectMake(100, 100, 100, 100);
    
    //3.设置文字
    [btn setTitle:@"WC" forState:UIControlStateNormal];
    
    //4.设置文字颜色
    [btn setTitleColor:[UIColor redColor] forState:UIControlStateNormal];
    
    //5.设置背景图片
    [btn setBackgroundImage:[UIImage imageNamed:@"tank"] forState:UIControlStateNormal];
    //6.设置图片
//    [btn setImage:[UIImage imageNamed:@"joystick"] forState:UIControlStateNormal];
    
    //7.绑定方法(事件)
    [btn addTarget:self action:@selector(doSomeThing) forControlEvents:UIControlEventTouchUpInside];
    
    //8.添加到控制器的View上面
    [self.view addSubview:btn];
    
}

-(void)doSomeThing{
    NSLog(@"今天天气棒棒哒");
}

//1.代码创建控件--UIView
- (IBAction)createUIView {
    //1.alloc init一个
    UIView *createView=[[UIView alloc]init];
    
    //2.修改frame
    createView.frame=CGRectMake(100, 100, 100, 100);
    
    //3.设置一个颜色
    createView.backgroundColor=[UIColor purpleColor];
        
    //4.添加到控制器的View上面
    [self.view addSubview:createView];
}

控件的一些注意点

  • label的设置

    lines属性设置为0可以自动换行
    高度如果不够,自动换行也是看不到的

  • 按钮的启用禁用

    按钮有个一个属性.enabled 如果是yes 就是可用 反之不可用

第一次使用plist文件和懒加载 优化数据结构

  • 将plist文件中的属性转化为model

model.m

 - (instancetype)initWithDic:(NSDictionary *)dic{
    if (self=[super init]) {
        self.desc=dic[@"desc"];
        self.icon=dic[@"icon"];
    }
    return self;
}

viewController.m

self.label.text = model.desc;
  • 懒加载
-(NSArray *)pictures{
    //如果为空 那么就是没有值,需要初始化
    if (_pictures==nil) {
        //0.使用plist 配合bundle 读取数据
        //0.1获取bundle
        NSBundle *mainBundle=[NSBundle mainBundle];
        //0.2获取路径
        NSString *path=[mainBundle pathForResource:@"images.plist" ofType:nil];
        //0.3初始化数组
        _pictures=[NSArray arrayWithContentsOfFile:path];
    }
    return _pictures;
}

程序启动的简单原理

1. stroryboard 启动设置

  • main.storyboard中可以添加多个ViewController 但是,程序启动的时候,加载的是 箭头指向的那个
  1. 可以拖拉箭头,修改默认的启动的界面,也可以通过 is initial ViewController 属性来设置
  1. 在storyboard中,的控制器,如果想要跟代码建立联系,需要设置customClass
  1. 在项目的设置界面,可以指定,使用哪一个.storyboard作用默认的启动界面,当项目启动的时候,就回去这个.storyboard中找箭头指向的控制器,如果找不到,报错,黑色
  2. 如果添加了多个storyboard,默认会找到,项目设置中设置的那个storyboard
  3. 删除项目文件的时候,
    中间的选项,是删除引用,文件还在,
    第三个选项是,直接删除到回收站

2. stroryboard 的本质

  • storyboard的本质是一个文本文件,有一定格式的文本文件
  1. 这种格式叫做 xml 使用 标签的形式标示一些信息
  2. storyboard中托拉拽的本质,其实是修改storyboard文本中的内容
    每一个使用拖拉方式添加的控件信息,全部保存在了文本中(xml)标签的形式
  3. 添加多个控件,只是增加文本的值而已

3 .程序的启动原理_简单版本

1.main.m中的main函数
2.UIApplicationMain(argc, argv, nil, NSStringFromClass([AppDelegate class]));
3.找到设置好的 xxx.storyboard
4.创建箭头所指的控制器
5.读取storyboard中的所有文本值,创建对应的控件 ,添加到 控制器的View中
6.当storyboard读取完毕以后,调用viewDidLoad 方法
7.呈献给用户

Bundle

一.什么是Bundle

  • 应用程序.app 就是bundle
  • ios程序.打包好以后.其实也是xxx.app
  • 查看方法,可以NSLog(NSHomeDirectory()); 打印的路径,往前移动两个文件夹,bundle中找到对应的.app
  • bundle中 有我们项目里面的文件

二.图片位置的区别

  • 直接放在项目中,在bundle里面 可以看得到图片
  1. 放在images.xcassets中(xcassets.xcassets)打包以后,会到Assets.car中,无法还原出来(目前为止)更加安全

三.NSBundle

  • 这个类,对应到了 当前项目 打包以后的xxx.app
  1. mainBundle这个类方法 可以获取当前应用程序的xx.app
  2. bundle中的所有文件的全路径,我们都可以通过pathForResource来获取
  3. 可以直接把文件的后缀,拼接到文件名的后面

四.plist文件

  1. 可以用来保存字典
  2. 项目中的plist文件 保存的位置是 bundle中 (bundle去获取他)
  3. 在开发中,可以使用plist文件,把数组跟代码剥离开来

使用UIImageView 来播放动画

  1. 可以用来展示单张图片
  2. 也可以用来播放动画
  3. 播放动画的方法
 - (void)startAnimating;
 - (void)stopAnimating;
 - (BOOL)isAnimating;
  1. 用来存放动画图片的属性
    @property(nonatomic,copy) NSArray *animationImages;
  2. 两个属性
    @property(nonatomic) NSTimeInterval animationDuration; //持续时间@property(nonatomic) NSInteger animationRepeatCount //播放次数

IOS开发中内存的处理细节

  1. 开发IOS项目,如果APP占用内存过大,IOS系统会发送一个警告给应用程序
  2. 程序员可以在警告中,释放内存
  3. 如果发送了警告以后,APP的内存占用没有任何的改变,那么会---闪退

UIimage加载图片的几种方式

  1. UIimage imageName:图片名 使用这种方式加载的图片 会在内存中常驻。
    一般都是按钮的背景图,小箭头 icon 等等 UI界面上的小元素 使用这种方式
    对于需要释放的图片 使用另外的方式:
  2. UIImage imageWithContentsOfFile:路径名
    使用这种方式加载的图片,只有当没有任何一个对象对他进行强引用的时候,才会释放
  3. 图片的强引用和释放
    播放第一个动画的时候,UIimageView的图片属性 对加载到内存中的图片强引用了
    播放第二个动画,第一组图片被释放了,第二组图片被强引用

延迟调用方法

可以延迟具体的时间调用某一个方法
[self performSelector:@selector(cleanImage) withObject:nil afterDelay:60];

相关文章

  • UI基础(一):从UIView这个最纯粹的容器开始

    UIKit坐标系 frame的坐标原点: 子控件相对于父控件的左上角为坐标原点。 bound的坐标原点: 以自己的...

  • 《iOS进阶》-UIWindow

    UIWindow UIWindow是最顶层的界面容器,继承自UIView。作用如下: 作为UIView的最顶层容器...

  • ios-梳理-ios基础

    这些基础是必须掌握的! ios基础--UIView UIView是做UI界面的基础,这里不啰嗦常用的控件UITab...

  • UI基础 - UIView

    UIView的常见属性 NSArray *subviews所有的子控件数组元素的顺序决定着子控件的显示层级顺序(下...

  • UI基础知识

    UI基础知识 控件相关 大部分UI控件都基于UIView,因此控件不仅具有一些自己独有的属性,还有UIView的属...

  • iOS知识点总结(一)

    iOS需要学习的内容 UI 基础控件: UIButton、UIImageView、UILable、UIView、U...

  • CALayer-拾遗

    CALayer是什么? 在iOS中,UIView是我们构建UI的基础单元,而UIView之所以可以显示各种元素靠的...

  • UI基础篇-UIView

    所有的UI控件都是UIView的子类 UIWindow UIWindow是UIView的子类1、创建和配置UIWi...

  • UI基础控件- UIView

    控件 控件:屏幕上的所有UI元素都叫做控件(视图、组件) 控件的共同属性(苹果将控件的共同属性都抽取到父类UIVi...

  • UI基础和UIView

    为了学习相关的原理,使用Empty Application模板建立工程;在开始输入正常学习的代码之前,要先:1、将...

网友评论

      本文标题:UI基础(一):从UIView这个最纯粹的容器开始

      本文链接:https://www.haomeiwen.com/subject/eanazttx.html