iOS UI初级-常用UI控件

控件都是继承UIControl控件
1.Lable控件



2.Button控件





点击按钮



3.TextFiled文本框
//创建一个TextFiled

UITextField *textFiled = [[UITextField
alloc]
initWithFrame:CGRectMake(100,
50,
200,
40)];

//设置输入框的边距样式

textFiled.borderStyle
=
UITextBorderStyleRoundedRect;

//设置输入框的字体

textFiled.font
= [UIFont
boldSystemFontOfSize:16];

//设置输入文字的颜色

textFiled.textColor
= [UIColor
grayColor];

//设置或者获取文本框的内容

// textFiled.text = @"你好";

//设置对齐方式

textFiled.textAlignment
=
NSTextAlignmentCenter;

//设置字母是否自动大写

textFiled.autocapitalizationType
=
UITextAutocapitalizationTypeWords;

//设置单词提示

// textFiled.autocorrectionType = UITextAutocorrectionTypeNo;

//输入框为空时提示文本

textFiled.placeholder
=
@"请输入用户名";

//修改键盘上的return按钮标题

textFiled.returnKeyType
=
UIReturnKeyGo;

//设置是否安全输入

textFiled.secureTextEntry
=
YES;

//纯数字键盘

// textFiled.keyboardType = UIKeyboardTypeNumberPad;

//开启清除按钮

textFiled.clearButtonMode
=
UITextFieldViewModeWhileEditing;

//成为第一个响应者，弹出键盘

[textFiled
becomeFirstResponder];

//失去第一个响应者

// [textFiled resignFirstResponder];

//设置代理

textFiled.delegate
=
self;

代理协议中的办法

//将要开始编辑

- (BOOL)textFieldShouldBeginEditing:(UITextField
*)textField

{

NSLog(@"将要开始编辑");

return
YES;

}

//已经开始编辑

- (void)textFieldDidBeginEditing:(UITextField
*)textField

{

NSLog(@"已经开始编辑");

}

//将要结束编辑

- (BOOL)textFieldShouldEndEditing:(UITextField
*)textField

{

NSLog(@"将要结束编辑");

return
YES;

}

//已经结束编辑

- (void)textFieldDidEndEditing:(UITextField
*)textField;

{

NSLog(@"已经结束编辑");

}

//输入框内容被修改的时候调用协议方法-----重要

- (BOOL)textField:(UITextField
*)textField shouldChangeCharactersInRange:(NSRange)range replacementString:(NSString
*)string

{

NSString *lastStr = textField.text;

NSString *rangeStr =
NSStringFromRange(range);

NSString *replaceStr = string;

NSLog(@"lastStr is %@", lastStr);

NSLog(@"rangeStr is %@", rangeStr);

NSLog(@"replaceStr is %@", replaceStr);

return
YES;

}

4.ImageView

//创建图像

UIImage *image = [UIImage
imageNamed:@"scene1.jpg"];

//设置Image图片

UIImageView *imageView = [[UIImageView
alloc]
initWithFrame:CGRectMake(100,
100,
200,
200)];

imageView.image
= image;

//设置高亮状态下的图片

imageView.highlightedImage
= [UIImage
imageNamed:@"scence3.jpg"];

imageView.highlighted
=
YES;

//设置内容模式

//横向和纵向都拉伸到边框

imageView.contentMode
=
UIViewContentModeScaleToFill;

//等比例拉伸，当某一方向拉伸到达时，则不拉伸

imageView.contentMode
=
UIViewContentModeScaleAspectFit;

//等比例拉伸，当某一方向到达时，则继续拉伸到另一方向也到头

imageView.contentMode
=
UIViewContentModeScaleAspectFill;

//imageView设置动画图片组

//先创建一个数组装入图片

UIImage *image1 = [UIImage
imageNamed:@"scene1.jpg"];

UIImage *image2 = [UIImage
imageNamed:@"scene2.jpg"];

UIImage *image3 = [UIImage
imageNamed:@"scene3.jpg"];

UIImage *image4 = [UIImage
imageNamed:@"scene4.jpg"];

UIImage *image5 = [UIImage
imageNamed:@"scene5.jpg"];

NSArray *imArr =
@[image1, image2, image3, image4, image5];

//设置动画的播放集合

imageView.animationImages
= imArr;

//设置动画播放的时间

imageView.animationDuration
=
5;

//开始动画

[imageView
startAnimating];

[self.window
addSubview:imageView];

//注意：imageView的触摸事件是关闭的

UIButton *bnt = [UIButton
buttonWithType:UIButtonTypeContactAdd];

bnt.frame
=
CGRectMake(150,
150,
40,
40);

[bnt
addTarget:self
action:@selector(bntClick)
forControlEvents:UIControlEventTouchUpInside];

[self.window
addSubview:bnt];
bnt.userInteractionEnabled =
YES;

5.UIslider 滑块
//UISlider滑块的高度是固定的

UISlider *slider = [[UISlider
alloc]
initWithFrame:CGRectMake(50,
200,
300,
100)];

