【 iOS 应用开发 】 UIKit 控件 ( UIView 属性 | storyboard 设置 | 模拟器 | 拖线关联 | 软键盘操作 | 颜色值 | 代码生成控件 | 动画设置 )

其他 2018-08-16 05:10:53 阅读次数: 0



博客总结 :

  • 1.模拟器屏幕 : 模拟器太大导致无法全屏显示, Window -> Scale -> 33% 即可显示整个手机模拟器界面;
  • 2.模拟器控制 : Home 键 : Shift + Command + H, 停止模拟器 : 点击 XCode 中的停止按钮;
  • 3.程序入口配置 : 在 Deployment Info 中设置程序入口界面 Storyboard;
  • 4.Storyboard 界面设置 : Main.Storyboard -> 文件查看器 (File Inspector) -> Interface Builder Document -> 取消 Use Size Class 选项, 设置设计界面与手机界面一致;
  • 4.显示机型设置 : ViewController -> 属性 -> Size 选择屏幕尺寸;
  • 5.Storyboard Entry Point 箭头 : 指向界面初始化时创建的第一个 ViewController, 可在 ViewController 中的 Is Initial View Controller 选项中设置箭头是否指向本 ViewController ;
  • 6.按钮点击事件 : ① 从代码到 Storyboard 拖线关联 IBAction 返回值方法 与 界面控件, 默认绑定 Touch Up Inside 事件; ② 右键选择按钮从 Send Events 列表中的按钮事件向代码拖线, 可以选择 将 按钮的指定事件 与 代码中的方法 进行关联; ③ 按住 control 键, 从控件拖到 ViewControler.m 空白处, 弹出生成方法对话框 生成对应事件绑定的方法;
  • 7.UI 控件 与 ViewController 关联 : 拖线关联 IBOutlet 修饰的属性 与 界面控件;
  • 8.解决模拟器软键盘不弹出问题 : 选择 Hardware -> Keyboard -> Toggle Software Keyboard 选项 激活;
  • 9.设置软键盘类型 : 设置 TextField 控件的 Keyboard Type 属性;
  • 10.退出软键盘 : ① 谁触发谁关闭 调用UITextField 的 resignFirstResponser 方法, ② 调用 根节点 [self.view endEditing:YES] 关闭根节点及其子节点触发的软键盘;
  • 11.图片素材管理 : 图片素材可以从 Finder 中拖到 Assets.xcassets 中;
  • 12.按钮设置 : ① 按钮风格 通常使用 Custom, ② 按钮状态 Default, HighLighted , 分别可设置不同状态的 背景 文子 及 文子颜色 等属性; ③ 代码生成按钮 并 绑定事件 ( addTarget );
  • 13. 生成随机颜色值 : 通过随机生成 float 类型设置到 UIClolr 的 colorWithRed:green:blue:alpha 方法中, 生成一个随机颜色值;
  • 14.动画设置 : ① 常用的 Block 动画设置, ② 头尾式动画很少使用;






一. UIKit 相关知识点




1. iOS 应用创建


( 1 ) 创建应用

创建应用 :

  • 1.进入 Xcode 选择创建应用 : 在 环境首界面 选择 Create a new Xcode project 选项, 创建一个新应用 ;

这里写图片描述

  • 2.选择创建类型 : 在下面的界面中 选择创建 iOS -> Application -> Single View Application, 即 创建一个只有一个 View 界面的 iOS 应用;

这里写图片描述

  • 3.设置相关参数 : 设置 ① 应用名称 Caculater ② 组织名称 han ③ 组织标识 cn.han ④ 所使用的语言 Objective-C ④ 设备 iPhone ;

这里写图片描述

  • 4.选择所在目录 : 选择一个目录, 注意 这个目录 是项目的上一级目录;

这里写图片描述

  • 5.创建成功 : 下图是创建的新应用 ;

这里写图片描述


( 2 ) 运行应用

运行应用 :

  • 1.运行操作 : 点击 运行 按钮, 即可运行刚创建的应用, 运行按钮 如下图的 红框中;

这里写图片描述

  • 2.设置虚拟机大小 : Xcode 默认的 iPhone 虚拟机非常大, 屏幕中显示不全, 在 虚拟机的菜单 -> Window -> scale 设置;

这里写图片描述

  • 3.虚拟机界面 : 下图是运行起来之后的虚拟机界面 ;

这里写图片描述


( 3 ) iPhone 模拟器控制

iPhone 模拟器控制 :

  • 1.退出当前调试应用到桌面 : 使用 Shift + Command + H 快捷键 , 返回到 模拟器 桌面;
  • 2.退出调试状态 : 点击 Xcode 中的停止按钮;

这里写图片描述




2. iOS 设计界面 storyboard


( 1 ) LaunchScreen.storyboard 应用欢迎界面

LaunchScreen.storyboard 界面 : 该界面不是用于展示应用程序的界面 ;

  • 1.界面作用 : 该界面是 进入 首界面 之前的 一个欢迎界面, 该界面 是在 LaunchScreen.storyboard 中设置的;

这里写图片描述


( 2 ) Main.storyboard 界面

Main.storyboard 界面简介 :

  • 1.设计界面与实际界面的差异 : 下图中的 Main.storyboard 界面中的规格 与 右侧 iPhone 6S 虚拟机的规格 明显不同; 中间的是设计界面, 右侧的是 iPhone 6S Plus 虚拟机;

这里写图片描述

  • 2.版本 与 界面设计 的差异 : 在 Xcode 5 中 设计界面 与 手机界面是一样的, Xcode 6 及 以后的版本, 就只有一个设计界面, iPhone 的各个版本 与 iPad 的各个版本 都使用同一个设计界面 ;
  • 3.选择 View Controller 进行设置 : 下面的设置都是 针对 View Controller 属性进行设置, 先要选中 View Controller;

这里写图片描述

  • 4.定制不同界面选项 : 如果要在一个设计界面中, 定制不同的界面 , 那么在右侧的 Interface Builder Document 中选中 Use Size Class 选项;

这里写图片描述

  • 5.取消 Size Class 选项 : 将 Use Size Class 选项取消, 那么 设计 界面 与 手机界面 就一致了 ;

    • ( 1 ) 选择界面类型 : 点击取消时会弹出一个对话框, 让我们 选择 为 iPhone 还是 iPad 设计界面, 这里我们选择 iPhone;

    这里写图片描述

    • ( 2 ) 对比设计界面 与 手机界面 : 此时 设计界面 与 手机界面基本一致, 但是这个界面 与 iPhone 6S Plus 界面还是有差异, 还需要设置一下界面的具体机型 ;

    这里写图片描述


( 3 ) Main.storyboard 界面具体机型设置

Main.storyboard 界面机型设置 :

  • 1.设置机型方法 : ① 选中 View Controller, ② 打开 View Controller 的 属性查看器, ③ 设置 虚拟机参数 ( Simulated Metrics ) 中的 size 参数, ④ 设置 iPhone 6S Plus 的大小 iPhone 5.5-inch ;

这里写图片描述

  • 2.设计与真实大小一致 : 此时 iPhone 6S Plus 虚拟机 与 Main.storyboard 中的设计界面 能重叠在一次, 大小一致;

这里写图片描述


( 4 ) Storyboard Entry Point ( 箭头 )

