【UI初级连载四】--------UI常用控件_uirectfill uirectframe uibutton-优快云博客

【1】 UILabel -------------------------文本标签

【2】UIButton ------------------------按钮

UIControl ————————控件（按钮的父类）

【3】UITextField -------------------文本输入框

【4】UIImageView -------------------图像视图

【5】 UISlider ------------------------滑块

【6】 UISWitch ------------------------选择开关

【7】UIActivityIndicatorView-----风火轮

【8】UIPageControl------------------页面控制

【9】UIProgressView------------------进度条

【10】UIAlertView----------------提示框

【11】UIAlertController------提示框

【12】UIActionSheet------------提示框

【13】UISegmentedControl-------分段控件

一、UILabel

    //设置label
    [self _initLabel];

    //设置button
    [self _initButton];

#pragma mark -UILabel
- (void)_initLabel{
    //创建一个Label
    UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(50, 50, 200, 200)];
    label.backgroundColor = [UIColor cyanColor];
    //设置文本内容
    label.text = @"1234567890";
    //设置字体(系统字体)
    label.font = [UIFont systemFontOfSize:19];
    //（设为粗体）
    //    label.font = [UIFont boldSystemFontOfSize:19];

    //===== 字体类（UIFont） =================
//    NSArray *familyNames = [UIFont familyNames];
//    NSLog(@"familyNames is %@",familyNames);
//    label.font = [UIFont fontWithName:@"Papyrus" size:19];

    //设置字体颜色
    label.textColor = [UIColor redColor];

    //设置文本对齐方式
    label.textAlignment = NSTextAlignmentCenter;

    //设置当前显示行数----默认为1行，若设为0，则是自动换行
    label.numberOfLines = 0;

    //自动根据文本调整宽度和高度
    [label sizeToFit];
//    NSLog(@"label is %@",label);
//    //这样打印出来的label的宽高是自动调整后的宽高。

    [self.window addSubview:label];
}

二、UIButton

#pragma mark -UIButton

- (void)_initButton{
    //创建一个Button
    UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
    button.frame = CGRectMake(50, 300, 100, 40);
    button.backgroundColor = [UIColor whiteColor];

    //设置显示标题，（标题总是需要跟状态绑定到一起的）
    [button setTitle:@"Normal" forState:UIControlStateNormal];

    //设置高亮状态下的Title
    [button setTitle:@"Highlighted" forState:UIControlStateHighlighted];

    //设置选中状态下的Title
    [button setTitle:@"Selected" forState:UIControlStateSelected];

    //设置按钮是否选中
    button.selected = true;

    //设置标题的字体
    button.titleLabel.font = [UIFont boldSystemFontOfSize:20];

    //设置标题的颜色
    [button setTitleColor:[UIColor redColor] forState:UIControlStateNormal];
    [button setTitleColor:[UIColor cyanColor] forState:UIControlStateSelected];

    //===== 给button设置背景图片 ============================
    //获取图片-----imageNamed:在当前工程目录下找到名字为“ ”的图片, 如果图片是png格式的，可以不加.png，但还是建议添加上
    UIImage *image1 = [UIImage imageNamed:@"back_on_black.png"];
    UIImage *image2 = [UIImage imageNamed:@"back_on.png"];


    //设置背景图片-----图片会随着按钮的frame改变而拉伸
    [button setBackgroundImage:image1 forState:UIControlStateNormal];
    //设置高亮状态下的背景图片
    [button setBackgroundImage:image2 forState:UIControlStateHighlighted];

    //设置图片-----图片不会被拉伸--但是imageView上面不能显示Title
    [button setImage:image1 forState:UIControlStateNormal];
    [button setImage:image2 forState:UIControlStateHighlighted];

    //给按钮添加点击事件
    [button addTarget:self action:@selector(buttonClick:) forControlEvents:UIControlEventTouchUpInside];

    //设置titleLabel的偏移量
    [button setTitleEdgeInsets:UIEdgeInsetsMake(0, -50, 0, 0)];
    [button setImageEdgeInsets:UIEdgeInsetsMake(0, 20, 0, 0)];

    //设置按钮是否可用
    button.enabled = NO;
    //是否相应触摸时间
    button.userInteractionEnabled = NO;

    [self.window addSubview:button];
}

