【 UI 】

山河丘壑

已于 2023-06-28 15:45:05 修改

阅读量281

点赞数

分类专栏： iOS 文章标签： ui ios

于 2022-10-12 23:37:39 首次发布

本文链接：https://blog.csdn.net/weixin_61196797/article/details/127027489

版权

iOS 专栏收录该内容

41 篇文章 1 订阅

订阅专栏

文章目录

前言
UILabel
UIButton
UIView
- UIView的基础概念
- UIView的层级关系
UIWindow
UIViewController
定时器
UISwitch
UISlider和UIProgressview

前言

之前学习了UI的一些内容，做个小小回顾吧本篇慢慢更新

UILabel

UILabel是一种可以显示在屏幕上并能显示需要出现的文字的一种UI控件

	//UILabel的创建
    UILabel* label = [[UILabel alloc] init];
    //设置label的标签文字
    label.text = @"UILabel";
    //设置标签的位置
    //四个参数分别是label的x，y值和长度宽度
    label.frame = CGRectMake(20, 20, 100, 30);
    //设置label的背景颜色
    label.backgroundColor = [UIColor orangeColor];
    //设置label的字体大小
    label.font = [UIFont systemFontOfSize:14];
    //设置label的文字颜色
    label.textColor = [UIColor greenColor];
    //设置label的阴影颜色
    label.shadowColor = [UIColor grayColor];
    //设置label的偏移位置
    label.shadowOffset = CGSizeMake(20, 20);
    //设置label的text对齐:居中对齐
    label.textAlignment = NSTextAlignmentCenter;
    //设置label的text对齐：靠左对齐
    label.textAlignment = NSTextAlignmentLeft;
    //设置label的text对齐：靠右对齐
    label.textAlignment = NSTextAlignmentRight;
    //设置label的text的行数
    label.numberOfLines = 2;
    //将label添加到屏幕上
    [self.view addSubview:label];

设置效果：
在这里插入图片描述

UIButton

这里是引用

文字类型的button

	//UIButton的创建
    //注意Button的创建方法是一个类方法
    //有四种风格
    //圆角风格UIButtonTypeRoundedRect
    UIButton* button = [UIButton buttonWithType:UIButtonTypeClose];
    //设置button的位置
    button.frame = CGRectMake(100, 50, 150, 50);
    //设置button的文字名称
    //UIControlStateNormal表示在按钮没有被按下时的显示内容
    [button setTitle:@"按钮没有被按下!" forState:UIControlStateNormal];
    //UIControlStateHighlighted表示按钮被按下时显示的内容
    [button setTitle:@"按钮已经被按下！" forState:UIControlStateHighlighted];
    //设置button的背景颜色
    button.backgroundColor = [UIColor grayColor];
    //设置button的文字颜色
    //UIControlStateNormal表示按钮未被按下
    [button setTitleColor:[UIColor redColor] forState:UIControlStateNormal];
    //UIControlStateHighlighted表示按钮被按下
    [button setTitleColor:[UIColor grayColor] forState:UIControlStateHighlighted];
    //设置按钮风格颜色
    [button setTintColor:[UIColor blueColor]];
    //设置button的文字大小
    button.titleLabel.font = [UIFont systemFontOfSize:20];
    //将button添加到视图上
    [self.view addSubview:button];

在这里插入图片描述

图片类型的button



    //button的创建和上边普通类型的button相同
    UIButton* button = [UIButton buttonWithType:UIButtonTypeRoundedRect];
    //定义两个要添加的图片
    UIImage* image1 = [UIImage imageNamed:@"关闭.png"];
    UIImage* image2 = [UIImage imageNamed:@"打开.png"];
    //和上边相同UIControlStateNormal表示按钮未被按下时button所显示的图片
    //UIControlStateHighlighted表示button被按下时显示的图片
    [button setImage:image1 forState:UIControlStateNormal];
    [button setImage:image2 forState:UIControlStateHighlighted];
    //设置button的位置和大小
    button.frame = CGRectMake(50, 100, 50, 50);
    //将button添加到视图上
    [self.view addSubview:button];