Storyboard Entry Point 简介 :

  • 1.程序入口配置 : 程序入口在 应用配置 ( 点击左侧最上面的应用按钮 ) 中的 General -> Deployment Info -> Main Interface 中进行配置, 这里将 Main.storyboard 设置为程序的入口;
    这里写图片描述
  • 2.Main.storyboard 中的箭头 : 这个箭头代表了当加载该 Main.storyboard 界面时, 先创建哪个 ViewController 控制器, 显示哪个控制器对应的 view 控件, 箭头所指的 ViewController 先进行初始化 并 显示对应的 控件;

  • 3.storyboard 中 ViewController 数量 : 一个 storyboard 中可以有多个 ViewController, 右侧的对象库中, 第一个就是 ViewController 对象, 可以拖入到 storyboard 中, 拖入之后 storyboard 就有两个 ViewController , 但是箭头所指的是第一个, 那么界面显示的时候 首先显示的就是 第一个 ViewController 及其控制的控件;
    箭头选中 :
    这里写图片描述
    这里写图片描述

  • 4.箭头控制 - 拖动 : 界面中有多个 ViewController 时, 可以将箭头从 ViewController 之间来回拖动, 切换 storyboard 界面 初始的 ViewController 控制器;
    这里写图片描述

  • 5.箭头控制 - 删除 : 箭头的对象在左侧显示, 是 Storyboard Entry Point 对象, 选中该对象, 按下 Delete 键, 可删除该箭头;
    这里写图片描述
    箭头删除后 :
    这里写图片描述
  • 6.箭头控制 - 属性设置 : 如果将箭头删除, 此时的处理方法是, 选中界面的初始化 ViewController 然后打开属性查看器, 将 Is Initial View Controller 选项勾选, 此时 Storyboard Entry Point 对象就显示出来了, 界面中的箭头也显示出来了;
    这里写图片描述

界面启动流程 : ① 解析 Deployment Info 程序中配置的程序入口 Storyboard, ② 根据 Storyboard Entry Point 箭头 指向创建 ViewController, ③ 创建 ViewController 控制的 根 节点 view 对象, ④ 创建其子节点 view 对象, 将这些子控件 按照级别添加到 根节点上;

Deployment Info 的其它配置信息 :

  • 1.Deployment Info : 兼容的 iOS 的 最低版本 ;
  • 2.Devices : 程序要部署的设备; iPhone iPad 或者 通用;
  • 3.Main Interface : 程序入口的 storyboard ;
  • 4.Device Orientation : 屏幕的方向; Portrait 竖屏, Landscape Left 横屏 按钮左侧, Landscape Right 横屏, 按钮在右边;




3. iOS 常用 UI 控件


( 1 ) iOS 控件 对象 库

iOS UI 对象库 :

  • 1.查看 UI 对象库 : 开发环境 右下角 面板, 选择 Show the Object library 面板, 即可看到 对象库;
  • 2.上拉扩展 对象库 面板 大小 : 将 鼠标移动到 对象库 面板的上边缘, 可以 扩大 对象库 面板框 大小;

这里写图片描述


( 2 ) iOS 常用 控件

iOS 常用控件 :

  • 1.UILabel : 文本标签 控件, 显示 一个 字符串 文字;
  • 2.UIButton : 按钮 控件, 可设置 点击事件监听器, 监听到 用户 点击后 进行一个操作 ;
  • 3.UITextField : 文本输入框 控件, 用户自己输入一个字符串 ;
  • 4.UITextView : 多行文本标签 控件, 支持 多行显示, 滚动功能, 用户可编辑 ;
  • 5.UIProgressView : 进度条 控件, 水平 进度条 ;
  • 6.UISlider : 滑块 控件, 可触摸滑动的进度条, 进行数值 调节 ;
  • 7.UIActivityIndicator : 等待 控件, 圆圈形状的 等待进度条 ;
  • 8.UIAlertView : 对话框 控件;
  • 9.UIActionSheet : 底部对话框 控件 ;
  • 10.UIScrollView : 滚动 控件, 内容超出屏幕, 使用该控件处理;
  • 11.UIPageControl : 分页 控件;
  • 12.UITableView : 列表 表格 控件;
  • 13.UICollectionView : 九宫格 控件 ;
  • 14.UIWebView : 网页 控件 ;
  • 15.UISwitch : 开关 控件;
  • 16.UISegmentControl : 选项卡 控件;
  • 17.UIPickerView : 选择器 控件 ;
  • 18.UIDatePicker : 日期选择器 控件 ;
  • 19.UIToolbar : 工具条 控件;
  • 20.UINavigationBar : 导航条 控件, 每个界面顶部必有一个导航条 ;


( 3 ) UIView

UIView 简介 :

  • 1.定义 : iOS 手机屏幕上的所有能看到的内容都是 UIView 或 UIView 子类, 如 按钮 UIButton, 文字 UILabel 等都是继承自 UIView 的;
  • 2.本质 : 每个 UIView 都可以当做一个容器, UIView 可以嵌套 另外若干个 UIView;
  • 3.父控件 与 子控件 : iOS 的 整个界面是一个 UIView 控件, 该控件是父控件; 该界面中的元素被嵌套在了 父控件 UIView 中, 这些界面中的控件就是 子控件 ; 下图是 Main.storyboard 中的 截图;
    这里写图片描述


( 4 ) UIViewController

UIViewController 简介 :

  • 1.界面启动 时 UIViewController 的行为 : 每当跳转到一个新的界面, 先创建一个全新的 UIViewController 对象, 然后由 UIViewController 负责创建与其对应的 UIView 界面, 这个 UIView 是全屏控件的父容器, UIViewController 负责管理这个全屏的父容器 UIView ;
  • 2.UIViewController 作用 : UIViewController 负责 ① 管理 UIView 的生命周期 创建 显示 销毁, ② 监听 UIView 内部控件的事件响应, ③ 控制 UIView 与 用户之间的进行交互 ;
  • 3.UIViewController 开发环境中的对应关系 : 选中界面中的 View Controller 元素, 然后去 属性面板 中对应的 类面板, 其中的 Class 属性就是设置的其对应的 代码类, 这里是 ViewController.h 和 ViewController.m ;

这里写图片描述

  • 4.ViewController.h 代码 : 
//
//  ViewController.h
//  Caculater
//
//  Created by octopus on 18/5/8.
//  Copyright © 2018年 han. All rights reserved.
//

#import <UIKit/UIKit.h>

@interface ViewController : UIViewController


@end
  • 5.ViewController.m 代码 : 
//
//  ViewController.m
//  Caculater
//
//  Created by octopus on 18/5/8.
//  Copyright © 2018年 han. All rights reserved.
//

#import "ViewController.h"

@interface ViewController ()

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.
}

- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}

@end




4. 控件常见属性


( 1 ) 修改控件状态

修改控件状态 : 通过修改对应 UI 对象的属性来修改控件的状态;

  • 1.UI 控件本质 : 每个控件都是一个对象, 修改控件的状态, 就是修改控件对象的属性; 如 修改 UILabel 显示的文字 就修改 text 属性, 修改 UIImageView 显示的图片 就修改 image 属性;
  • 2.属性类别 : 分为控件独有的属性, 和 共有的属性, 很明显 共有属性是 UIView 中定义的, 而其他控件都是 UIView 的子类;
    • ① 独有属性 : 有些属性是控件独有的, 如 UIProgressView 的 progress 属性代表其进度值, UILabel 和 UITextField 的 text 属性 代表其文本内容;
    • ② 共有属性 : 控件有些属性是共有的, 如控件的 位置尺寸 frame 属性, 中心店位置 center 等属性, 这些属性都定义在 UIView 中,


