SwiftUI 文本框TextField添加清除按钮
创始人
2024-05-22 10:38:13
0

这里写自定义目录标题

    • 前言/背景
    • 实现
    • 参考

前言/背景

使用SwiftUI框架,希望在文本框TextField控件中输入内容后显示一个清除按钮,可以清空内容,像这样:
在这里插入图片描述

UIKit 框架的 UITextField可以配置clearButtonMode,但是SwiftUI框架里的TextField没有这个,需要自己实现。
IOS开发我不熟悉,也没花时间去细学,本解决方案来自 stackoverflow

建议多使用英文技术网站,这么简单一个问题我在中文网站搜了好久都没找到,要么文不对题要么需要付费(不是说不尊重别人的知识,只是就这么点东西~)
如果stackoverflow打开总是提示人机验证但是又没有可操作的图片或按钮那就是由于某些大家都熟知的原因没加载完全,参考Google 人机验证(reCaptcha)无法显示解决方案
可以解决。
如果英文不会,用关键字即可,例如 [ SwiftUI TextField clear button],这也比百度上啃哧吭哧搜好得多。

实现

  1. 新建一个swiftUI文件,创建一个clearButton组件,注意实现ViewModifier协议;以及使用ZStack来将按钮放在框内。
struct ClearButton: ViewModifier
{@Binding var text: Stringpublic func body(content: Content) -> some View{ZStack(alignment: .trailing){contentif !text.isEmpty{Button(action:{self.text = ""}){Image(systemName: "delete.left").foregroundColor(Color(UIColor.opaqueSeparator))}.padding(.trailing, 8)}}}
}
  1. 在TextField处添加对clearButton的使用
struct TestView : View {@Binding var label: Stringvar body: some View {VStack {TextField("951405", text: $label).textFieldStyle(.roundedBorder) // 圆角边框.modifier(TextFieldClearButton(text: $label)) //使用clearbutton}}
}

参考

[1] https://stackoverflow.com/questions/58200555/swiftui-add-clearbutton-to-textfield
[2] https://sanzaru84.medium.com/swiftui-how-to-add-a-clear-button-to-a-textfield-9323c48ba61c

相关内容

热门资讯

安卓子系统windows11,... 你知道吗?最近科技圈可是炸开了锅,因为安卓子系统在Windows 11上的兼容性成了大家热议的话题。...
电脑里怎么下载安卓系统,电脑端... 你有没有想过,你的电脑里也能装上安卓系统呢?没错,就是那个让你手机不离手的安卓!今天,就让我来带你一...
索尼相机魔改安卓系统,魔改系统... 你知道吗?最近在摄影圈里掀起了一股热潮,那就是索尼相机魔改安卓系统。这可不是一般的改装,而是让这些专...
安卓系统哪家的最流畅,安卓系统... 你有没有想过,为什么你的手机有时候像蜗牛一样慢吞吞的,而别人的手机却能像风一样快?这背后,其实就是安...
安卓最新系统4.42,深度解析... 你有没有发现,你的安卓手机最近是不是有点儿不一样了?没错,就是那个一直在默默更新的安卓最新系统4.4...
android和安卓什么系统最... 你有没有想过,你的安卓手机到底是用的是什么系统呢?是不是有时候觉得手机卡顿,运行缓慢,其实跟这个系统...
平板装安卓xp系统好,探索复古... 你有没有想过,把安卓系统装到平板上,再配上XP系统,这会是怎样一番景象呢?想象一边享受着安卓的便捷,...
投影仪装安卓系统,开启智能投影... 你有没有想过,家里的老式投影仪也能焕发第二春呢?没错,就是那个曾经陪你熬夜看电影的“老伙计”,现在它...
安卓系统无线车载carplay... 你有没有想过,开车的时候也能享受到苹果设备的便利呢?没错,就是那个让你在日常生活中离不开的iOS系统...
谷歌安卓8系统包,系统包解析与... 你有没有发现,手机更新换代的速度简直就像坐上了火箭呢?这不,最近谷歌又发布了安卓8系统包,听说这个新...
微软平板下软件安卓系统,开启全... 你有没有想过,在微软平板上也能畅享安卓系统的乐趣呢?没错,这就是今天我要跟你分享的神奇故事。想象你手...
coloros是基于安卓系统吗... 你有没有想过,手机里的那个色彩斑斓的界面,背后其实有着一个有趣的故事呢?没错,我要说的就是Color...
安卓神盾系统应用市场,一站式智... 你有没有发现,手机里的安卓神盾系统应用市场最近可是火得一塌糊涂啊!这不,我就来给你好好扒一扒,看看这...
黑莓平板安卓系统升级,解锁无限... 亲爱的读者们,你是否还记得那个曾经风靡一时的黑莓手机?那个标志性的全键盘,那个独特的黑莓体验,如今它...
安卓文件系统采用华为,探索高效... 你知道吗?最近安卓系统在文件管理上可是有了大动作呢!华为这个科技巨头,竟然悄悄地给安卓文件系统来了个...
深度系统能用安卓app,探索智... 你知道吗?现在科技的发展真是让人惊叹不已!今天,我要给你揭秘一个超级酷炫的话题——深度系统能用安卓a...
安卓系统的分区类型,深度解析存... 你有没有发现,你的安卓手机里藏着不少秘密?没错,就是那些神秘的分区类型。今天,就让我带你一探究竟,揭...
安卓系统铠无法兑换,揭秘无法兑... 最近是不是有很多小伙伴在玩安卓系统的游戏,突然发现了一个让人头疼的问题——铠无法兑换!别急,今天就来...
汽车安卓系统崩溃怎么刷,一键刷... 亲爱的车主朋友们,你是否曾遇到过汽车安卓系统崩溃的尴尬时刻?手机系统崩溃还能重启,但汽车系统崩溃了,...
miui系统可以刷安卓p系统吗... 亲爱的手机控们,你是否对MIUI系统情有独钟,同时又对安卓P系统的新鲜功能垂涎欲滴?今天,就让我带你...