//设置滑动的最大值和最小值

slider.maximumValue
=
100;

slider.minimumValue
=
0;

//设置初始值

slider.value
=
50;

//设置滑动条左边|右边的颜色

// [slider setMaximumTrackTintColor:[UIColor redColor]];

// [slider setMinimumTrackTintColor:[UIColor blueColor]];

//设置滚动条的左右边的图片

UIImage *image1 = [UIImage
imageNamed:@"com_slider_max_l-Decoded.png"];

UIImage *image2 = [UIImage
imageNamed:@"com_slider_max_r-Decoded.png"];

//设置图片的拉伸点

// image1 = [image1 stretchableImageWithLeftCapWidth:5 topCapHeight:0];

// image2 = [image2 stretchableImageWithLeftCapWidth:4 topCapHeight:0];

image1 = [image1
resizableImageWithCapInsets:UIEdgeInsetsMake(0,
5,
0,
5)];

image2 = [image2
resizableImageWithCapInsets:UIEdgeInsetsMake(0,
5,
0,
5)];

[slider
setMinimumTrackImage:image1
forState:UIControlStateNormal];

[slider
setMaximumTrackImage:image2
forState:UIControlStateNormal];

//设置滑块的图片

UIImage *image = [UIImage
imageNamed:@"com_thumb_max_n-Decoded"];

[slider
setThumbImage:image
forState:UIControlStateNormal];

UIImage *image0 = [UIImage
imageNamed:@"com_thumb_max_h-Decoded"];
[slider
setThumbImage:image0 forState:UIControlStateHighlighted];

//添加事件

[slider
addTarget:self
action:@selector(sliderAction:)
forControlEvents:UIControlEventValueChanged];

[self.window
addSubview:slider];

6.开关

UISwitch *switchUI = [[UISwitch
alloc]
initWithFrame:CGRectMake(50,
100,
100,
100)];

[self.window
addSubview:switchUI];

//默认开

switchUI.on
=
YES;

//添加事件

[switchUI
addTarget:self
action:@selector(switchAction:)
forControlEvents:UIControlEventValueChanged];

}

- (void)switchAction:(UISwitch
*)switchU

{

if (switchU.on) {

NSLog(@"开启");

}else{

NSLog(@"关闭");

}
}

7.风火轮
- (void)_initUIActivityIndicatorView

{

//初始化风火轮，并将其状态改成白色大的

UIActivityIndicatorView *activityView = [[UIActivityIndicatorView
alloc]
initWithActivityIndicatorStyle:UIActivityIndicatorViewStyleGray];

//改变风火轮的坐标
长宽都可以为0
，如果不为0，则会改变坐标，因为默认居中

activityView.frame
=
CGRectMake(100,
100,
0,
0);

//开始转动

[activityView
startAnimating];

//停止转动
自动隐藏

// [activityView stopAnimating];
[self.window
addSubview:activityView];

8.页面加载器
//页面加载器

- (void)_initUIPageControl

{

//初始化页面加载器

UIPageControl *pageCon = [[UIPageControl
alloc]
initWithFrame:CGRectMake(200,
200,
100,
20)];

//设置背景颜色

pageCon.backgroundColor
= [UIColor
grayColor];

//设置总的页数

pageCon.numberOfPages
=
5;

//设置当前页数
下标
点击左边，或右边，白点会动

pageCon.currentPage
=
2;

//添加点击事件

[pageCon
addTarget:self
action:@selector(pageConClick:)
forControlEvents:UIControlEventValueChanged];

[self.window
addSubview:pageCon];
}
- (void)pageConClick:(UIPageControl
*)pageCon

{

//打印出当前的页数

NSLog(@"%ld", pageCon.currentPage);
}

9.进度条
//进度条

- (void)_initUIProgressView

{

//初始化进度条，继承的是UIView

UIProgressView *progressView = [[UIProgressView
alloc]
initWithProgressViewStyle:UIProgressViewStyleDefault];

//高度可以设成0
背景颜色也无效

progressView.frame
=
CGRectMake(100,
300,
200,
0);

//设置进度值
范围是0~1

progressView.progress
=
0;

//设置已经加载的进度条的颜色

progressView.progressTintColor
= [UIColor
redColor];

//设置未加载的进度条的颜色

progressView.trackTintColor
= [UIColor
blueColor];

[self.window
addSubview:progressView];

//让进度条走动

[NSTimer
scheduledTimerWithTimeInterval:0.2

target:self

selector:@selector(progressViewAction:)

userInfo:progressView

repeats:YES];

}
- (void)progressViewAction:(NSTimer
*)timer

{

// UIProgressView *progerssView = [[UIProgressView alloc] initWithProgressViewStyle:UIProgressViewStyleDefault];

UIProgressView *progerssView = timer.userInfo;

progerssView.progress
+=
0.1;

if (progerssView.progress
>=
1) {

[timer
invalidate];

NSLog(@"OK!");

}
}
10.提示框AlertView
//定义一个提示框

UIAlertView *alertView = [[UIAlertView
alloc]
initWithTitle:@"警告"

message:@"这是提示框"

delegate:self

cancelButtonTitle:@"取消"

otherButtonTitles:@"确定",
nil];

//
设置alterView样式
alterViewStyle

//
默认带两个输入框的

// alertView.alertViewStyle = UIAlertViewStyleLoginAndPasswordInput;

//
默认带一个输入框的

// alertView.alertViewStyle = UIAlertViewStylePlainTextInput;

//
默认带一个密码输入框

// alertView.alertViewStyle = UIAlertViewStyleSecureTextInput;

//
默认

// alertView.alertViewStyle = UIAlertViewStyleDefault;

// [alertView show];

// UIAlertController代替了AlertView和ActionSheet

//类方法创建

UIAlertController *alterControl = [UIAlertController
alertControllerWithTitle:@"警告"

message:@"这是提示栏"

preferredStyle:UIAlertControllerStyleAlert];

//添加一个文本框
注意：只有AlertControllertStyleAlert才能添加文本框

[alterControl
addTextFieldWithConfigurationHandler:^(UITextField
*textField) {

//设置文本框的内容
添加一些属性

textField.secureTextEntry
=
YES;//安全输入

textField.textAlignment
=
NSTextAlignmentCenter;//对齐方式

textField.placeholder
=
@"请输入密码";//提示内容

textField.keyboardType
=
UIKeyboardTypeNumberPad;//只让输入数字

}];

//创建action
取消按钮

UIAlertAction *cancelAction = [UIAlertAction
actionWithTitle:@"取消"
style:UIAlertActionStyleCancel
handler:^(UIAlertAction
*action) {

NSLog(@"取消");

}];

//再创建一个action
确定按钮

UIAlertAction *enterAction = [UIAlertAction
actionWithTitle:@"确定"
style:UIAlertActionStyleDestructive
handler:^(UIAlertAction
*action) {

NSLog(@"确定");

}];

//添加action

[alterControl
addAction:cancelAction];

[alterControl
addAction:enterAction];

//弹出一个模态视图（因为是control，不是视图，所以不能show）

[self
presentViewController:alterControl
animated:YES
completion:nil];

11.提示框
Sheet

//从下边出来的提示框

// UIActionSheet *actionSheet = [[UIActionSheet alloc] initWithTitle:@"提示"

// delegate:self

// cancelButtonTitle:@"取消"

// destructiveButtonTitle:@"确定"
otherButtonTitles:@"按钮1", nil];