( 2 ) UIView 属性

UIView 常用属性 :

  • 1.superview 属性 : 获取父控件对象, UIView 中定义内容 @property(nonatomic,readonly) UIView *superview; ;
  • 2.subviews 属性 : 获取子控件集合, UIView 中定义内容 @property(nonatomic,readonly,copy) NSArray *subviews; ;
  • 3.tag 属性 : 控件标识属性, 父控件可以通过 tag 属性找到子控件, UIView 中定义内容 @property(nonatomic) NSInteger tag; ;
  • 4.transform 属性 : 控件旋转缩放平移等操作属性, UIView 中定义内容 @property(nonatomic) CGAffineTransform transform; ;

  • 5.frame 属性 : 控件 在 父控件 中的位置 和 尺寸, UIView 中定义内容 @property(nonatomic) CGRect frame; ;

  • 6.bounds 属性 : 控件本身 所在矩形框的 位置 和 尺寸, 其中的位置就是 固定的 (0,0) 点, 尺寸就是矩形框大小, UIView 中定义内容 @property(nonatomic) CGRect bounds; ;

  • 7.center 属性 : 控件中心点在 父控件 的位置, UIView 中定义内容 @property(nonatomic) CGPoint center; ;


( 3 ) UIView 坐标系

UIView 坐标系 :

  • 1.原点 : 左上角 的位置 是原点, 向右是 x 轴, 向下是 y 轴, 向右移动 x 轴坐标增加, 向下移动 y 轴坐标增加;
    这里写图片描述


( 4 ) UIView 常用操作控件方法

UIView 操作控件方法 :

  • 1.添加一个子控件 : - (void)addSubview:(UIView *)view; ;
  • 2.从父控件移除子控件 : - (void)removeFromSuperview; ;
  • 3.根据 tag 标识找到对应子控件 : - (UIView *)viewWithTag:(NSInteger)tag; ;


( 5 ) 控件 与 坐标系

控件 与 坐标系 :

  • 1.frame 属性 的 位置 与 大小 : 注意该属性是相对于父控件的 位置 和 大小; 此时的父控件是界面的 根控件;
    这里写图片描述
  • 2.Size Inspector (尺寸查看器) : 点击右侧 尺子 图标, 即可打开 Size Inspector, 该界面中显示 控件 位置先关信息;
    这里写图片描述
  • 3.再次强调下frame 属性是相对于父控件的 : 创建一个 view 控件, 将 label 控件放在 view 控件的左上角, 此时 label 控件的位置是 (0, 0), 大小不变;
    这里写图片描述




5. UIButton 详解


( 1 ) 修改控件状态


( 2 ) 代码创建按钮并绑定事件

代码创建按钮并绑定事件 :

  • 1.创建 UIButton 按钮 :






二. 应用代码示例




1. 实现简单加法运算


( 1 ) 创建应用

参考本博客 一. 1. 章节, 有创建应用的过程说明 ;


( 2 ) 需求

需求 :

  • 1.界面元素 : ① 两个 UITextField 控件, ② 三个 UILabel 控件, ③ 加法 按钮;
  • 2.UITextField 控件 : 弹出数字键盘, 用于接收用户输入的数字;
  • 3.UILabel 控件 : 两个分别显示 + 和 = 符号, 这个不变, 最后一个 Label 标签 用于显示 用户从 UITextField 输入的两个数之和;
  • 4.加法按钮 : 点击按钮, 将用户在 UITextField 输入的字符串转为 int 类型, 相加, 将结果转为字符串显示在 最后一个 UILabel 中;
    这里写图片描述


( 3 ) 界面编辑

界面编辑 :

  • 1.向 Main.storyboard 界面拖入 Text 控件 : Text 控件是用户输入框, 可以接收用户输入的信息; 拖入 1 个 Text 标签, 然后拖入第 2 个, 拖入第二个标签时会显示对齐信息, 该控件用于接收用户输入的数字, 然后进行加法计算;
    这里写图片描述
  • 2.拖入 Label 控件 并设置文本 : Label 标签 是文本显示标签, 只能单纯的显示文本, 不能进行操作; 如果在 storyboard 界面修改文本标签, 该标签会自动缩放到刚好包裹文本的大小; 依次拖入两个 Label, 然后双击控件, 将 Label 重命名为 + 和 = ;
    这里写图片描述
  • 3.拖入 Label 控件 并设置 属性 : 上面通过双击直接在界面修改控件文本控件会缩小; 解决这个问题需要在 控件 属性中进行设置, 将 Label 属性中的 Label Text 内容删除, 控件不显示内容, 但是大小不改变;
    这里写图片描述
  • 4.拖入 Button 控件 : 将 Button 控件拖入界面中, 放在 TextField 和 Label 控件下面, 并修改文字内容为 计算结果;
    这里写图片描述


( 4 ) 按钮事件设置

设置按钮响应事件 :

  • 1.声明按钮点击方法 : 在 ViewController.h 中声明按钮的点击事件, 注意返回值必须是 IBAction 类型的 ; 
//声明计算方法
//① 这个 IBAction 相当于 void 类型
//② 只有返回值是 IBAction 类型才能与 Main.storyboard 进行交互
- (IBAction) caculate;
  • 2.实现按钮的点击方法 : 在 ViewController.m 中实现该按钮的点击方法; 
//实现计算方法
//① 这个 IBAction 相当于 void 类型
//② 只有返回值是 IBAction 类型才能与 Main.storyboard 进行交互
- (IBAction) caculate{
    NSLog(@"按钮点击");
}
  • 3.关联按钮点击方法与按钮 : ① 打开辅助编辑器, 出现两个并列的编辑器, 一个现实 Main.storyboard 界面, 另一个现实 ViewController.h 代码界面, ② 将鼠标指针移动到 ViewController.h 界面中的按钮点击方法前的圆圈 这里写图片描述 中, 此时圆圈会变成 这里写图片描述, 此时按住鼠标左键, 拖到按钮控件上, 此时按钮控件与点击方法就关联起来了;
    这里写图片描述
  • 4.解除按钮与点击方法关联 ( 非必要说明 ) : 如果要修改按钮的方法, 首先要删除之前设置的方法, 否则会报错; 右键点击按钮, 查看 Send Events 中的 Touch Up Inside 中的对应的点击事件, 点击左上角的 x 直接删除该事件即可接触按钮与点击事件的关联 ;
    这里写图片描述


( 5 ) 定义控件属性 并 关联控件

