iOS学习21之UILabel, UITextField, UIButton, UIImageView

1.UILabel

 1> 概述

  UILabel (标签): 是显示文本的控件。在App中 UILabel 是出现频率最高的控件

  UILabel UIView 子类,作为子类一般是为了扩充父类的功能, UILabel 扩展了文字显示的功能, UILabel 是能显示文字的视图。

 2> 创建UILabel的步骤

  创建UILabel与创建UIView的步骤很相似。 

  • 开辟空间并初始化(如果本类有初始化方法,则使用自己的初 始化方法;否则使用父类的)

  • 设置文本控制相关的属性

  • 添加到父视图上,用以显示

  • 释放所有权(只是做了引用计数-1)---ARC不需要,系统会自动添加内存回收代码

 3> UILabel属性设置

  红色为常用的属性,必须记住

  代码案例:

 1     // 1.创建UILabel对象并初始化
 2     UILabel *usernameLabel = [[UILabel alloc] init];
 3     UILabel *inputUsernameLabel = [[UILabel alloc] init];
 4     
 5     // 2.设置属性
 6     usernameLabel.frame = CGRectMake(50, 200, 70, 30);
 7     
 8     inputUsernameLabel.frame = CGRectMake(CGRectGetMaxX(usernameLabel.frame) + kSpace,
 9                                           CGRectGetMinY(usernameLabel.frame),
10                                           CGRectGetWidth(self.window.frame) - CGRectGetWidth(usernameLabel.frame) - (CGRectGetMinX(usernameLabel.frame) * 2 + kSpace),
11                                           CGRectGetHeight(usernameLabel.frame)); // CGRectGet... 获取某一个视图的frame值
12     
13     // 设置文本信息
14     usernameLabel.text = @"用户名:";
15     inputUsernameLabel.text = @"请输入用户名";
16 
17     // 设置文本的对齐方式(居中|居左|居右)
18     usernameLabel.textAlignment = NSTextAlignmentRight;
19     inputUsernameLabel.textAlignment = NSTextAlignmentCenter;
20 
21     // 设置文本内容颜色
22     usernameLabel.textColor = [UIColor purpleColor];
23     inputUsernameLabel.textColor = [UIColor purpleColor];
24 
25     // 设置字体
26     usernameLabel.font = [UIFont fontWithName:@"Helvetica-Bold" size:20];
27     inputUsernameLabel.font = [UIFont fontWithName:@"Helvetica-Bold" size:20];
28 
29     // 打印所有的字体样式
30     NSLog(@"%@", [UIFont familyNames]);
31     
32     // 设置显示行数
33     usernameLabel.numberOfLines = 2;
34     // 断行模式
35     usernameLabel.lineBreakMode = NSLineBreakByWordWrapping; // 按照单词换行
36     // 阴影颜色
37     usernameLabel.shadowColor = [UIColor blackColor];
38     // 阴影大小
39     usernameLabel.shadowOffset = CGSizeMake(2, 1);

使用CGRectGet...可以获取任意一个视图的位置坐标,这样可以提高代码的健壮性,修改时只需要修改一处就可以修改所有相关视图的位置

2.UITextField

 1> 概述

  UITextField(输入框):是控制文本输入和显示的控件。在App中UITextField出现频率也比较高。

      iOS系统借助虚拟键盘实现输入,当点击输入框,系统会自动调出键盘,方便你进一步操作。在你不需要输入的时候,可以使用收回键盘的方法,收回弹出的键盘。

      UITextFieldUILabel相比,UILabel主要用于文字显示,不能编辑; UITextField允许用户编辑文字(输入)。

 2> 创建UITextField步骤

  创建UITextField与创建UILabel的步骤很相似。  

  • 开辟空间并初始化(如果本类有初始化方法,则使用自己的初始化方法;否则使用父类的)  

  • 设置文本显示、输入等相关的属性

  • 添加到父视图上,用以显示

  • 释放对象所有权(MRC需要)

 3> UITextField文本显示属性

 1     /**
 2      *  1.创建UITextField对象并初始化
 3      */
 4     UITextField *textField = [[UITextField alloc] initWithFrame:CGRectMake(50, 200, 300, 40)];
 5     
 6     /**
 7      *  2.设置属性
 8      */
 9     textField.backgroundColor = [UIColor cyanColor];
