按钮事件触发内容更新

简介

iOS开发小白教程,今天给大家介绍如何创建按钮事件(比如点击按钮),来触发更新内容(比如让文本框内容发生改变;高级一点,点按钮,从网络上下载一个文本更新到内容展示容器中)

Xcode 强大的助理模式

小白们记住了,XCode 13 为例,这个编辑器的助理模式,非常重要。它可以简化我们拖拽元素,创建绑定到代码里面,比如给按钮加上事件监听,我们点按钮,触发一个动作Action,这个Action方法映射到代码层面,可以做很多事,比如修改TextView的内容。

我们创建一个IOS APP项目,参考以下图片

选择Objective-C 和Storyboard

 

Objective-C 是传统编程语言,老一点,但是很稳定。大部分应用之前都是用Objective-C开发的,学会了它,你啥活都能干。

Storyboard是 简化的开发方式,你可以理解为蓝图,你可以用可视化的开发方式,拖拖拽拽,页面元素很快就搭建好了,一个丰富多彩的App 应用界面,就出来了。

创建之后,默认你会看到一些文件会生成好。

我们框中最重要的三个文件,一个是Main.storyboard, 你可以理解为你app的设计蓝图。就是右边可视化区域你所看到的。

ViewController.h是头文件,所有的函数定义,都在头文件里面。这是主视图控制器。我们是从0开始创建的项目,所以我们至少有,且有一个ViewController。

ViewController.m是主视图控制器实现代码。

我们参照上图,先给Storyboard 加上两个元素,一个TextView,一个Button

我们要做的功能,就是点Button,改变TextView的显示值。

在Storyboard编辑器窗口,点击编辑器上方的➕号,新增元素

我们加一个TextView,一个button

好,我们点开Editor的Assistant 助理模式,你会看到左右分屏的编辑器窗口,左边是可视化界面,右边是编辑器,显示的是代码

我们先点编辑器上方的面包屑导航,切换到ViewController.h, 我们在左边可视化窗口,选中TextView元素,按住Ctrl键不放,点击鼠标左键,拖放到右边的代码区域 
@interface ViewController : UIViewController 的下面

你会看到弹出窗口,给元素取个名字,比如叫textJoke, 点Connect之后,编辑器代码自动多了一行

好,下面我们再点面包屑导航,切换到ViewController.m,拖一个按钮到viewDidLoad下面

 

注:如果你交换过Command键和Control键,那么就是按Command键,windows 键盘,就是Win键。

好,接下来我们加点代码

#import "ViewController.h"

@interface ViewController ()

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view.
}
- (IBAction)btnClick:(id)sender {
    _textJoke.text = @"Hello world";
    NSLog(@"button clicked");
}
@end

 

到这里,基本的操作就完成了。点运行试试。如果没有异常,你在预览的应用界面,点击按钮,应该会显示Hello world在TextView的位置。

如果遇到问题,欢迎反馈给我,我好修正教程。

到这里,你就学会了基本的App交互操作。你可以加入更多的按钮,实现不同的功能。

比如做一个计算器?

如果事件绑定出问题了,也可以解决问题。比如移除绑错的事件监听。

分类: 默认 标签: 发布于: 2021-12-01 11:58:39, 更新于: 2021-12-01 12:15:34