定义控件属性 : 如果要在 ViewController 中操作控件, 就需要在 ViewController 中定义该控件的对象;

  • 1.定义 TextField 属性 : @property (nonatomic, weak) IBOutlet UITextField * number1TextField; , 其中 @property 作用是生成其访问方法, 并制定该属性的指示符 nonatomic 代表该属性是 线程不安全 但是 性能高, weak 代表该属性是弱引用, 所有的控件都使用 weak 修饰; 属性 使用 IBOutlet 修饰 才能与 Main.storyboard 中的控件进行关联, 反之 没有左侧的 关联 符号; IBOutlet 只用标识该属性可以与 storyboard 进行连线;
  • 2.关联属性与界面控件 : 建立 TextField 控件与 number1TextField 属性的连线, 过程与上面建立 按钮 与 点击 方法 关联的过程相同, ① 将鼠标移动到 ViewController.h 中的 IBOutlet 属性 左侧的圆圈, 此时该圆圈变为 加号, ② 按住鼠标左键, 拖到制定的控件处, 这样 ViewController.h 中的属性与 Main.storyboard 中的控件建立起了关联;
    • ① 属性左侧的圆圈图示 : 第一张是鼠标没有移动到圆圈上, 第二章是鼠标移动到了圆圈上;
      这里写图片描述
      这里写图片描述
    • ② 建立关联图示 : 打开辅助编辑器, 按住鼠标左键, 拖到 storyboard 中对应的控件上;
      这里写图片描述
      建立连接后, 属性前的圆圈变为实心;
      这里写图片描述
  • 3.创建第二个 TextField 属性并关联界面 : 同上面的操作, 在创建第二个属性, 关联 ViewController.h 中的属性与 Main.storyboard 中的属性;
    这里写图片描述
  • 4.创建 Label 属性 并关联界面 : 在 ViewController.h 中定义 Label 属性 @property (nonatomic, weak) IBOutlet UILabel* resultLabel; , 除了类型 UILabel 与上面不同之外 其它一样;
    这里写图片描述


( 6 ) 软键盘设置

软键盘设置 :

  • 1.虚拟机软键盘弹出设置 : 虚拟机默认是使用电脑的键盘, 默认不弹出软键盘, 需要作如下设置, 虚拟机 菜单 Hardware -> Keyboard -> Toggle Software Keyboard 点一下这个选项即可弹出软键盘, 这样点击 TextField 控件才会弹出虚拟机的软键盘;
    这里写图片描述
  • 2.设置 TextField 键盘类型 : 在 Main.storyboard 中选中 TextField 控件, 选择 属性查看器, 设置其中的 keyboard Type, 设置为 Number Pad 数字键盘;
    这里写图片描述

这里写图片描述

  • 3.退出软键盘方式 : 两种方式 ① 哪个 TextField 触发的, 通过对应的 TextField 控件 关闭键盘; ② 通过 父控件 关闭 软键盘;
    • ① 谁触发谁关闭 : 调用控件的 resignFirstResponder 方法 退出软键盘, 该方法只能关闭控件本身触发的软键盘, 示例 [self.textField resignFirstResponder] 关闭 textField 属性对应的控件触发的软键盘;
    • ② 通过父控件关闭 : 调用界面的根节点 view 的 endEditing 方法关闭软键盘; 代码 [self.view endEditing:YES] 关闭 view 控件 及其 子控件 触发的软键盘;


( 7 ) 实现加法逻辑

实现计算逻辑 :

  • 1.实现位置 : 点击按钮后执行加法运算, 接收 界面中输入的 两个数字, 并将计算结果输出到界面中, 主要逻辑都在按钮的点击方法中实现的, 下面是按钮点击方法代码 : 
//实现计算方法
//① 这个 IBAction 相当于 void 类型
//② 只有返回值是 IBAction 类型才能与 Main.storyboard 进行交互
 - (IBAction) caculate{

    NSLog(@"按钮点击");
}
  • 2.获取 用户在 UITextField 输入的值 : NSString * number1Str = self.number1TextField.text; 使用 self. 方式访问 @property 修饰的成员变量, 即访问其自动生成的 getter 方法, number1TextField.text 是访问其 text 属性, 即用户输入的值;
  • 3.将 NSString 类型转为字符串 : 访问 NSString 类型的 intValue 属性, 即可获取其 int 值, 将 NSString 类型转为了 int 类型; 代码为 int number1 = number1Str.intValue;;
  • 4.将 int 类型转为 NSString 类型 : 使用 NSString 的 stringWithFormat 方法处理, [NSString stringWithFormat:@"%d", result] ;
  • 5.最终代码示例 : 
//实现计算方法
//① 这个 IBAction 相当于 void 类型
//② 只有返回值是 IBAction 类型才能与 Main.storyboard 进行交互
 - (IBAction) caculate{

    //1.获取 TextField 值
    NSString * number1Str = self.number1TextField.text;
    NSString * number2Str = self.number2TextField.text;

    //2.将字符串值转为 int 类型, 并计算和
    int number1 = number1Str.intValue;
    int number2 = number2Str.intValue;
    int result = number1 + number2;

    //3.改变 Label 控件值, 注意要将 int 值转为 NSString 类型
    self.resultLabel.text = [NSString stringWithFormat:@"%d", result];

}
  • 6.执行效果 :
    这里写图片描述




2. 按钮使用代码示例


( 1 ) 创建应用

参考本博客 一. 1. 章节, 有创建应用的过程说明 ;


( 2 ) 需求

需求 :

  • 1.界面元素 : ① 大按钮 可设置背景图片, ② 上下左右 四个小按钮, ③ 放大 缩小 两个小按钮;
  • 2.大按钮功能 : 点击大按钮, 然后点击按下状态时, 大按钮显示另外一个背景图片;
  • 3.上下左右按钮 : 点击四个按钮, 大按钮进行上下左右移动;
  • 4.放大缩小按钮 : 点击放大, 大按钮放大, 点击缩小, 大按钮缩小;
    这里写图片描述


( 3 ) 项目设置

项目设置 : 设置屏幕大小, 拷贝需要用到的素材,

  • 1.设置 Main.storyboard 设计大小 : ① 进入 Main.storyboard 界面, 在文件查看器界面, 取消 Use Size Classes 勾选, 在弹出的对话框中 选择 iPhone 选项; ② 点击 ViewController, 在其属性查看器中, 选择对应的设计尺寸;
    这里写图片描述
    这里写图片描述
  • 2.拷贝图片素材 : 图片素材都是在 工程中的 Assets.xcassets 中存放的, 开发时 直接将素材拖到 Assets.xcassets 界面的 左侧位置, 如下图 红框位置;
    这里写图片描述
    素材直接从 Finder 中拖到这里即可;
    这里写图片描述


( 4 ) UI 界面开发

Main.storyboard 界面开发 : 放置按钮, 并设置按钮的背景图片;

  • 1.界面放置 Button 按钮 : 从右侧的对象库中 拖一个 Button 控件到 Main.storyboard 中;
    这里写图片描述
  • 2.设置按钮的背景 : 在 Button 的 background 属性中设置图片名称, 然后图片就会显示在布局中;
    这里写图片描述
  • 3.设置按钮的文字 : Button 中的 tittle 属性设置按钮的文字, 下面的 Font 设置字体和大小, Text Color 设置文字颜色;
    这里写图片描述
  • 4.设置按钮文字颜色 : 点击按钮的 Text Color 属性, 会弹出一个列表, 可以选择少数几种颜色, 点击列表底部弹出一个 颜色板 可以选择任何颜色;
    这里写图片描述
  • 5.设置按钮点击状态 : 在 State Config 属性中可以配置 五种状态, 其中的 Highlighted 状态就是按钮按下的状态, 每个状态都可以设置一套单独的 Tittle Background 等属性, 如下图的属性列表;
    这里写图片描述
  • 6.设置按钮点击状态的背景图片 : 将 State Config 切换到 Highlighted 状态, 此时可以设置 高亮状态下的按钮属性, 将 Background 中设置对应的按下的图片, 文字设置成按下的文字;
    这里写图片描述
  • 7.Main.storyboard 中查看 Highlighted 状态的设置 : 我们设置了 Highlighted 状态的 文字 和 背景图片, 此时无法看到, 可以在 Control 属性中勾选 Highlighted 属性, 此时就能查看高亮状态的 文字 和 背景图片了;
    这里写图片描述
  • 8.定制样式 : 使用 System 类型的属性, 会将 Highlighted 状态的图片默认设置成半透明, 这里为了避免这种情况, 需要 将 Type 属性设置为 Custom , 这样就可以自己定制按钮的属性了;
    这里写图片描述
  • 9.设置向上箭头按钮 : 设置向上箭头按钮, 并设置其 默认背景图片, 高亮状态背景图片, 并设置其类型为 定制类型, 不要点上去 高亮状态变为半透明;
    这里写图片描述
    设置按钮高亮状态下的属性, 注意在 Control 中的 Content 属性需要勾选 Highlighted 选项才会显示下图的内容;
    这里写图片描述

  • 10.ViewController 中定义按钮对象 : 在 ViewController.m 中定义按钮属性, 并拖线关联该属性与 Main.storyboard 中的按钮控件; 定义内容 @property (nonatomic, weak) IBOutlet UIButton * mainButton; ;
    这里写图片描述

  • 11.CGRect 结构体介绍 : 其中 CGPoint 和 CGSize 都是一个结构体; 使用 typedef struct CGRect CGRect 语句重命名结构体类型之后, 结构体不用使用 struct CGRect frame 来定义结构体, 使用 CGRect frame 声明即可; 