- (void)buttonClick:(UIButton *)btn
{
    NSLog(@"btnClick");
    //选中状态取反
//    btn.selected = !btn.selected;

}

三、 UITextField

#import "AppDelegate.h"

@interface AppDelegate ()<UITextFieldDelegate>

@end

@implementation AppDelegate

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
    // Override point for customization after application launch.

    //******* 创建window窗口 *********************
    //拿到屏幕的大小
    CGRect rect = [UIScreen mainScreen].bounds;
    //创建一个window
    self.window = [[UIWindow alloc]initWithFrame:rect];
    //设置窗口颜色
    self.window.backgroundColor = [UIColor whiteColor];
    //把当前的window作为程序的主window显示出来
    [self.window makeKeyAndVisible];

    [self _initTextField];


    return YES;
}
//文本输入框
- (void)_initTextField{
    //如果需要在模拟器中调用电脑的键盘使用快捷键： command+ shift+ k
    UITextField *textField = [[UITextField alloc]initWithFrame:CGRectMake(100, 100, 200, 30)];
    textField.tag = 100;
    //设置输入框的边框样式，默认无边框
    textField.borderStyle = UITextBorderStyleRoundedRect;
    //设置输入文字的字体
    textField.font = [UIFont boldSystemFontOfSize:19];
    //设置文字的颜色
    textField.textColor = [UIColor redColor];
    //设置或获取当前文本输入框的内容
//    textField.text = @"hhhhhhhhh";
    //设置文字对齐方式
    textField.textAlignment = NSTextAlignmentCenter;
    //设置首字母是否大小写
    textField.autocapitalizationType = UITextAutocapitalizationTypeWords;
    //设置自动单词提示
//    textField.autocorrectionType = UITextAutocorrectionTypeNo;

    //输入框为空时的提示文本
    textField.placeholder = @"请输入登陆邮箱";

    //修改键盘上的return按钮上的标题
    textField.returnKeyType = UIReturnKeyGo;

    //设置输入框是否安全输入
    textField.secureTextEntry = YES;

    //纯数字键盘
    textField.keyboardType = UIKeyboardTypeNumberPad;

    //开启清除键盘
    textField.clearButtonMode = UITextFieldViewModeWhileEditing;

//    //成为第一响应者
//    [textField becomeFirstResponder];
//
//    //失去第一响应者
//    [textField resignFirstResponder];

    //设置代理---//要在本文件的延展处加上代理协议：<UITextFieldDelegate>
    textField.delegate = self;

    [self.window addSubview:textField];

    //创建一个Button
    UIButton *button = [UIButton buttonWithType:UIButtonTypeContactAdd];
    button.frame = CGRectMake(50, 400, 100, 40);
    [button addTarget:self action:@selector(buttonClick:) forControlEvents:UIControlEventTouchUpInside];
    [self.window addSubview:button];
}

- (void)buttonClick:(UIButton *)button{
    UITextField *textField = (UITextField *)[self.window viewWithTag:100];
    //失去第一响应者
    [textField resignFirstResponder];
}

#pragma mark -UITextFieldDelegate
//将要开始编辑
- (BOOL)textFieldShouldBeginEditing:(UITextField *)textField
{
    NSLog(@"将要开始编辑");
    //返回YES表示可以继续编辑，返回NO是阻止编辑
    return YES;
}

//已经开始编辑了
- (void)textFieldDidBeginEditing:(UITextField *)textField
{
    NSLog(@"正在编辑");
}

//已经结束编辑
- (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;
}

@end

四、UIImageView

