通过对基础部分的初步认识,今天我们将开始对UI进行初学者之旅啦!
废话不多说,看重点:
UILabel(标签)
UILabel:是iOS中提供的用来显示文字的控件,继承自UIView.
核心功能:显示文字.
既然是继承自UIView的类,那么就表明UILabel可以使用UIView中的方法,但是UIView虽然是iOS中提供的视图的基类,提供了视图的公共的属性以及公共的方法,并没有具体的功能(显示文字,输入文字等).
一般来说大致分为4个步骤:
创建视图对象 -> 配置相关属性 -> 添加到父视图 -> 释放所有权
那么执行如下代码:
//1.创建视图对象
UILabel *aLabel = [[UILabel alloc]initWithFrame:CGRectMake(30, 100, 300, 200)];
//2.配置相关属性
aLabel.backgroundColor = [UIColor blackColor];
//2.1显示文字
aLabel.text = @"Microsoft is the biggest company Application windows are expected to have a root view controller at the end of application launch";
//2.2文字颜色
aLabel.textColor = [UIColor whiteColor];
//2.3文字的对齐方式
aLabel.textAlignment = NSTextAlignmentCenter;
//2.4设置标签多行显示
aLabel.numberOfLines = 0;
//2.5设置行的截取方式
aLabel.lineBreakMode = NSLineBreakByWordWrapping;
//2.6阴影颜色(文字阴影)
aLabel.shadowColor = [UIColor redColor];
//2.7阴影偏移量(改变阴影和实体字的距离)
aLabel.shadowOffset = CGSizeMake(5, 5);
//2.8文字字体(字体样式和大小)
//2.8.1使用系统样式改变字体大小
//aLabel.font = [UIFont systemFontOfSize:22];
//2.8.2使用加粗样式改变字体大小
//aLabel.font = [UIFont boldSystemFontOfSize:17];
//2.8.3修改字体样式和字体大小
aLabel.font = [UIFont fontWithName:@"Zapfino" size:14];
//3.添加到父视图上
[self.window addSubview:aLabel];
//4.释放所有权
[aLabel release];
会产生一个如图所示的效果图:
代码效果图.png
下面我会对一些代码进行解释,这里主要解释步骤"配置相关信息"的代码块"
(注:在学习OC的时候我们都应具备查阅API的能力了,在此不过多的阐述UILabel的方法)
//2.1显示文字
//UILabel的最终要的作用就是"显示文字",既然是显示文字那么text毫无疑问是UILabel最核心的方法.
aLabel.text = @"Microsoft is the biggest company Application windows are expected to have a root view controller at the end of application launch";
到这里其实UILabel算是已经结束了,因为他的任务显示文字已经完成.
那么为何还有那么多代码呢?
那是因为虽然你的作用已经发挥,但是没有其他相应的辅助给你助攻,你怎么完成更加酷炫的击杀?
//2.3文字的对齐方式
aLabel.textAlignment = NSTextAlignmentCenter;
通过查阅API了解到方法textAlignment该如何的使用
textAlignment的API.png
然后进入到代码内部可以看到枚举的各种属性,根据自己的需求选择属性:
typedef NS_ENUM(NSInteger, NSTextAlignment) {
NSTextAlignmentLeft = 0, // Visually left aligned
#if TARGET_OS_IPHONE
NSTextAlignmentCenter = 1, // Visually centered
NSTextAlignmentRight = 2, // Visually right aligned
#else /* !TARGET_OS_IPHONE */
NSTextAlignmentRight = 1, // Visually right aligned
NSTextAlignmentCenter = 2, // Visually centered
#endif
NSTextAlignmentJustified = 3, // Fully-justified. The last line in a paragraph is natural-aligned.
NSTextAlignmentNatural = 4, // Indicates the default alignment for script
} NS_ENUM_AVAILABLE_IOS(6_0);
设置行的截取方式和文字的对齐方法类似,不过这次是进入到lineBreakMode枚举法中找到自己需要的方式
//2.5设置行的截取方式
aLabel.lineBreakMode = NSLineBreakByWordWrapping;
字体的设置就是将该字体的名字赋值即可:
//2.8.3修改字体样式和字体大小
aLabel.font = [UIFont fontWithName:@"Zapfino" size:14];
UITextField(输入框)
UITextField(文本输入框):是iOS中提供的用来显示文字和编辑文字的控件
核心功能:文字编辑
首先先创建一个文本框:
//1.创建输入框对象
UITextField *textField = [[UITextField alloc]initWithFrame:CGRectMake(30, 100, 300, 40)];
//2.配置相关属性
textField.backgroundColor = [UIColor yellowColor];
//3.添加到父视图
[self.window addSubview:textField];
//4.释放所有权
[textField release];
效果图:
新建文本框
这样就创建了一个简单的文本输入框,那么只有这么单调(蛋疼)的效果你会满意么??所以呢,我们需要对他进行一些相关配置:
功能1(vip):设置提示文字;
textField.placeholder = @"请输入...";
看图:
添加提示文字.png
这个由苹果公司给出的API作用是,如果当前的文本框没有输入内容的时候会显示一个由开发者设定的的文字或字符.
功能2(vip):设置框内的内容;
textField.text = @"我爱你们哟";
设置内容
很明显,当你设置有内容的时候,提示的内容会"消失",当你将内容删掉的时候,他会自动的"出现".这个功能相信大家都是不陌生的.比如QQ的登录界面,如果你登录之后,会自动保存账号信息,当你下次登录的时候会保留你上次登录的账号.相当多的登录界面都会采用这种方式来方便用户使用.
关于一些其他的比较常用的方法:
//2.3设置文字颜色
textField.textColor = [UIColor blueColor];
//2.4设置文字对齐方式
textField.textAlignment = NSTextAlignmentCenter;
//2.5设置字体大小
textField.font = [UIFont boldSystemFontOfSize:19];
//2.6当第一次选中输入框时,是否清除输入框的内容
textField.clearsOnBeginEditing = YES;
//2.7设置清除按钮模式
textField.clearButtonMode = UITextFieldViewModeWhileEditing;
//2.8设置输入框样式
textField.borderStyle = UITextBorderStyleRoundedRect;
//2.9设置输入框能否编辑 -- 关闭用户交换
textField.userInteractionEnabled = YES;
//2.10设置键盘类型
//textField.keyboardType = UIKeyboardTypeNumberPad;
//2.11设置键盘外观样式
textField.keyboardAppearance = UIKeyboardAppearanceDark;
//2.12设置输入框内容以安全模式显示
textField.secureTextEntry = YES;
textField.clearsOnBeginEditing的API
textField.userInteractionEnable的API
通过查阅API,我们可以了解到这两个API的返回值都是BOOL类型,那么我们可以将它理解为开关的意思.
功能3(vip):代理(检测输入框的各种行为)
textField.delegate = self;//代理制定为AppDelegate对象
在设置代理前我们要先接受代理协议
接受协议
那么既然接受了协议我们就要完成协议的内容
协议内容
注意标记,协议默认的关键字是@required表示必须完成的"条件",而@optional表示可以完成,也可不完成.
我们既然是学习那么我们最好都实现一下,以便更加了解协议内容和代理的实现
#pragma mark - UITextFieldDelegate
//输入框询问是否可以编辑. YES -- 可以编辑 NO -- 不能编辑
- (BOOL)textFieldShouldBeginEditing:(UITextField *)textField {
NSLog(@"%s", __FUNCTION__);//打印当前方法名
return YES;
}
//该方法被触发时,意味着输入框已经可以编辑,已经进入编辑状态
- (void)textFieldDidBeginEditing:(UITextField *)textField {
NSLog(@"%s", __FUNCTION__);//打印当前方法名
}
//输入框询问是否可以取消编辑状态 -- 键盘是否可以回收
- (BOOL)textFieldShouldEndEditing:(UITextField *)textField {
NSLog(@"%s", __FUNCTION__);//打印当前方法名
return YES;
}
//该方法被触发时,输入框已经结束编辑状态
- (void)textFieldDidEndEditing:(UITextField *)textField {
NSLog(@"%s", __FUNCTION__);//打印当前方法名
}
//当输入框内容发生变化时,就会触发,能够及时回去到输入框最新的内容
- (BOOL)textField:(UITextField *)textField shouldChangeCharactersInRange:(NSRange)range replacementString:(NSString *)string {
NSLog(@"%s", __FUNCTION__);//打印当前方法名
return YES;
}
//输入框询问是否可以清除内容
- (BOOL)textFieldShouldClear:(UITextField *)textField {
NSLog(@"%s",__FUNCTION__);//打印当前方法名
return YES;
}
//点击键盘右下角按钮触发,经常用来回收键盘,取消编辑状态
- (BOOL)textFieldShouldReturn:(UITextField *)textField {
//回收键盘
[textField resignFirstResponder];
NSLog(@"%s",__FUNCTION__);//打印当前方法名
return YES;
}
到次我们已经对UITextFiled初步的认知,剩下的就是看你自己了.
UIButton(按钮)
UIButton(按钮):是iOS中提供的用来相应用户交互的控件,可以显示文字,也可以显示图片.
核心功能:响应用户点击事件
使用Button需注意两点:
1.创建对象使用便利器构造方法,无需release
2.记得要制定按钮的frame
那么我们来创建一个按钮:
//1.创建按钮对象
UIButton *aButton = [UIButton buttonWithType:UIButtonTypeSystem];
//2.配置相关属性
aButton.backgroundColor = [UIColor blackColor];
aButton.frame = CGRectMake(30, 100, 300, 40);
//3.添加到父视图
[self.window addSubview:aButton];
按钮
是不是感觉和Label一样?别急撒客官继续看
//2.1设置按钮文字 -- 正常状态显示文字
[aButton setTitle:@"登陆" forState:UIControlStateNormal];//正常状态未点击
[aButton setTitle:@"你妹" forState:UIControlStateHighlighted];//高亮状态点击之后
//2.2 设置按钮文字颜色
[aButton setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];//正常状态文字颜色
[aButton setTitleColor:[UIColor redColor] forState:UIControlStateHighlighted];//高亮文字颜色
//2.3 给按钮添加响应事件 -- 对点击做出响应
//addTarget参数:指定事件的响应对象 self -- 是当前Appdelegate类的对象
//action参数:指定事件的响应方法 由target调用
//forControlEvents参数:指定事件的响应时间
[aButton addTarget:self action:@selector(handleAction:) forControlEvents:UIControlEventTouchUpInside];
//handleAction:方法可以有参数,但是最多只能有一个参数,而参数为点击的按钮对象
//当前Appdelegate对象调用该方法,处理按钮点击事件
-(void)handleAction:(UIButton *)sender {
//需求1.更改window的颜色 -- 灰色
//self.window.backgroundColor = [UIColor grayColor];
//需求2.随机背景颜色
sender.backgroundColor = [UIColor colorWithRed:arc4random() % 256 / 255.0 green:arc4random() % 256 / 255.0 blue:arc4random() % 256 / 255.0 alpha:1.0];}
是不是感觉不一样了??好好学习吧亲~~
到这里就完了?可能不~~还没练习就像跑??
任务
看题~
完成如下效果:
任务一
任务二
任务三
是不是觉得毫无难度?
那么下面呢~~
任务一加强
是不是也不算太难??那你错了哦~~看需求:
1、用UILabel、UITextField、UIButton替换UIView.
2、点击按钮键盘能够回收(提示点击按钮的时候键盘能回收,核心代码:[输入框 resignFirstResponder];)
3、UITextField设置占位字符串.
4、输入密码的UITextField，设置密文输入
5、默认指定一个正确的用户名和密码，点击登录按钮进行登录验证，并显示验证结果.提示：使用UIAlertView.
6、点击alertView的确认或取消时，回收键盘.
任务二加强
需求:
1、用UILabel、UITextField、UIButton替换UIView。
2、点击按钮键盘能够回收(提示点击按钮的时候键盘能回收,核心代码:[输入框 resignFirstResponder];)
3、UITextField设置占位字符串。
你猜对了~哦啦啦
任务三加强版
需求:
1、用UILabel、UITextField、UIButton替换UIView。
2、键盘能够回收,提示点击按钮的时候键盘能回收,核心代码:[输入框 resignFirstResponder];
3、密码和确认密码设置密文输入
4、手机号使用数字键盘
5、点击注册按钮，判断密码和确认密码输入的内容，如果不相同使用alertView进行提示。
6、点击注册按钮，判断用户名、密码、确认密码的内容，不能为空，如果为空使用alertVIew提示。
(注:个位小伙伴答案下集公布哦努力学习哦~)
网友评论