/* Points. */

struct CGPoint {
    CGFloat x;
    CGFloat y;
};
typedef struct CGPoint CGPoint;

/* Sizes. */

struct CGSize {
    CGFloat width;
    CGFloat height;
};
typedef struct CGSize CGSize;


/* Rectangles. */

struct CGRect {
    CGPoint origin;
    CGSize size;
};

typedef struct CGRect CGRect;
  • 12.ViewController.m 中定义向上按钮的点击方法 : 这里注意 frame 是一个 CGRect 类型的结构体, 修改该结构体不能直接在对象中修改 如 self.mainButton.frame.origin.y = 0, 这种方法是错误的, 需要先将 frame 结构体取出来, 然后再操作赋值; 
//向上移动的方法
-(IBAction) up{

    //注意点 : OC 中不能直接 修改 对象的结构体成员,
    // 如果有此类需求, 需要先取出结构体, 修改结构体成员, 在将结构体赋值给对象

    //1.取出 frame 结构体
    CGRect frame = self.mainButton.frame;
    //2.修改结构体中的成员, 向上移动 即 y 值减少, 每点击一下按钮y减少10
    frame.origin.y -= 10;
    //3.将结构体设置回 UIButton 对象
    self.mainButton.frame = frame;

}
  • 13.关联控件的 Touch Up InSide 与上面定义的方法 : 右键点击控件, 在弹出的黑色对话框中找到 Touch Up Inside 方法, 点击方法后的圆圈, 直接拖到对应的方法上;
    这里写图片描述
  • 14.定义其它三个方向的按钮及方法 : 方法基本与 up 方法相同, 就是 修改 CGRect frame 结构体的 x y 递增 递减, 拖线关联按钮与方法; 
//向下移动的方法
-(IBAction) down{

    //注意点 : OC 中不能直接 修改 对象的结构体成员,
    // 如果有此类需求, 需要先取出结构体, 修改结构体成员, 在将结构体赋值给对象

    //1.取出 frame 结构体
    CGRect frame = self.mainButton.frame;
    //2.修改结构体中的成员, 向上移动 即 y 值减少, 每点击一下按钮y减少10
    frame.origin.y += 10;
    //3.将结构体设置回 UIButton 对象
    self.mainButton.frame = frame;

}

//向下移动的方法
-(IBAction) left{

    //注意点 : OC 中不能直接 修改 对象的结构体成员,
    // 如果有此类需求, 需要先取出结构体, 修改结构体成员, 在将结构体赋值给对象

    //1.取出 frame 结构体
    CGRect frame = self.mainButton.frame;
    //2.修改结构体中的成员, 向上移动 即 y 值减少, 每点击一下按钮y减少10
    frame.origin.x -= 10;
    //3.将结构体设置回 UIButton 对象
    self.mainButton.frame = frame;

}

//向下移动的方法
-(IBAction) right{

    //注意点 : OC 中不能直接 修改 对象的结构体成员,
    // 如果有此类需求, 需要先取出结构体, 修改结构体成员, 在将结构体赋值给对象

    //1.取出 frame 结构体
    CGRect frame = self.mainButton.frame;
    //2.修改结构体中的成员, 向上移动 即 y 值减少, 每点击一下按钮y减少10
    frame.origin.x += 10;
    //3.将结构体设置回 UIButton 对象
    self.mainButton.frame = frame;

}

这里写图片描述
- 15.定义放大缩小的方法 : 放大缩小即修改 frame 属性中的 size 结构体中的 width 和 height 值, 增加就是放大, 减少就是缩小; 拖入两个按钮并设置按钮的 Normal 和 Highlighted 状态的背景, 拖线关联 按钮与方法; 

//向下移动的方法
-(IBAction) big{

    //注意点 : OC 中不能直接 修改 对象的结构体成员,
    // 如果有此类需求, 需要先取出结构体, 修改结构体成员, 在将结构体赋值给对象

    //1.取出 frame 结构体
    CGRect frame = self.mainButton.frame;
    //2.修改结构体中的成员, 宽高增加就是放大
    frame.size.width += 10;
    frame.size.height += 10;
    //3.将结构体设置回 UIButton 对象
    self.mainButton.frame = frame;

}

//向下移动的方法
-(IBAction) small{

    //注意点 : OC 中不能直接 修改 对象的结构体成员,
    // 如果有此类需求, 需要先取出结构体, 修改结构体成员, 在将结构体赋值给对象

    //1.取出 frame 结构体
    CGRect frame = self.mainButton.frame;
    //2.修改结构体中的成员, 宽高减少就是缩小
    frame.size.width -= 10;
    frame.size.height -= 10;
    //3.将结构体设置回 UIButton 对象
    self.mainButton.frame = frame;

}


( 5 ) 代码示例

代码示例 : 

//
//  ViewController.m
//  3.ButtonDemo
//
//  Created by octopus on 18/6/9.
//  Copyright © 2018年 han. All rights reserved.
//

#import "ViewController.h"

@interface ViewController ()

//定义要操作的主要按钮, 即显示头像的按钮
@property (nonatomic, weak) IBOutlet UIButton * mainButton;

@end

@implementation ViewController

//向上移动的方法
-(IBAction) up{

    //注意点 : OC 中不能直接 修改 对象的结构体成员,
    // 如果有此类需求, 需要先取出结构体, 修改结构体成员, 在将结构体赋值给对象

    //1.取出 frame 结构体
    CGRect frame = self.mainButton.frame;
    //2.修改结构体中的成员, 向上移动 即 y 值减少, 每点击一下按钮y减少10
    frame.origin.y -= 10;
    //3.将结构体设置回 UIButton 对象
    self.mainButton.frame = frame;

}

//向下移动的方法
-(IBAction) down{

    //注意点 : OC 中不能直接 修改 对象的结构体成员,
    // 如果有此类需求, 需要先取出结构体, 修改结构体成员, 在将结构体赋值给对象

    //1.取出 frame 结构体
    CGRect frame = self.mainButton.frame;
    //2.修改结构体中的成员, 向上移动 即 y 值减少, 每点击一下按钮y减少10
    frame.origin.y += 10;
    //3.将结构体设置回 UIButton 对象
    self.mainButton.frame = frame;

}