//图片视图（ImageWiew）
- (void)_initImageView{
    //创建图片对象
    UIImage *img = [UIImage imageNamed:@"scene1.jpg"];

    //创建ImageView
    UIImageView *imgView = [[UIImageView alloc]initWithFrame:CGRectMake(50, 100, 275, 200)];
    imgView.image = img;
    imgView.backgroundColor = [UIColor redColor];

//    //设置ImageView高亮状态下的图片
//    imgView.highlightedImage = [UIImage imageNamed:@"scene2.jpg"];
//    imgView.highlighted = YES;

    //设置内容模式
    /*
     三种常用的内容模式：
     UIViewContentModeScaleToFill, //横向和纵向都拉伸到边框
     UIViewContentModeScaleAspectFit, //等比例拉伸，当某一方向到头时，则不拉伸
     UIViewContentModeScaleAspectFill, //等比例拉伸，当某一方向到头时，则继续拉伸到另一方向也到头
     */
    imgView.contentMode = UIViewContentModeScaleAspectFit;

    //imageView设置动画图片组
    UIImage *img1 = [UIImage imageNamed:@"scene1.jpg"];
    UIImage *img2 = [UIImage imageNamed:@"scene2.jpg"];
    UIImage *img3 = [UIImage imageNamed:@"scene3.jpg"];
    UIImage *img4 = [UIImage imageNamed:@"scene4.jpg"];
    UIImage *img5 = [UIImage imageNamed:@"scene5.jpg"];

    NSArray *images = @[img1, img2, img3, img4, img5];

    //设置动画播放的集合
    imgView.animationImages = images;
    //设置动画播放的时间
    imgView.animationDuration = 5;
    //开始动画
    [imgView startAnimating];


    [self.window addSubview:imgView];

    UIButton *btn = [UIButton buttonWithType:UIButtonTypeContactAdd];
    btn.frame = CGRectMake(0, 50, 40, 40);
    [btn addTarget:self action:@selector(btnClick:) forControlEvents:UIControlEventTouchUpInside];
    //注意：imageView默认的触摸事件是关闭的
    imgView.userInteractionEnabled = YES;

    [imgView addSubview:btn];
}

- (void)btnClick:(UIButton *)btn
{
    NSLog(@"hehehe");

}

五、UISlider

#pragma mark -UISlider
//滑块
- (void)_initSlider{
    //slider显示的高度是固定的
    UISlider *slider = [[UISlider alloc] initWithFrame:CGRectMake(30, 100, 300, 20)];
//    slider.backgroundColor = [UIColor redColor];

    //设置滑块的最大值和最小值(默认范围为：0~1)
    slider.minimumValue = 0;
    slider.maximumValue = 100;

    //设置初始值
    slider.value = 50;

//    //设置滑动条左边|右边的颜色
//    [slider setMinimumTrackTintColor:[UIColor redColor]];
//    [slider setMaximumTrackTintColor:[UIColor purpleColor]];

    //设置滑动条的左右边的图片
    UIImage *image1 = [UIImage imageNamed:@"com_slider_min_l-Decoded"];
    UIImage *image2 = [UIImage imageNamed:@"com_slider_min_r-Decoded"];

//    //设置图片的拉伸点
//    //方法一：（左、高）
//    image1 = [image1 stretchableImageWithLeftCapWidth:5 topCapHeight:0];
//    image2 = [image2 stretchableImageWithLeftCapWidth:5 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 *image3 = [UIImage imageNamed:@"com_thumb_max_n-Decoded"];
    UIImage *image4 = [UIImage imageNamed:@"com_thumb_max_h-Decoded"];

    [slider setThumbImage:image3 forState:UIControlStateNormal];
    [slider setThumbImage:image4 forState:UIControlStateHighlighted];

    //设置滑块按钮的颜色----（只有先加载了滑块的图片，才能设置颜色）
    [slider setThumbTintColor:[UIColor redColor]];

    //添加事件
    [slider addTarget:self action:@selector(sliderAction:) forControlEvents:UIControlEventValueChanged];

    [self.window addSubview:slider];
}

- (void)sliderAction:(UISlider *)slider{
    NSLog(@"slider value is %.2f",slider.value);
}

六、UISwitch

#pragma mark -UISwitch
//开关
- (void)_initSwitch{
    UISwitch *switch1 = [[UISwitch alloc] initWithFrame:CGRectMake(100, 200, 20, 20)];

    //默认开
    switch1.on = YES;

    //添加事件
    [switch1 addTarget:self action:@selector(switchAction:) forControlEvents:UIControlEventValueChanged];


    [self.window addSubview:switch1];
}

- (void)switchAction:(UISwitch *)switch1{
    if (switch1.on) {
        NSLog(@"开启");
    }else{
        NSLog(@"关闭");
    }
}

七、UIActivityIndicatorView