在这里插入图片描述

UIButton的事件处理

- (void)pressButton{
    NSLog(@"TouchUpInside");
}
- (void)downButton{
    NSLog(@"TouchDown");
}
	//button的创建和上边普通类型的button相同
    UIButton* button = [UIButton buttonWithType:UIButtonTypeRoundedRect];
    //定义两个要添加的图片
    UIImage* image1 = [UIImage imageNamed:@"关闭.png"];
    UIImage* image2 = [UIImage imageNamed:@"打开.png"];
    //和上边相同UIControlStateNormal表示按钮未被按下时button所显示的图片
    //UIControlStateHighlighted表示button被按下时显示的图片
    [button setImage:image1 forState:UIControlStateNormal];
    [button setImage:image2 forState:UIControlStateHighlighted];
    //设置button的位置和大小
    button.frame = CGRectMake(50, 100, 50, 50);
    
    
    //给button添加点击事件函数
    //self表示这个事件函数是给button自己添加
    //当点击button时，调用函数pressbutton
    //函数可以带参
    //UIControlEventTouchUpInside表示点击后手指从屏幕上松开的一瞬间并且此时手指在按钮范围内的一个状态
    //UIControlEventTouchDoew表示手指触碰到屏幕上
    //UIControlEventTouchUpOutside表示手指从屏幕上松开的一瞬间并且此时手指不在按钮范围内的一个状态
    [button addTarget:self action:@selector(pressButton) forControlEvents:UIControlEventTouchUpInside];
    //一个按钮可以给按钮的不同状态添加不同的相应函数
    [button addTarget:self action:@selector(downButton) forControlEvents:UIControlEventTouchDown];
    //设置按钮的标识值
    //标识值可以区分不同按钮使用同一函数时是哪个按钮调用了函数
    button.tag = 101;
    //将button添加到视图上
    [self.view addSubview:button];

UIView

UIView的基础概念

UIView是iOS中的视图对象
是显示在屏幕上所有内容的基础类
所有屏幕上的对象都一定继承于UIView。屏幕上所有能看到的控件都是UIView的子类
UIView是一个视图对象，有背景颜色，有层级关系


    //UIView的创建
    UIView* view = [[UIView alloc] init];
    //view的位置
    //四个参数不多解释
    view.frame = CGRectMake(100, 100, 100, 100);
    //设置view的背景颜色
    view.backgroundColor = [UIColor grayColor];
    //是否隐藏视图对象
    //YES：不显示
    //NO：显示
    view.hidden = YES;
    //设置view的透明度
    //alpha = 1:不透明
    //alpha = 0.5:半透明
    //alpha = 0：透明
    view.alpha = 1;
    //设置是否显示不透明
    view.opaque = NO;
    //将view作为父视图的子视图管理起来
    [self.view addSubview:view];
    //将自己从父视图中删除
    [view removeFromSuperview];

在这里插入图片描述

UIView的层级关系

我们将三个视图都添加到父视图上，哪一个先被添加，就先绘制哪一个视图
哪一个视图被最后添加到父视图上，就最后绘制哪一个视图
子视图的位置是根据父视图确定的
子视图会根据父视图的移动移动
当父视图移动时，所有的子视图都会移动


    //view的创建和初始化不再多说
    UIView* view1 = [[UIView alloc] init];
    view1.backgroundColor = [UIColor blueColor];
    view1.frame = CGRectMake(100, 100, 150, 150);
    [self.view addSubview:view1];
    
    UIView* view2 = [[UIView alloc] init];
    view2.frame = CGRectMake(125, 125, 150, 150);
    view2.backgroundColor = [UIColor redColor];
    [self.view addSubview:view2];
    
    
    UIView* view3 = [[UIView alloc] init];
    view3.frame = CGRectMake(150, 150, 150, 150);
    view3.backgroundColor = [UIColor orangeColor];
    [self.view addSubview:view3];


    //将某一个视图放在最前面
    [self.view bringSubviewToFront:view3];
    //将某一个视图调整到最后面
    [self.view sendSubviewToBack:view1];
    //subviews管理所有self.view的子视图的数组
    UIView* viewFront = self.view.subviews[0];
    UIView* viewBack = self.view.subviews[1];