//向下移动的方法
-(IBAction) left{

    //注意点 : OC 中不能直接 修改 对象的结构体成员,
    // 如果有此类需求, 需要先取出结构体, 修改结构体成员, 在将结构体赋值给对象

    //1.取出 frame 结构体
    CGRect frame = self.mainButton.frame;
    //2.修改结构体中的成员, 向上移动 即 y 值减少, 每点击一下按钮y减少10
    frame.origin.x -= 10;
    //3.将结构体设置回 UIButton 对象
    self.mainButton.frame = frame;

}

//向下移动的方法
-(IBAction) right{

    //注意点 : OC 中不能直接 修改 对象的结构体成员,
    // 如果有此类需求, 需要先取出结构体, 修改结构体成员, 在将结构体赋值给对象

    //1.取出 frame 结构体
    CGRect frame = self.mainButton.frame;
    //2.修改结构体中的成员, 向上移动 即 y 值减少, 每点击一下按钮y减少10
    frame.origin.x += 10;
    //3.将结构体设置回 UIButton 对象
    self.mainButton.frame = frame;

}

//向下移动的方法
-(IBAction) big{

    //注意点 : OC 中不能直接 修改 对象的结构体成员,
    // 如果有此类需求, 需要先取出结构体, 修改结构体成员, 在将结构体赋值给对象

    //1.取出 frame 结构体
    CGRect frame = self.mainButton.frame;
    //2.修改结构体中的成员, 宽高增加就是放大
    frame.size.width += 10;
    frame.size.height += 10;
    //3.将结构体设置回 UIButton 对象
    self.mainButton.frame = frame;

}

//向下移动的方法
-(IBAction) small{

    //注意点 : OC 中不能直接 修改 对象的结构体成员,
    // 如果有此类需求, 需要先取出结构体, 修改结构体成员, 在将结构体赋值给对象

    //1.取出 frame 结构体
    CGRect frame = self.mainButton.frame;
    //2.修改结构体中的成员, 宽高减少就是缩小
    frame.size.width -= 10;
    frame.size.height -= 10;
    //3.将结构体设置回 UIButton 对象
    self.mainButton.frame = frame;

}


@end

这里写图片描述




3. UIView 属性 示例


( 1 ) 创建应用并设置

参考本博客 一. 1. 章节, 有创建应用的过程说明 ;

设置大小 : 在 Main.storyboard 选中 UIViewController 打开属性查看器, 调节 Simulated Metrics 中的大小为 IPhone5.5-inch, 这样 Main.storyboard 就会显示成普通 iPhone 的样式;


( 2 ) 需求

需求 :

  • 1.点击按钮, 修改控件颜色;
  • 2.点击按钮修改控件颜色, 这个颜色是一个随机生成的颜色值;
  • 3.使用代码生成 UIView 控件;
  • 4.使用代码生成 UIView 控件, 并设置动画;
  • 5.使用代码生成 UIButton 控件, 并绑定点击事件;


( 3 ) 拖线生成传入 Sender 的方法

拖线生成传入 Sender 的方法:

  • 1.界面中设置 View 控件 : 拖入一个 UIView 控件到界面中, 并打开尺寸查看器, 将其大小修改为 300 x 300 , 放置在中心位置;
    这里写图片描述
  • 2.设置View中的子控件按钮及点击事件 : 将一个按钮控件拖入 UIView 控件中, 修改文字为 改变颜色; 这里尝试一种新的方法来进行按钮点击方法设置;
    • ① 进入辅助编辑器模式 : 一个显示 Main.storyboard, 另一个显示 ViewController.m 文件;
      这里写图片描述
    • ② 拖线关联 : 按住 control 键 不放, 左键按住按钮, 拖到 ViewController.m 代码中;
      这里写图片描述
    • ③ 设置对话框参数 : 在弹出的对话框中设置 方法名称 changeColor, 类型为 UIButton, 事件为 Touch Up Inside, 传入的参数暂时设置为 Sender 这里需要将 按钮本身传回, 用于获取其父控件 ; 点击 Connect 按钮, 就会自动生成方法;
      这里写图片描述
    • ④ 自动生成方法 : 执行上述操作会自动生成与按钮点击事件相关联的方法;
      这里写图片描述


( 4 ) 设置颜色 及 随机颜色值

设置颜色 及 随机 颜色值 :

  • 1.添加按钮 ( 功能 修改父控件背景变颜色 ) :
    • ① 获取父控件 : 根据 按钮 点击方法传入的 按钮控件, 获取其父控件, UIView * superView = sender.superview; ;
    • ② 修改父控件颜色 : 背景颜色的属性是 backgroundColor , 修改该属性即可改变父控件颜色; 代码为 superView.backgroundColor = [UIColor blueColor]; ; 上述代码将父控件背景颜色修改为 蓝色;
  • 2.添加按钮 ( 功能 修改父控件 随机 背景变颜色 ) :
    • ① 添加UIButton控件 : 添加一个 UIButton 控件, 修改标题为 “修改随机颜色” 从控件到 UIViewController.m 中拖线, 点击方传入 Sender , 参数如下设置; 生成的方法为 - (IBAction)changeRandomColor:(UIButton *)sender{} ;
      这里写图片描述
    • ② 获取父控件 : 根据 按钮 点击方法传入的 按钮控件, 获取其父控件, UIView * superView = sender.superview; ;
  • 3.生成随机颜色 : 调用 UIColor 的 colorWithRed:green:blue:alpha 方法, 该方法的参数传入 一个 0 ~ 1 之间的随机值, 类型为 float 类型; alpha 透明度设置为 1;
  • 4.生成 0 ~ 1 之间的随机值 : 这里先生成一个 0 ~ 254 之间的随机值, 使用 C 语言的 arc4random_uniform() 方法, 代码为 arc4random_uniform(255) ; 使用 arc4random_uniform(255) / 255.0 即可 获得一个 0 ~ 1 之间随机 浮点数;
  • 5.完整的随机颜色生成方法 : 
    //2. 获取一个随机颜色
    //   colorWithRed:green:blue:alpha 方法传入的参数取值范围 0 ~ 1 的浮点数
    //   获取 0 ~ 1 之间的随机数, arc4random_uniform(255) 是 C 语言方法, 获取 0 ~ 254 随机值
    //   注意 : 除数要是 float 类型 255.0, 否则两个整型相除会按照整型计算
    float randomRed = arc4random_uniform(255) / 255.0;
    float randomGreen = arc4random_uniform(255) / 255.0;
    float randomBlue = arc4random_uniform(255) / 255.0;
    UIColor * randomColor = [UIColor colorWithRed:randomRed green:randomGreen blue:randomBlue alpha:1];
  • 6.修改父控件的随机背景颜色 : 之前已经获取到了 父控件 superView, 因此修改父控件代码为 superView.backgroundColor = randomColor; ;
  • 7.设置随机颜色值代码 : 
- (IBAction)changeRandomColor:(UIButton *)sender {
    //1. 获取按钮的父控件
    UIView * superView = sender.superview;
    //2. 获取一个随机颜色
    //   colorWithRed:green:blue:alpha 方法传入的参数取值范围 0 ~ 1 的浮点数
    //   获取 0 ~ 1 之间的随机数, arc4random_uniform(255) 是 C 语言方法, 获取 0 ~ 254 随机值
    //   注意 : 除数要是 float 类型 255.0, 否则两个整型相除会按照整型计算
    float randomRed = arc4random_uniform(255) / 255.0;
    float randomGreen = arc4random_uniform(255) / 255.0;
    float randomBlue = arc4random_uniform(255) / 255.0;
    UIColor * randomColor = [UIColor colorWithRed:randomRed green:randomGreen blue:randomBlue alpha:1];

    //3. 修改父控件颜色
    superView.backgroundColor = randomColor;
}