//风火轮
- (void)_initUIActivityIndicatorView{
    UIActivityIndicatorView *activity = [[UIActivityIndicatorView alloc] initWithActivityIndicatorStyle:UIActivityIndicatorViewStyleWhiteLarge];
    activity.frame = CGRectMake(100, 100, 0, 0);
    activity.backgroundColor = [UIColor redColor];
    //开始转动
    [activity startAnimating];
    //停止转动并自动隐藏
//    [activity stopAnimating];

    [self.window addSubview:activity];
}

八、UIPageControl

//页面控制
- (void)_initUIPageControl{
    UIPageControl *pageControl = [[UIPageControl alloc] initWithFrame:CGRectMake(0, 200, 200, 40)];
    //设置总页数
    pageControl.numberOfPages = 5;
    //设置当前选中的页面的索引
    pageControl.currentPage = 2;

    //添加点击事件
    [pageControl addTarget:self action:@selector(pageControlAction:) forControlEvents:UIControlEventValueChanged];

    [self.window addSubview:pageControl];
}

- (void)pageControlAction:(UIPageControl *)pageControl{
    NSLog(@"currentCPage is %ld",pageControl.currentPage);
}

九、UIProgressView

//进度条
- (void)_initUIProgressView{
    UIProgressView *progressView = [[UIProgressView alloc] initWithProgressViewStyle:UIProgressViewStyleDefault];
    progressView.frame = CGRectMake(0, 300, 300, 10);
    //设置进度值（默认为0，默认范围：0~1---CGFloat型）
//    progressView.progress = 0.3;
    //设置已加载的进度条颜色
    progressView.progressTintColor = [UIColor redColor];
    //设置未加载的进度条颜色
    progressView.trackTintColor = [UIColor yellowColor];
    progressView.tag = 10;

    [NSTimer scheduledTimerWithTimeInterval:0.2
                                     target:self
                                   selector:@selector(timeAction:)
                                   userInfo:progressView
                                    repeats:YES];
    [self.window addSubview:progressView];
}
- (void)timeAction:(NSTimer *)timer{
    //若没传userInfo:
//    UIProgressView *pro = (UIProgressView *)[self.window viewWithTag:10];
    //传了userInfo:
    UIProgressView *pro = timer.userInfo;

    pro.progress += 0.1;
    if (pro.progress >= 1) {
        [timer invalidate];
    }

}

十、UIAlertView

//创建一个视图控制器
    ViewController *VC = [[ViewController alloc] init];

    //根视图控制器

self.window.rootViewController = VC;

//以后的代码可以在ViewController文件中写

//这是为了弹出模态视图可以用

#pragma mark -UIAlertView
- (void)_initUIAlertView{
    //先建一个button，点击button，弹出UIAlertView
    UIButton *btn = [UIButton buttonWithType:UIButtonTypeContactAdd];
    btn.frame = CGRectMake(100, 100, 50, 50);
    [btn addTarget:self action:@selector(showAlertView) forControlEvents:UIControlEventTouchUpInside];
    [self.view addSubview:btn];
}

- (void)showAlertView{
    //这样设置的title的索引：（0~3分别为：取消、确定、1、2）
    UIAlertView *alterView = [[UIAlertView alloc] initWithTitle:@"警告"
                                                        message:@"密码输入错误"
                                                       delegate:self
                                              cancelButtonTitle:@"取消"
                                              otherButtonTitles:@"确定",@"1",@"2", nil];

    //设置alertView的样式
    /*
     typedef NS_ENUM(NSInteger, UIAlertViewStyle) {
     UIAlertViewStyleDefault = 0,
     UIAlertViewStyleSecureTextInput, //默认带了一个输入密码用的textField
     UIAlertViewStylePlainTextInput,    //默认带了一个明文的textField
     UIAlertViewStyleLoginAndPasswordInput //默认带了两个textField，用来输入用户名和密码
     };
     */
    //

    alterView.alertViewStyle = UIAlertViewStyleLoginAndPasswordInput;
    //显示alterView
    [alterView show];
}