在这里插入图片描述

UIWindow

整个项目中只有一个UIWindow对象
表示整个屏幕窗口
UIWindow也是继承于UIView
是一个特殊的UIView
每一个view都有一个window属性，但是所有的window都是指self.window

//  SceneDelegate.m
//  UI复习
//
//

#import "SceneDelegate.h"

@interface SceneDelegate ()

@end

@implementation SceneDelegate


- (void)scene:(UIScene *)scene willConnectToSession:(UISceneSession *)session options:(UISceneConnectionOptions *)connectionOptions {
    //UIWindow的创建
    self.window = [[UIWindow alloc] initWithWindowScene:(UIWindowScene*)scene];
    //创建一个视图管理器作为UIWindow的根视图管理器
    self.window.rootViewController = [[UIViewController alloc] init];
    //修改UIWindow的背景颜色
    self.window.backgroundColor = [UIColor grayColor];
    //在window上添加view
    UIView* view1 = [[UIView alloc] init];
    view1.backgroundColor = [UIColor blueColor];
    view1.frame = CGRectMake(100, 100, 100, 100);
    //将视图添加到window上
    [self.window addSubview:view1];
    //将backView作为view1的子视图
    UIView* backView = [[UIView alloc] init];
    backView.frame = CGRectMake(100, 50, 300, 200);
    backView.backgroundColor = [UIColor greenColor];
    [backView addSubview:view1];
    [self.window addSubview:backView];
    //使视图有效
    [self.window makeKeyWindow];
    // Use this method to optionally configure and attach the UIWindow `window` to the provided UIWindowScene `scene`.
    // If using a storyboard, the `window` property will automatically be initialized and attached to the scene.
    // This delegate does not imply the connecting scene or session are new (see `application:configurationForConnectingSceneSession` instead).
}

在这里插入图片描述

UIViewController

所有的控制器都要自定义来完成
继承于官方的UIViewController
当视图控制器第一次加载视图时，调用函数viewDidload、布局初始化视图来使用。初始化资源使用

//  SceneDelegate.m
//  UI复习
//
//

#import "SceneDelegate.h"

@interface SceneDelegate ()

@end

@implementation SceneDelegate


- (void)scene:(UIScene *)scene willConnectToSession:(UISceneSession *)session options:(UISceneConnectionOptions *)connectionOptions {
    //UIWindow的创建
    self.window = [[UIWindow alloc] initWithWindowScene:(UIWindowScene*)scene];
    //创建视图控制器对象
    UIViewController* vc1 = [[UIViewController alloc] init];
    //对窗口的根视图控制器进行赋值操作
    //整个UIKit框架中只有一个根视图控制器，是window的属性
    //跟视图控制器用来管理界面和处理界面的逻辑
    //程序启动前必须对根视图控制器赋值
    self.window.rootViewController = vc1;
    //将window作为主视图并显示出来
    [self.window makeKeyAndVisible];
}



//  ViewController.m
//  UI复习
//
//

#import "ViewController.h"

@interface ViewController ()

@end

@implementation ViewController

//- (void)pressButton{
//    NSLog(@"TouchUpInside");
//}
//- (void)downButton{
//    NSLog(@"TouchDown");
//}
//当系统内存过低时会调用此函数，发出警告
- (void)didReceiveMemoryWarning{
    NSLog(@"ReceiveMemoryWarning");
}
- (void)viewDidLoad {
    //调用父类的加载视图函数
    [super viewDidLoad];
    UIView* view = [[UIView alloc] init];
    view.frame = CGRectMake(100, 100, 100, 100);
    [self.view addSubview:view];
    view.backgroundColor = [UIColor grayColor];
    self.view.backgroundColor = [UIColor orangeColor];
}