( 5 ) 使用代码生成 UIView 对象

代码生成 View 控件 :

  • 1.添加按钮 : 在 Main.storyboard 中添加一个按钮, 修改按钮文字为 “代码生成UIView控件”, 进入辅助编辑器模式, 按下 control 键不放, 左键拖动按钮到 ViewController.m 中, 在弹出的对话框中进行如下设置; 生成方法 为 - (IBAction)generateView:(UIButton *)sender {} ;
    • ① 拖线过程 : 按住 control 键, 左键拖控件到 代码中;
      这里写图片描述
    • ② 设置按钮绑定的方法 : 名称 generateView, 控件类型为 UIButton, 事件为 Touch Up Inside, 参数为 Sender 即 按钮本身;
      这里写图片描述
  • 2.拖线 将 白色的 UIView 传入 UIViewController.m 中 : 按住 control 不放, 左键拖动 白色的 UIView 控件, 拖动到 ViewController.m 的扩展中;
    这里写图片描述
    • ① 设置控件属性参数 : 设置控件属性名称为 mainView, 引用为 weak 弱引用;
      这里写图片描述
  • 3.创建 UIView 对象 : 首先创建一个 UIView 对象, 代码为 UIView * generateView = [[UIView alloc] init]; ;
  • 4.创建 CGRect 结构体变量 : 使用 CGRectMake 方法创建 CGRect 结构体, CGRectMake(0, 0, 100, 100); ;
  • 5.设置创建的 UIView 对象 backgroundColor 与 frame 属性 : 如果不设置这两个属性, 那么创建的 View 控件就会看不清; 
    //2. 设置 UIView 对像的 颜色值 和 位置大小属性
    generateView.backgroundColor = [UIColor blueColor];
    generateView.frame = CGRectMake(0, 0, 100, 100);
  • 6.添加 UIView 控件到界面中 : 将控件添加到之前设置的 mainView 中, [self.mainView addSubview:generateView]; ;
  • 7.生成 UIView 控件代码 : 
- (IBAction)generateView:(UIButton *)sender {

    //1. 创建 UIView 对象
    UIView * generateView = [[UIView alloc] init];

    //2. 设置 UIView 对像的 颜色值 和 位置大小属性
    generateView.backgroundColor = [UIColor blueColor];
    generateView.frame = CGRectMake(0, 0, 100, 100);

    //3.添加到 mainView 中
    [self.mainView addSubview:generateView];

}
  • 8.最终效果 :
    这里写图片描述


( 6 ) 动画设置 ( 头尾式动画 | Block 动画 )

控件动画设置 :

  • 1.添加触发按钮 : 按住 control 键, 按住鼠标左键拖线 从 UIButton 控件 到 ViewController.m 中, 在弹出的对话框中设置对应参数, 方法名, 控件类型, 参数 等; 生成的代码 - (IBAction)generateMovingView:(UIButton *)sender {} ;
    这里写图片描述
    这里写图片描述
  • 2.头尾式动画 : 头尾式动画用法 ① 开始动画 调用 UIView 的 beginAnimations:context 方法, ② 设置动画的各种属性, 如 设置动画过程 setAnimationDuration, 设置动画延迟 setAnimationDelay, ③ 设置控件的改变, 如 frame 属性的 位置 大小 改变, ④ 提交动画 , [UIView commitAnimations]; 这种头尾式动画 代码量过大, 用法比较少; 
    //头尾式动画, 开始动画, 并设置动画的属性, 很少使用
    [UIView beginAnimations:nil context:nil];
    [UIView setAnimationDuration:2];
    [UIView setAnimationDelay:1];
    generateView.frame = frame;
    [UIView commitAnimations];
  • 3.Block 动画 : 调用 UIView 的 animateWithDuration:animations 方法, 动画改变内容设置在 block 代码块中; 
    //Block 动画, 常用
    [UIView animateWithDuration:2 animations:^{
        generateView.frame = frame;
    }];
  • 4.动画设置代码 : 
- (IBAction)generateMovingView:(UIButton *)sender {

    //1. 创建 UIView 并设置尺寸
    UIView * generateView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 100, 100)];

    //2. 设置 UIView 背景颜色
    generateView.backgroundColor = [UIColor greenColor];

    //3. 将创建的 UIView 添加到 mainView 中去;
    [self.mainView addSubview:generateView];

    //4. 获取 frame 属性, 并修改其位置, 向右移动 100 像素
    CGRect frame = generateView.frame;
    frame.origin.x = 100;

    //5. 头尾式动画, 开始动画, 并设置动画的属性, 很少使用
    /*
    [UIView beginAnimations:nil context:nil];
    [UIView setAnimationDuration:2];
    [UIView setAnimationDelay:1];
    generateView.frame = frame;
    [UIView commitAnimations];
     */

    //5. Block 动画, 常用
    [UIView animateWithDuration:2 animations:^{
        generateView.frame = frame;
    }];

}


( 7 ) 代码生成按钮 ( 创建按钮 | 设置按钮属性 | 绑定事件 )

代码生成按钮 :

  • 1.创建按钮 并设置 frame 属性 : 创建 UIButton 对象, 调用 [UIButton buttonWithType:UIButtonTypeCustom] 创建一个按钮, 同时指定按钮的类型为 Custom 类型, 一般我们使用的按钮类型都是 该类型的 ; 每个控件必须设置 frame 属性, 这里使用 CGRectMake 方法创建一个 CGRect 结构体变量, 代码为 [button setFrame:CGRectMake(0, 0, 100, 100)]; ;
  • 2.设置按钮在不同状态下的内容与颜色 : ① 调用 setTitle:forState 为某个状态指定文字, 这里 [button setTitle:@"普通状态" forState:UIControlStateNormal]; 为普通状态指定文字, [button setTitle:@"按下状态" forState:UIControlStateHighlighted]; 为高亮状态指定文字; ② 调用 setTitleColor:forState 为某种状态指定文字颜色, [button setTitleColor:[UIColor blackColor] forState:UIControlStateNormal]; 为普通状态指定文字颜色, [button setTitleColor:[UIColor redColor] forState:UIControlStateHighlighted]; 为高亮状态指定文字颜色;
  • 3.设置背景图片 : ① 获取图片对象 : 使用 [UIImage imageNamed:@"bg.png"]; 可以获取 UIImage 对象; ② 设置按钮的背景图片属性 [button setBackgroundImage:image forState:UIControlStateNormal]; ;
  • 4.将按钮添加到布局中 : 使用 父控件的 addSubView 方法即可, [self.mainView addSubview:button]; ;
  • 5.为按钮添加点击事件 : 调用 UIButton 的 addTarget 方法为按钮添加点击事件, [button addTarget:self action:@selector(generateButtonThing) forControlEvents:UIControlEventTouchUpInside];, 其中 action 参数设置点击事件名称, forControlEvents 参数设置绑定的按钮事件;
  • 6.代码生成按钮的代码内容 : 
