swift UI专项训练18 ToolBar工具条

简介:    工具条是个很重要的内容,什么是工具条呢,它一般显示在屏幕下方,显示一些按钮或者文字,我们可以用系统现成的,也可以用我们自定义的。

   工具条是个很重要的内容,什么是工具条呢,它一般显示在屏幕下方,显示一些按钮或者文字,我们可以用系统现成的,也可以用我们自定义的。之前我们讲的都是需要代理模式的,Dlelegate,委托模式。ToolBar属于目标操作,不需要代理。网界面上拖一个Toolbar拖到界面底部。


toolbar的元素如下:


Style主要是设置样式,比如浅色和黑色的。

Bar Tint是设置颜色。

Item是工具栏上的按钮,跟导航栏很相似。我们可以选择系统中已有的,比如我们选择done


那么toolbar上的按钮就会变成这样:


       样式非常多,大家可以试试。工具条的行为就比较特殊了,它不是代理,它是目标操作,那么目标是谁,操作是什么。现在来体验一下,老规矩,把组件和控制器连线。不需要委托,那么可以在控制器中直接进行操作.现在我准备把工具条设置两个按钮,一左一右,左边的是删除按钮:

var trashItem : UIBarButtonItem {
    return UIBarButtonItem(barButtonSystemItem: .Trash, target: self, action: "trashclick:")
    }
    
    
    func trashclick(barItem: UIBarButtonItem) {
    println("您按了删除")
    }



target就是目标,而action就是操作。action中使用了注册,所以transhclick后面要跟着冒号,使用的系统样式是Trash,这是系统自带的是一个垃圾桶的样式。

再添加一个分享按钮,代码类似:

var shareItem : UIBarButtonItem {
        return UIBarButtonItem(barButtonSystemItem: .Reply, target: self, action: "shareclick:")
    }
    
    
    func shareclick(barItem:UIBarButtonItem) {
        println("您按了分享")
    }



再在两个按钮间加一个空格,不需要代理和操作:

var spaceItem : UIBarButtonItem {
        return UIBarButtonItem(barButtonSystemItem: .FlexibleSpace, target: nil, action: nil)
    }

现在我们定义一个初始化按钮的方法:

func configToolbar(){
    let items = [
        trashItem,spaceItem,shareItem
        ]
    toolbar1.setItems(items, animated: true)
    }

别忘了最后在viewdidload方法中加上我们上面定义的方法,现在运行来看一下效果:



效果如图,如果中间没有加那个空格的话这两个按钮就挨在一起了。我们点击一下删除按钮,试试效果:


好的证明我们实现了。

目录
相关文章
|
Linux 测试技术
Linux基础项目开发1:量产工具——UI系统(五)
Linux基础项目开发1:量产工具——UI系统(五)
186 0
Linux基础项目开发1:量产工具——UI系统(五)
|
Cloud Native 数据可视化 数据安全/隐私保护
云原生之部署Docker可视化管理工具docker.ui
云原生之部署Docker可视化管理工具docker.ui
834 2
|
数据处理
「Mac畅玩鸿蒙与硬件45」UI互动应用篇22 - 评分统计工具
本篇将带你实现一个评分统计工具,用户可以对多个选项进行评分。应用会实时更新每个选项的评分结果,并统计平均分。这一功能适合用于问卷调查或评分统计的场景。
418 65
「Mac畅玩鸿蒙与硬件45」UI互动应用篇22 - 评分统计工具
不要再责怪你的UI设计师为什么没有用rp?ps?figma?sketch?xd?如何免费转换非在线工具收费转换-本文将教会你常规ui设计源文件格式相互之间如何转换并且保持矢量图和标注注释问题-优雅草央千澈
不要再责怪你的UI设计师为什么没有用rp?ps?figma?sketch?xd?如何免费转换非在线工具收费转换-本文将教会你常规ui设计源文件格式相互之间如何转换并且保持矢量图和标注注释问题-优雅草央千澈
539 1
|
编解码 Android开发
【Android Studio】使用UI工具绘制,ConstraintLayout 限制性布局,快速上手
本文介绍了Android Studio中使用ConstraintLayout布局的方法,通过创建布局文件、设置控件约束等步骤,快速上手UI设计,并提供了一个TV Launcher界面布局的绘制示例。
477 1
30行代码实现一个带UI界面的图片背景移除工具:并附带web网页
人工智能技术正处于蓬勃发展中,移除图片背景的方法众多,涵盖了各式各样的实现途径和模型。然而,这些方法往往在安装和配置环境方面稍显复杂。今天,介绍一种极其简便的方法——大约30行代码,就能实现这一功能。虽然相比之下可能稍显简单,但对于不太苛刻的需求来说,这种方法颇为方便实用。
|
测试技术 Swift iOS开发
探索iOS自动化测试:使用Swift编写UI测试
【8月更文挑战第31天】在软件开发的海洋中,自动化测试是保证船只不偏离航线的灯塔。本文将带领读者启航,深入探索iOS应用的自动化UI测试。我们将通过Swift语言,点亮代码的灯塔,照亮测试的道路。文章不仅会展示如何搭建测试环境,还会提供实用的代码示例,让理论知识在实践中生根发芽。无论你是新手还是有经验的开发者,这篇文章都将是你技能提升之旅的宝贵指南。
|
消息中间件 Kafka Linux
Kafka【付诸实践 03】Offset Explorer Kafka 的终极 UI 工具安装+简单上手+关键特性测试(一篇学会使用 Offset Explorer)
【2月更文挑战第21天】Kafka【付诸实践 03】Offset Explorer Kafka 的终极 UI 工具安装+简单上手+关键特性测试(一篇学会使用 Offset Explorer)
2494 2
|
Kubernetes 监控 IDE
K8S 实用工具之三 - 图形化 UI Lens
K8S 实用工具之三 - 图形化 UI Lens
|
Kubernetes 监控 Shell
K8S 实用工具之二 - 终端 UI K9S
K8S 实用工具之二 - 终端 UI K9S