// [actionSheet showInView:actionSheet];

//用UIAlertController替换后的UIActionSheet

UIAlertController *alterSheet = [UIAlertController
alertControllerWithTitle:@"提示"

message:@"这是提示框"

preferredStyle:UIAlertControllerStyleActionSheet];

//取消按钮

UIAlertAction *cancelAction = [UIAlertAction
actionWithTitle:@"取消"
style:UIAlertActionStyleCancel
handler:^(UIAlertAction
*action) {

NSLog(@"取消");}];

//确定按钮

UIAlertAction *enterAction = [UIAlertAction
actionWithTitle:@"确定"
style:UIAlertActionStyleDestructive
handler:^(UIAlertAction
*action) {

NSLog(@"确定");

}];

//其他按钮

UIAlertAction *otherActon = [UIAlertAction
actionWithTitle:@"其他"
style:UIAlertActionStyleDefault
handler:^(UIAlertAction
*action) {

NSLog(@"其他");

}];

[alterSheet
addAction:cancelAction];

[alterSheet
addAction:enterAction];

[alterSheet
addAction:otherActon];

//弹出一个模态视图
[self
presentViewController:alterSheet
animated:YES
completion:nil];
//用以前的方式可以调用此方法
- (void)actionSheet:(UIActionSheet
*)actionSheet clickedButtonAtIndex:(NSInteger)buttonIndex

{

//下标顺序是从上到下一次增加的

NSLog(@"%ld", buttonIndex);
}

12、分段控件
//分段控件

- (void)_initSementControl

{

//设置按钮标题数组

NSArray *arr = [NSArray
arrayWithObjects:@"选择",
@"工具",
@"帮助",
nil];

//创建分段控件

UISegmentedControl *segmentedCon = [[UISegmentedControl
alloc]
initWithItems:arr];

segmentedCon.frame
=
CGRectMake(100,
250,
200,
50);

//设置样式

segmentedCon.segmentedControlStyle
=
UISegmentedControlStyleBar;

//默认选中的按钮

segmentedCon.selectedSegmentIndex
=
0;

//点击触发事件
[segmentedCon
addTarget:self
action:@selector(segmentedAction:)
forControlEvents:
UIControlEventValueChanged];
[self.view
addSubview:segmentedCon];

}

- (void)segmentedAction:(UISegmentedControl
*)segmentedCon

{

NSLog(@"当前的页数,%ld",
segmentedCon.selectedSegmentIndex);

}