10     
11     // 文本内容
12     textField.text = @"用户名";
13     textField.placeholder = @"请输入用户名";
14     textField.textColor = [UIColor blackColor];
15     
16     // 文本对齐方式
17     textField.textAlignment = NSTextAlignmentCenter;

 4> UITextField输入控制属性

 1     // 是否允许编辑
 2     textField.enabled = YES;
 3     
 4     // 开始编辑时是否清空输入框的内容
 5     textField.clearsOnBeginEditing = YES;
 6     
 7     // 是否安全输入(输入密码时使用)
 8     textField.secureTextEntry = NO;
 9     
10     // 设置键盘样式
11     textField.keyboardType = UIKeyboardTypeEmailAddress;
12     
13     // 键盘右下角return按钮类型(枚举值)
14     textField.returnKeyType = UIReturnKeySend;

 5> UITextField外观控制属性

 1     // 边框样式
 2     textField.borderStyle = UITextBorderStyleRoundedRect;
 3     
 4     // 自定义输入视图(默认是键盘)
 5     UIView *view = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 414, 50)];
 6     view.backgroundColor = [UIColor cyanColor];
 7     textField.inputView = view;
 8     
 9     // 输入框上方的内容
10     textField.inputAccessoryView = view;
11     
12     // 清除按钮格式(x)
13     textField.clearButtonMode = UITextFieldViewModeWhileEditing;
14     
15     // 输入框左视图
16     textField.leftView = view;
17 
18     textField.leftViewMode = UITextFieldViewModeAlways;

 6> UITextField常用代理方法

 

  设置代理的三部曲

  ① 设置代理

 1 textField.delegate = self;                                                                     

  ② 遵守协议(在.h文件或.m文件的延展中)

 1 @interface AppDelegate : UIResponder <UIApplicationDelegate, UITextFieldDelegate>             

  UITextFieldDelegateUITextField 遵守的协议

  ③ 实现协议(在AppDelegate.m文件或控制器的.m文件中)

 1 // 将要开始编辑
 2 - (BOOL)textFieldShouldBeginEditing:(UITextField *)textField
 3 {
 4     NSLog(@"将要开始编辑");
 5     return YES;
 6 }
 7 
 8 // 已经开始编辑
 9 - (void)textFieldDidBeginEditing:(UITextField *)textField
10 {
11     NSLog(@"已经开始编辑");
12 }
13 
14 // 将要完成编辑
15 - (BOOL)textFieldShouldEndEditing:(UITextField *)textField
16 {
17     NSLog(@"将要完成编辑");
18     return YES;
19 }
20 
21 // 已经完成编辑
22 - (void)textFieldDidEndEditing:(UITextField *)textField
23 {
24     NSLog(@"已经完成编辑");
25 }
26 
27 // 点击键盘return键的时候,键盘回收
28 - (BOOL)textFieldShouldReturn:(UITextField *)textField
29 {
30     [textField resignFirstResponder]; // 释放第一响应者,使键盘回收
31     NSLog(@"点击键盘return键");
32     return YES;
33 }

3.UIButton

 1> 概述

  UIButton(按钮):是响应用户点击的控件。在App中UIButton是出现频率很高的控件。

  UIButtonUILabelUITextField侧重点不同,侧重于处理用户交互事件。当然UIButton类也提供了一些方法控制按钮外观。

 2> 使用UIButton的步骤

  创建UIButton与创建UILabelUITextFieldUIView的步骤很相似。  

  • 创建button对象(如果本类有初始化方法,则使用自己的初始化方法;否则使用父类的)    

  • 设置按钮相关的属性

  • 为按钮添加点击事件

  • 添加按钮到父视图上,用以显示

  • 按钮无需释放(一般情况创建UIButton都使用自己的便利构造器方法,无需释放对象的所有权)

 3> UIButton外观控制属性

 1     // 设置背景图片
 2     // 创建UIImage对象
 3     UIImage *xiaoPangImage = [UIImage imageNamed:@"xiaopang.jpg"];
 4     
 5     // 普通状态下
 6     [button setBackgroundImage:xiaoPangImage forState:UIControlStateNormal];
 7     
 8     // 高亮状态下
 9     [button setBackgroundImage:[UIImage imageNamed:@"huaiyu.jpg"] forState:UIControlStateHighlighted];