//生成一个按钮并绑定事件
- (IBAction)generateButton:(UIButton *)sender {

    //1.创建 UIButton 按钮, 创建按钮时需要制定按钮的 Type 类型, 一般情况下使用 Custom 类型, 并设置图片的 frame 属性
    UIButton * button = [UIButton buttonWithType:UIButtonTypeCustom];
    [button setFrame:CGRectMake(0, 0, 100, 100)];

    //2.设置按钮的文字内容 与 文字样式
    [button setTitle:@"普通状态" forState:UIControlStateNormal];
    [button setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
    [button setTitle:@"按下状态" forState:UIControlStateHighlighted];
    [button setTitleColor:[UIColor redColor] forState:UIControlStateHighlighted];

    //3. 设置普通状态的背景图片, 如果图片后缀是 png 或 jpg 格式, 可以只写图片名称
    UIImage * image = [UIImage imageNamed:@"bg.png"];
    [button setBackgroundImage:image forState:UIControlStateNormal];

    //4. 将按钮添加到 mainView 中
    [self.mainView addSubview:button];

    //5. 为按钮添加点击事件
    [button addTarget:self action:@selector(generateButtonThing) forControlEvents:UIControlEventTouchUpInside];

}

- (void) generateButtonThing{
    NSLog(@"generateButtonThing");
}


( 8 ) 本模块的完整代码

完整代码 : 

//
//  ViewController.m
//  4.UIViewColor
//
//  Created by octopus on 18/6/11.
//  Copyright © 2018年 han. All rights reserved.
//

#import "ViewController.h"

@interface ViewController ()

@property (weak, nonatomic) IBOutlet UIView *mainView;

@end

@implementation ViewController

//修改 按钮牛所在的 父控件 View 控件颜色
- (IBAction)changeColor:(UIButton *)sender {
    //1. 获取按钮的父控件
    UIView * superView = sender.superview;
    //2. 修改父控件颜色
    superView.backgroundColor = [UIColor blueColor];
}


- (IBAction)changeRandomColor:(UIButton *)sender {
    //1. 获取按钮的父控件
    UIView * superView = sender.superview;
    //2. 获取一个随机颜色
    //   colorWithRed:green:blue:alpha 方法传入的参数取值范围 0 ~ 1 的浮点数
    //   获取 0 ~ 1 之间的随机数, arc4random_uniform(255) 是 C 语言方法, 获取 0 ~ 254 随机值
    //   注意 : 除数要是 float 类型 255.0, 否则两个整型相除会按照整型计算
    float randomRed = arc4random_uniform(255) / 255.0;
    float randomGreen = arc4random_uniform(255) / 255.0;
    float randomBlue = arc4random_uniform(255) / 255.0;
    UIColor * randomColor = [UIColor colorWithRed:randomRed green:randomGreen blue:randomBlue alpha:1];

    //3. 修改父控件颜色
    superView.backgroundColor = randomColor;
}

- (IBAction)generateView:(UIButton *)sender {

    //1. 创建 UIView 对象
    UIView * generateView = [[UIView alloc] init];

    //2. 设置 UIView 对像的 颜色值 和 位置大小属性
    generateView.backgroundColor = [UIColor blueColor];
    generateView.frame = CGRectMake(0, 0, 100, 100);

    //3.添加到 mainView 中
    [self.mainView addSubview:generateView];

}

- (IBAction)generateMovingView:(UIButton *)sender {

    //1. 创建 UIView 并设置尺寸
    UIView * generateView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 100, 100)];

    //2. 设置 UIView 背景颜色
    generateView.backgroundColor = [UIColor greenColor];

    //3. 将创建的 UIView 添加到 mainView 中去;
    [self.mainView addSubview:generateView];

    //4. 获取 frame 属性, 并修改其位置, 向右移动 100 像素
    CGRect frame = generateView.frame;
    frame.origin.x = 100;

    //5. 头尾式动画, 开始动画, 并设置动画的属性, 很少使用
    /*
    [UIView beginAnimations:nil context:nil];
    [UIView setAnimationDuration:2];
    [UIView setAnimationDelay:1];
    generateView.frame = frame;
    [UIView commitAnimations];
     */

    //5. Block 动画, 常用
    [UIView animateWithDuration:2 animations:^{
        generateView.frame = frame;
    }];

}

//生成一个按钮并绑定事件
- (IBAction)generateButton:(UIButton *)sender {

    //1.创建 UIButton 按钮, 创建按钮时需要制定按钮的 Type 类型, 一般情况下使用 Custom 类型, 并设置图片的 frame 属性
    UIButton * button = [UIButton buttonWithType:UIButtonTypeCustom];
    [button setFrame:CGRectMake(0, 0, 100, 100)];

    //2.设置按钮的文字内容 与 文字样式
    [button setTitle:@"普通状态" forState:UIControlStateNormal];
    [button setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
    [button setTitle:@"按下状态" forState:UIControlStateHighlighted];
    [button setTitleColor:[UIColor redColor] forState:UIControlStateHighlighted];

    //3. 设置普通状态的背景图片, 如果图片后缀是 png 或 jpg 格式, 可以只写图片名称
    UIImage * image = [UIImage imageNamed:@"bg.png"];
    [button setBackgroundImage:image forState:UIControlStateNormal];

    //4. 将按钮添加到 mainView 中
    [self.mainView addSubview:button];

    //5. 为按钮添加点击事件
    [button addTarget:self action:@selector(generateButtonThing) forControlEvents:UIControlEventTouchUpInside];

}

- (void) generateButtonThing{
    NSLog(@"generateButtonThing");
}



@end

猜你喜欢

转载自blog.csdn.net/han1202012/article/details/80245578
今日推荐
开源日报 | Chrome内置Gemini的意义不在于Gemini；中国AI追随之路的五大误区；ECharts创始人“下海”养鱼；谷歌I/O开发者大会什么都有，只是没有惊喜
微软回应中国区AI团队“打包赴美”传闻
基于大语言模型的开源知识库问答系统 MaxKB GitHub Star 数量突破 5,000 个！
美国拟限制 AI 大模型出口中国和俄罗斯
苹果将与 OpenAI 达成协议，将 ChatGPT 应用于 iPhone
openKylin 社区生态委员会第六次会议圆满召开
阿里云正式发布通义千问 2.5
Python 3.13 发布首个 Beta：实验性自由线程模式和 JIT、改进交互式解释器
Stack Overflow 拿我的代码去训练 AI 大模型，还封了我的账号
Pop!_OS 的 COSMIC 桌面完成 App Store 上架工作
《2024 年一季度互联网投融资运行情况》研究报告
报告：Django 仍然是 74% 开发者的首选
周排行
返回指定时间格式
fopen函数中的mode参数
Java 单例模式探讨
Flex remoteobject工作原理探讨
寻找mplayer的便捷安装方法
30天了解30种技术系列---(26)MySQL自动化运维工具Inception
关于Jboss/Tomcat/Jetty的JNDI定义123
程序减肥，strip，eu-strip 及其符号表
AsyncTask、View.post(Runnable)、ViewTreeObserver三种方式总结frame animation自动启动
Json和Bean的互相转换
每日归档
更多
2024-05-15(24)
2024-05-14(0)
2024-05-13(18)
2024-05-12(0)
2024-05-11(38)
2024-05-10(38)
2024-05-09(35)
2024-05-08(42)
2024-05-07(14)
2024-05-06(40)

代码天地 © 2018 codetd.com

境外服务器   最新电视剧2022