#pragma mark -UIAlertViewDelegate
- (void)alertView:(UIAlertView *)alertView clickedButtonAtIndex:(NSInteger)buttonIndex
{

    UITextField *tf1 = [alertView textFieldAtIndex:0];
    UITextField *tf2 = [alertView textFieldAtIndex:1];

    NSLog(@"buttonIndex is %ld", buttonIndex);
    if (buttonIndex == 0) {
        NSLog(@"取消");
    }else if (buttonIndex == 1) {
        NSLog(@"确定");
        NSLog(@"tf1 is %@, tf2 is %@", tf1.text, tf2.text);
    }
}

十一、UIAlertController

#pragma mark -UIAlertController
- (void)_initUIAlertController{
    //先建一个button，点击button，弹出UIAlertView
    UIButton *btn = [UIButton buttonWithType:UIButtonTypeInfoDark];
    btn.frame = CGRectMake(200, 100, 50, 50);
    [btn addTarget:self action:@selector(showAlertController) forControlEvents:UIControlEventTouchUpInside];
    [self.view addSubview:btn];
}

- (void)showAlertController{
    //UIAlertController代替了AlertView和ActionSheet
    UIAlertController *alertControl = [UIAlertController alertControllerWithTitle:@"警告"
                                                                          message:@"密码错误" preferredStyle:UIAlertControllerStyleAlert];

//添加一个文本框

//注意：只有UIAlertControllerStyleAlert样式才能添加文本框

    [alertControl addTextFieldWithConfigurationHandler:^(UITextField *textField) {
        //给textField添加自己想要的属性
        textField.secureTextEntry = YES;
        textField.textAlignment = NSTextAlignmentCenter;
        textField.placeholder = @"请输入密码";
        textField.keyboardType = UIKeyboardTypeNumberPad;
    }];

    //创建一个action
    UIAlertAction *cancelAction = [UIAlertAction actionWithTitle:@"取消" style:UIAlertActionStyleDestructive handler:^(UIAlertAction *action) {
        //点击之后需要做哪些事情
        NSLog(@"取消");
    }];

    UIAlertAction *sureAction = [UIAlertAction actionWithTitle:@"确定" style:UIAlertActionStyleDefault handler:^(UIAlertAction *action) {
        //点击之后需要做哪些事情

        UITextField *textField = [[alertControl textFields] lastObject];
        NSLog(@"%@", textField.text);
    }];

    //添加一个action
    [alertControl addAction:cancelAction];
    [alertControl addAction:sureAction];

    //弹出一个模态视图
    [self presentViewController:alertControl animated:true completion:nil];
}

十二、UIActionSheet

#pragma mark -UIActionSheet
- (void)_initActionSheet
{
    UIButton *btn = [UIButton buttonWithType:UIButtonTypeInfoDark];
    btn.frame = CGRectMake(200, 100, 50, 50);
    [btn addTarget:self action:@selector(showActionSheet) forControlEvents:UIControlEventTouchUpInside];
    [self.view addSubview:btn];

}

- (void)showActionSheet

{

//这样设置的title的索引：（0~3分别为：确定、1、2、取消）

    UIActionSheet *actionSheet = [[UIActionSheet alloc] initWithTitle:@"提示" delegate:self cancelButtonTitle:@"取消" destructiveButtonTitle:@"确定" otherButtonTitles:@"按钮1", @"按钮2", nil];
    [actionSheet showInView:self.view];
}

#pragma mark -UIActionSheetDelegate
- (void)actionSheet:(UIActionSheet *)actionSheet clickedButtonAtIndex:(NSInteger)buttonIndex
{
    NSLog(@"buttonIndex is %ld", buttonIndex);

}

十三、UISegmentedControl

#pragma mark -UISegmentedControl
//分段控件
- (void)_initSegmentControl
{
    // 设置按钮的标题数组
    NSArray *array = [NSArray arrayWithObjects:@"选择",@"搜索",@"工具", nil];
    // 创建分段控件
    UISegmentedControl *segmentCtrl = [[UISegmentedControl alloc] initWithItems:array];
    segmentCtrl.frame = CGRectMake(20, 30, 150, 25);
    //设置样式—ios7后弃用
    segmentCtrl.segmentedControlStyle = UISegmentedControlStyleBar;
    // 设置默认选中按钮
    segmentCtrl.selectedSegmentIndex = 0;
    [segmentCtrl addTarget:self action:@selector(segmentAction:) forControlEvents:UIControlEventValueChanged];
    [self.view addSubview:segmentCtrl];

}