10     
11     // 设置前景图片(必须是镂空的图)
12     [button setImage:[UIImage imageNamed:@"222.png"] forState:UIControlStateNormal];

1     // 设置标题 普通状态下
2     [button setTitle:@"点我啊..." forState:UIControlStateNormal];
3     
4     // 设置标题 高亮状态下(点住)
5     [button setTitle:@"在点我..." forState:UIControlStateHighlighted];
6     
7     // 设置标题颜色
8     button.tintColor = [UIColor redColor];

 4> UIButton添加事件

  UIButton从父类UIControl那继承了控制相关的方法, 如添加事件、移除事件等。

    // 单击状态下
    [button addTarget:self action:@selector(buttonClick) forControlEvents:UIControlEventTouchUpInside];
 1 // 实现按钮点击事件
 2 - (void)buttonClick:(UIButton *)sender {
 3     
 4     NSLog(@"点我干啥");
 5     
 6     sender.backgroundColor = [UIColor colorWithRed:arc4random() % 256 / 255.0 green:arc4random() % 256 / 255.0 blue:arc4random() % 256 / 255.0 alpha:1];
 7     
 8     
 9     // 移除事件
10     [sender removeTarget:self action:@selector(buttonClick:) forControlEvents:UIControlEventTouchUpInside];
11     
12 }

4.UIImageView 

 1> 概述

  UIImageView是iOS中用于显示图片的类,iOS中几乎所有看到的图片,都是由这个类来显示的。

 2> UIImageView的创建

1 // 图片文件路径
2 NSString *path = [[NSBundle mainBundle] pathForResource:@"1" ofType:@"jpg"];
3 // 创建一个UIImage对象,使用initWithContentOfFile: 方法
4 UIImage *image = [UIImage imageWithContentsOfFile:path];
5 // 创建一个UIImageView对象,使用initWithImage: 方法
6 UIImageView *imageView = [[UIImageView alloc] initWithImage:image];
7 imageView.frame = CGRectMake(100, 100, 100, 100);
8 [self.view addSubview:imageView];

 3> UIImageView的动态图(实现动画)

  animationImages // 设置一组动态图
  animationDuration // 设置播放一组动态图片的时间
  animationRepeatCount // 设置重复次数
  startAnimating // 开始动画
  stopAnimating // 结束动画

 1     // 添加动态植物
 2     UIImageView *flowerImageView = [[UIImageView alloc] initWithFrame:CGRectMake(100, 200, 80, 80)];
 3     
 4     // 准备图片数组
 5     NSMutableArray *imageArray = [NSMutableArray array];
 6     for (int i = 1; i <= 18; i++) {
 7         // 图片名
 8         NSString *nameStr = [NSString stringWithFormat:@"flower%d.tiff", i];
 9         // 创建UIImage对象
10         UIImage *image = [UIImage imageNamed:nameStr];
11         // 将UIImage对象添加到数组中
12         [imageArray addObject:image];
13     }
14     
15     // 设置一组动态图片
16     flowerImageView.animationImages = imageArray;
17     
18     // 设置动画播放时间
19     flowerImageView.animationDuration = 1;
20     // 设置重复次数
21     flowerImageView.animationRepeatCount = 0; // 默认为0,0表示无限循环
22     // 开始动画
23     [flowerImageView startAnimating];
24     
25     [bgImageView addSubview:flowerImageView];

 

posted @ 2016-04-06 23:13  墨隐于非  阅读(219)  评论(0编辑  收藏  举报