IOS 初级开发入门教程（四）基础控件使用小练习

╰+哭是因爲堅強的太久メ 2021-09-15 00:48 317阅读 0赞

# 前言 #

> 看完前面3章的内容，基本对IOS开发有一些认识了，这章我们开始动手去实践做点小练习，学习如何创建并设置标签和按钮（Label & Button）的相关属性，以及通过一个交互式的案例演示动作和输出口的使用。

系列文章：

[IOS 初级开发入门教程（一）介绍篇][IOS]

[IOS 初级开发入门教程（二）第一个HelloWorld工程及StoryBoard使用][IOS _HelloWorld_StoryBoard]

[IOS 初级开发入门教程（三）探究应用及视图的生命周期变化][IOS 1]

## 创建Swift新项目 ##

![Image 1][]

## 使用Label和Button ##

![Image 1][]

1、先打开 Main.storyboard，看到视图后。

2、在工具右下方各种库模块中找到第三个选项。

3、在搜索框里搜索Label 和 Button 。

4、拖拽到视图上，并双击可编辑文本。

## 设置属性模块 ##

![Image 1][]

展开  Type 下拉列表，可以选择很多按钮类型，其中，各项含义如下：

*  Custom：自定义类型。如果我们不喜欢圆角按钮，可以使用此类型。
 *  System：系统默认属性，表示该按钮没有边框。在iOS 7之前，按钮默认为圆角矩形。
 *  Detail Disclosure：细节展示按钮（一个圈，里面一个字母i），主要用于表视图中的细节展示。
 *  Info Light和Info Dark：信息按钮，表示有一些信息需要展示，或者有可以设置的内容。
 *  Add Contact：添加联系人按钮（一个圈，里面一个＋）。

Drawing 绘画属性，其中 Shows Touch On Highlight 默认不勾选，是按钮点击高亮效果。

## 点击Button改变Label文本 ##

1、首先打开图文编辑界面。

![Image 1][]

2、点击代码界面左上角的菜单选项可以选择要编写代码页面。

![Image 1][]

3、按住 control 键 拖拽Label到代码界面后命名。（图中代码无需手打，是自动生成的。）

![Image 1][]

![Image 1][]

4、按Control键拖button，设置Action事件。

![Image 1][]

这个一定要注意，第一个选项选择Action。然后命名和设置Type类型。

5、最后我们在定义的Onclick方法中写代码逻辑，这里写改变Label文本为：HelloWorld。

最后注意：个人一个小经验总结，可以观察控件的绑定情况。

首先查看代码界面，可以发现被绑定的方法代码左边会有实心原点，如图：

![Image 1][]

然后，我们右键打开控件标签的属性观察，如图：

![Image 1][]

## 运行结果 ##

![Image 1][]

[IOS]: http://blog.csdn.net/csdn_aiyang/article/details/77480907
[IOS _HelloWorld_StoryBoard]: http://blog.csdn.net/csdn_aiyang/article/details/77506057
[IOS 1]: http://blog.csdn.net/csdn_aiyang/article/details/77481653
[Image 1]:

发表评论取消回复

表情：

评论列表（有 0 条评论，317人围观）

还没有评论，来说两句吧...

相关阅读

相关使用mpvue开发小程序教程（四）

*【原文地址】**mpvue入门系列教程： * [如何在mpvue中正确的引用小程序的原生自定义组件][mpvue] * [使用mpvue开发小程序教程（六）]...

骑猪看日落/ 2024年04月17日 05:32/ 0 赞/ 73 阅读

相关 Qt入门教程：基础控件篇 - QMainWindow 主窗口

Qt入门教程：基础控件篇 - QMainWindow 主窗口 Qt 是一种跨平台的 C++ 应用程序开发框架，提供了大量的易于使用的控件与工具类，方便开发者开发跨平台的应用程

小灰灰/ 2024年03月23日 10:30/ 0 赞/ 65 阅读

相关 ios开发基础控件笔记

1、oc前缀NS 2、使用storyboard搭建界面时与界面相关的控件变量类型是IBOutlet，方法是IBAction。CG前缀（位置等物理信息） 3、为按钮添加相应响

短命女/ 2022年08月20日 13:15/ 0 赞/ 203 阅读

相关 swiper如何实现动画效果-小练习初级入门

下面来写一个使用swiper的Animate 实现动画效果的小练习 1.同样在Hbuilder新建一个项目 2.在css文件夹下放入下载好的swiper-3.4

水深无声/ 2022年06月10日 04:42/ 0 赞/ 456 阅读

相关使用mpvue开发小程序教程（四）

[在上一章节中][Link 1]，我们将`vue-cli`命令行工具生成的代码骨架中的src目录清理了一遍，然后从头开始配置和编写了一个可以运行的小程序页面，算是正真走上了使用

悠悠/ 2022年02月26日 02:16/ 0 赞/ 308 阅读

相关 IOS 初级开发入门教程 (六) Switch、Slider、Segmented、Progress练习

前言 > 看完前面5章的内容，基本对IOS开发有一些认识了，这章我们继续动手去实践一下，学习开关、拖动、分段控制、进度条的相关知识，以及通过一个交互式的案例演示如何使

梦里梦外;/ 2021年09月15日 04:10/ 0 赞/ 343 阅读

相关 IOS 初级开发入门教程（五）TextField与ReturnKey实战练习

前言 > 看完前面4章的内容，基本对IOS开发有一些认识了，这章我们继续动手去实践一下，学习文本和键盘的相关知识，以及通过一个交互式的案例演示文本与键盘的

淩亂°似流年/ 2021年09月15日 04:10/ 0 赞/ 365 阅读

相关 IOS 初级开发入门教程（四）基础控件使用小练习

前言 > 看完前面3章的内容，基本对IOS开发有一些认识了，这章我们开始动手去实践做点小练习，学习如何创建并设置标签和按钮（Label & Button）的相关属性，

╰+哭是因爲堅強的太久メ/ 2021年09月15日 00:48/ 0 赞/ 318 阅读

相关 IOS 初级开发入门教程（二）第一个HelloWorld工程及StoryBoard使用

前言在IOS开发之路的博文第一章：[(IOS开发入门介绍http://blog.csdn.net/csdn\_aiyang）][IOS_http_blog.csdn

ゝ一世哀愁。/ 2021年09月14日 03:26/ 0 赞/ 480 阅读

相关 IOS 初级开发入门教程（一）介绍篇

导读目前移动端开发市场上引导开发者追求技多不压身，一个全栈开发者至少要懂后台服务器、数据库、Android、web、ios开发等。“一超多强”是指开发

落日映苍穹つ/ 2021年09月14日 03:22/ 0 赞/ 467 阅读