这里是UIViewController的一些高级内容

定时器

定时器对象可以在每隔固定时间发送一个消息
通过此消息来调用相应函数
通过此函数可以在每隔相同时间发送一个任务


    //定义一个定时器对象
    NSTimer* timer = [[NSTimer alloc] init];
    //第一个参数1是指多久调用一次定时器函数
    //第二个参数self是指给谁设置函数
    //第三个参数是指每隔所需时间后调用的定时器函数
    //第四个参数是传入定时器函数的一个参数，无参可以传nil
    //第五个参数是定时器是否重复。YES是重复调用，NO是只调用一次
    //返回值为一个新建好的定时器对象
    timer = [NSTimer scheduledTimerWithTimeInterval:1 target:self selector:@selector(timer) userInfo:nil repeats:NO];
    //停止定时器,使定时器失效
    [timer invalidate];

UISwitch

开关类型的控件。继承于UIView


- (void)openSwitch{
    self.view.backgroundColor = [UIColor grayColor];
}
//定义一个UISwitch控件
    UISwitch* myswitch = [[UISwitch alloc] init];
    //设置开关的位置
    //苹果官方的开关控件
    //x，y可以改变
    //宽、高不能改变
    myswitch.frame = CGRectMake(100, 100, 80, 40);
    //设置开关的状态
    myswitch.on = YES;
    //也可以使用下列代码来设置开关状态
    [myswitch setOn:YES];
    //参数二是指是否开启动画
    [myswitch setOn:YES animated:YES];
    //设置开关的背景颜色
    myswitch.backgroundColor = [UIColor orangeColor];
    //设置开关的不同状态颜色
    //开启状态
    [myswitch setOnTintColor:[UIColor blueColor]];
    //设置开关圆钮颜色
    [myswitch setThumbTintColor:[UIColor grayColor]];
    //设置整体风格颜色
    [myswitch setTintColor:[UIColor purpleColor]];
    //响应事件 函数课传参
    [myswitch addTarget:self action:@selector(openSwitch) forControlEvents:UIControlEventValueChanged];
    //将控件添加到view上
    [self.view addSubview:myswitch];

打开开关前：
在这里插入图片描述
打开开关后：

UISlider和UIProgressview

进度条：UIProgressView。一般用来表示下载或视频播放的速度
滑动条：UISlider。一般用来进行音乐音量的调整等

//进度条控件
    UIProgressView* progress = [[UIProgressView alloc] init];
    //位置设置。进度条的高度是不可以变的
    progress.frame = CGRectMake(100, 100, 100, 40);
    //设置进度条的风格颜色值
    progress.progressTintColor = [UIColor redColor];
    //设置进度条的进度值 最大为1，最小为0
    progress.progress = 0.5;
    //设置进度条的风格特征
    progress.progressViewStyle = UIProgressViewStyleDefault;
    [self.view addSubview:progress];
    //滑动条控件
    UISlider* slider = [[UISlider alloc] init];
    //位置设置 高度不可变更
    slider.frame = CGRectMake(100, 300, 100, 40);
    //设置滑动条最大值
    slider.maximumValue = 100;
    //设置滑动条最小值 可以为负值
    slider.minimumValue = 0;
    //设置滑动条的滑块位置 float类型
    slider.value = 50;
    //左侧滑条背景颜色
    slider.minimumTrackTintColor = [UIColor orangeColor];
    //右侧背景条颜色
    slider.maximumTrackTintColor = [UIColor blueColor];
    //设置滑块颜色
    slider.thumbTintColor = [UIColor grayColor];
    //添加事件函数
    [slider addTarget:self action:@selector(slider) forControlEvents:UIControlEventValueChanged];
    [self.view addSubview:slider];