首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

SwiftUI 3按钮-一次只能切换一个按钮

SwiftUI是一种用于构建用户界面的声明式框架,由苹果公司推出。它简化了界面的创建和管理过程,提供了一种直观且高效的方式来构建跨平台的应用程序。

SwiftUI 3按钮是指在SwiftUI中创建的一组按钮,其中每次只能选择一个按钮。这种按钮通常被称为单选按钮或开关按钮,用于在多个选项中进行选择。

SwiftUI提供了一个名为Toggle的视图,可以用来创建开关按钮。通过设置isOn属性,可以控制按钮的选中状态。当isOntrue时,按钮被选中;当isOnfalse时,按钮未选中。

以下是一个示例代码,演示如何创建一个SwiftUI 3按钮:

代码语言:txt
复制
import SwiftUI

struct ContentView: View {
    @State private var selectedButton: Int = 0
    
    var body: some View {
        VStack {
            Button(action: {
                self.selectedButton = 0
            }) {
                Text("Button 1")
                    .padding()
                    .background(selectedButton == 0 ? Color.blue : Color.gray)
                    .foregroundColor(.white)
                    .cornerRadius(10)
            }
            
            Button(action: {
                self.selectedButton = 1
            }) {
                Text("Button 2")
                    .padding()
                    .background(selectedButton == 1 ? Color.blue : Color.gray)
                    .foregroundColor(.white)
                    .cornerRadius(10)
            }
            
            Button(action: {
                self.selectedButton = 2
            }) {
                Text("Button 3")
                    .padding()
                    .background(selectedButton == 2 ? Color.blue : Color.gray)
                    .foregroundColor(.white)
                    .cornerRadius(10)
            }
        }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

在上述示例中,我们使用@State属性包装了selectedButton变量,以便在按钮点击时更新选中状态。每个按钮都有一个action闭包,当按钮被点击时,会更新selectedButton的值。根据selectedButton的值,我们可以为选中的按钮应用不同的样式。

这是一个简单的示例,你可以根据实际需求进行扩展和定制。在实际应用中,SwiftUI的按钮可以用于各种场景,例如选项卡切换、设置界面中的开关选项等。

腾讯云提供了云原生相关的产品和服务,可以帮助开发者构建和管理云原生应用。你可以参考以下链接了解更多关于腾讯云的云原生产品和服务:

请注意,以上链接仅供参考,具体的产品选择应根据实际需求和情况进行评估。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

iOS 单选按钮组--只能而且必选一个按钮

在iOS开发中有时我们会用到这种单选按钮组,只能而且必选一个按钮, ? 屏幕快照 2016-08-30 13.53.43.png ?...屏幕快照 2016-08-30 13.53.37.png 其实也非常简单 **1、定于两个属性按钮** @property (nonatomic, strong) UIButton * sinaButton...; @property (nonatomic, strong) UIButton * bankButton; 2、初始化并默认一个选项,这里用了4个button,实际可以采用2个,因为写一半才发现后面的汉字也要设置成可点的...bankAction:) forControlEvents:(UIControlEventTouchUpInside)]; [self.view addSubview:banknameSelete]; // 先默认一个选项..._sinaButton.selected = YES; 3、通过点击事件做逻辑处理,不要混乱 - (void)sinaAction:(UIButton *)button { if (_sinaButton.selected

4.4K20

css3一个会动的菜单 menu 按钮动画效果

css3一个会动的菜单 menu 按钮动画效果 需要做一个会的动画按钮效果,小前端部知道如何实现,我看了一眼需要的效果,给他写了一个简单的 demo。...设计师给了俩图片,一个是 三 这样的菜单图标,另一个是点击时,变成 X 的图标。希望在这两个图标之间,有动画切换效果。...transition: all 0.15s ease-in-out; 这样的代码,那么当他的任何属性发生变化的时候,都会有切换效果。...更多内容请参考 CSS3 transition 属性 因为有三个横线,所以 :before 和 :after 两个伪元素还不够。我不愿意再去额外添加一个元素,使有更多的东西可以控制。...更多内容,请参考 CSS3 transform 属性 最终实现效果如下: ? 好,效果就实现了。上面的动画我是放到切换实现3秒,为的是看清楚动画细节效果。

2.1K100

面向所有人的 UI 编程 :透过点按弹窗初尝 SwiftUI

本文我将用如下图中的一个例子来展示如何设置点按弹窗。下图中程序的功能很简单:长按这句名言后,会出现点按弹窗,你可以点击复制按钮将这句话复制到系统剪贴板中。 ? 试想你是一名美术,完全不了解程序。...而点按菜单,顾名思义,就是一个按钮,那么我们设置一个 Button View。...在按钮中,我们需要设置两个点:按钮的动作,也就是 action,里面的两行代码会将名言文字复制到剪贴板;另一个点是下面的 HStack ,表示一个水平排列的 View。...因为我写文章的时候已经是晚上了,手机自动切换到了夜间模式,我们的应用程序也完成了自动切换。这是如何做到的呢?我会在其它文章中详细讲解。...若你因为文中的长代码而感到害怕,觉得程序员都是天才,脑子超好用能将这些代码一次性全写出来,不是这样的。比如上面代码中的例子,一开始你只有一个简单的思路,我要一句名言,能点按复制就行。

2.1K40

SwiftUI 4.0 的全新导航系统

但是无论是切换动画、编程式 API 接口等多方面都与 NavigationStack 明显不同。因此对于支持多硬件平台的应用来说,最好针对不同的场景分别使用对应的导航控件。..., value: 3) NavigationLink("SubView4", value: 4) } // 只能响应序列元素类型...NavigationSplitView 如果说 NavigationStack 是在三维的空间里堆叠视图,那么 NavigationSplitView 便是在二维的空间中于不同的栏之间动态切换视图。...详情请参阅 在 SwiftUI 下对 iPad 进行适配[3] NavigationSpiteView 已经解决了上述问题,它现在可以同 NavigationStack 进行完美的合作。...动态控制多栏显示状态 另一个之前困扰多栏 NavigationView 的问题就是,无法通过编程的手段动态地控制多栏显示状态。

10.2K62

SwiftUI 之 HStack 和 VStack 的切换

想了解更多信息,可以查看我的文章 - SwiftUI 布局系统第三章 目前,我们的按钮是垂直排列的,并且填满了水平线上的可用空间(你可以用以上示例代码预览按钮的样子),虽然这在竖向的 iPhone 上看起来很好...虽然可以在 LoginActionsView 中放入该逻辑,但我们希望以后能复用代码,因此需要重新创建一个专门的视图,作为一个独立的组件来实现动态堆栈的切换逻辑。...然而,就像上面的代码展示的那样,使用 GeometeryReader 来展示动态切换一个相当明显的缺点,在几何图形阅读器中总是会填充水平和垂直方向的所有可用空间(以便测量实际空间)。...Xcode 14 的一部分仍在测试阶段) 其中一个工具是新的 Layout 协议,它既能让我们创建完整的自定义布局,直接集成到 SwiftUI 的布局系统中,同时也提供给我们一种更丝滑更动画的方式在各种布局之间动态切换...这样做会令动画更流畅,例如在切换设备方向时,我们也有可能在执行此类更改时获得小幅的性能提升(因为 SwiftUI 总是在其视图层次结构为静态时尽可能表现最佳) 选择合适的视图 但我们还没有结束,因为

2.8K10

SwiftUI数据流之State&Binding

你不能在外部改变 @State 的值,只能@State初始化时,设置初始化值,如注释1处所示,它的所有相关操作和状态改变都应该是和当前 View 生命周期保持一致。...@State检测的是值类型 值类型仅有独立的拥有者,而class类型可以多个指向一个;对于两个SwiftUI View而言,即使发送给他们两个相同的struct对象,事实上他们每个View都得到了一份独立的...子视图FilterView中定义了@Binding var showFavorited: Bool引用传入参数 注释4,当切换开关后,由于@Binding机制的作用,会修改外层的单一数据源(single...修饰的属性的它的所有相关操作和状态改变都应该是和当前视图生命周期保持一致,当视图没有被初始化完成时,无法完成状态属性和视图之间的绑定关系;_location不在是nil,其中保存了众多标记视图唯一性的信息,这里没有全部展示出来; 再点击一次...Count+1按钮,count值变为2,user的地址将持续保持不变,生命周期与视图保持一致。

4K30

SwiftUI TextField 进阶 —— 事件、焦点、键盘

没有为 TextField 提供获得焦点的方法(例如:becomeFirstResponder),因此在相当长的时间里,开发者只能通过非 SwiftUI 的方式来实现类似的功能。...基础用法 SwiftUI 提供了一个新的 FocusState 属性包装器,用来帮助我们判断该视图内的 TextField 是否获得焦点。...在多个的 TextFiled 之间切换焦点 通过使用 focused 和 onSubmit 的结合,我们可以实现当用户在一个 TextField 中输入完成后(点击return),自动让焦点切换到下一个...使用快捷键获得焦点 当一个视图中有多个 TextField(包括 SecureField)时,我们可以直接使用Tab键按顺序在 TextField 中切换焦点,但 SwiftUI 并没有直接提供使用快捷键让某个...相信再有 2-3 年,SwiftUI 的主要控件的原生功能就可以比肩对应的 UIKit 控件了。 关于如何对 TextField 的显示做更多的定制,之后会撰文探讨。 希望本文对你有所帮助。

13.1K10

解析 SwiftUI 中两处由状态更新滞后引发的严重 Bug

众所周知,SwiftUI一个响应式框架,这意味着,当数据源发生变化时,框架会自动更新视图。同样,当我们想调整视图显示时,应直接对状态进行修改。...只有直接修改 path,SwiftUI 才能表现的像一个真正的响应式编程框架。...通过手势取消 Sheet 后,快速右滑导航容器会导致应用锁死这是一个SwiftUI 所有版本中存在的错误,你可以在众多的论坛或聊天室里看到不少的开发者都在寻找解决方法。...然而,明显地,强迫用户点击 “Dismiss” 按钮并不是一个好的选择,特别是在没有屏蔽手势取消 Sheet 的情况下。...,以确保用户只能在 showSheet 为否时通过滑动返回到上一层视图。

587110

AVKit框架详细解析(四) —— 基于AVKit 和 AVFoundation框架的视频流App的构建

将播放器视为能够一次管理一个媒体资产的播放的控制器对象。 3) VideoPlayer 是一个方便的 SwiftUI 视图,需要播放器对象才能发挥作用。 您可以使用它来播放视频。...这包括一个播放按钮一个静音按钮和用于前进和后退的 15 秒跳过按钮。 2. Adding Remote Playback 那很容易,对吧? 如何从远程 URL 添加视频播放? 那一定要难很多!...3SwiftUI 在需要更新底层 UIView 时会调用此方法。 现在,将其留空。...2) 当有人双击播放器视图时,您可以添加一个侦听器。 这会在 2x 和 1x的播放速率之间切换3) 当有人单击播放器视图时,您可以添加一个侦听器。 这会切换视频的静音状态。...您会在左上角看到画中画按钮……否则不会! 缺点是,在撰写本文时,iOS 14.5是可用的最新版本,VideoPlayer 的 SwiftUI 视图未显示画中画按钮

6.9K10

SwiftUI:视图的显示和隐藏动画

SwiftUI最强大的功能之一是能够自定义视图的显示和隐藏方式。以前,您已经了解了如何使用常规if条件有条件地包含视图,这意味着当条件更改时,我们可以从视图层次结构中插入或移除视图。...为了演示这一点,这里有一个带有按钮和矩形的VStack: struct ContentView: View { var body: some View { VStack {...isShowingRed在“true”和“false”之间切换: self.isShowingRed.toggle() 如果你运行程序,你会看到按下按钮显示或者隐藏红色方块。...通过使用withAnimation()包装状态更改,我们可以获得SwiftUI的默认视图转换,如下所示: withAnimation { self.isShowingRed.toggle() }...一个有用的方法是不对称,它允许我们在显示视图时使用一个转换,在视图消失时使用另一个转换。

4.4K30

掌握 SwiftUI 的 task 修饰器

详情请参阅 SwiftUI 视图的生命周期研究[3] 一文中有关 onAppear 和 onDisappear 的章节SwiftUI 为了判断视图的状态是否发生了改变,它会在视图的存续期内,反复地生成视图类型实例以达成此目的...,还会在其观察的值( 符合 Equatable 协议 )发生变化时,重新执行一次任务( 创建一个新的异步任务 ):struct TaskDemo2: View { @State var status...,每秒更新一次 date 变量,并且在控制台中显示当前的任务 ID 及时间。...Hide Timer 按钮后,app 出现了无法响应且控制台仍在持续输出( 不按照原定的间隔时间 )的情况,为什么会出现这样的问题呢?...作为一个事件源类型的 Source of Truth,每当接收到一个新的消息时,它都会导致 SwiftUI 对视图的 body 重新求值。

2.2K30

我庆幸果断放弃了SwiftUI:它还不够成熟

并且 SwiftUI 可以“实现一次编码,可适应五端 Apple 产品平台”, 包括watchOS、tvOS、macOS 等,以此统一苹果平台的 UI 框架。...我还遇到了其他问题,因为 SwiftUI 高度依赖于 View 协议的实现结构,但 View 协议又有关联的类型,所以只能把它当成约束来用。...我在网上查找了解决方案,最后编写了一个延迟版本的 ObservableObject,由它来强制每秒只发布一次更改(参见以下代码)。...它的显示效果就是主窗口中的一张表,出于学习的目的,我当然还是想继续用 SwiftUI 喽。毕竟初次尝试肯定会有种种问题,应该再给它一次机会。...这些按钮只跟管理 SpriteKit 视图缩放的 @State 相关联。尽管几乎不涉及任何其他数据,在界面更新前单击这些按钮,也会产生将近一秒钟的巨大延迟。

4.9K20

掌握 SwiftUI 的 task 修饰器

,还会在其观察的值( 符合 Equatable 协议 )发生变化时,重新执行一次任务( 创建一个新的异步任务 ): struct TaskDemo2: View { @State var status...,每秒更新一次 date 变量,并且在控制台中显示当前的任务 ID 及时间。...图片 我们的本意是通过按钮来开启和关闭计时器的显示以控制任务的生命周期( 关闭时结束任务 ),但在点击 Hide Timer 按钮后,app 出现了无法响应且控制台仍在持续输出( 不按照原定的间隔时间...回到当前的问题,由于 View 协议限定了 body 属性必须运行于主线程中( 使用了 @MainActor 进行标注 ),因此,如果我们直接在 body 中为 task 修饰器添加闭包代码,那么该闭包只能运行于主线程中...作为一个事件源类型的 Source of Truth,每当接收到一个新的消息时,它都会导致 SwiftUI 对视图的 body 重新求值。

3.5K60

酷我音乐iOS小组件适配开发实践

的视图展示和交互使用),这种数据驱动视图符合swiftUI的声明式编程范式(跟我们用的OOP面向对象有较大差距) 这篇文章不能算教程,只能是算开发中遇到的过程记录,如果需要查看开发教程的话我建议去B站看一下相关开发视频...(我们不推荐这样实现,因为这样做可能一个组件只能适配iOS,却不能适配其它 例如watchOS、等系统,就造成兼容性下降等问题.) 2.SwiftUI中支持的Button 在widget中无法正常使用...在小组件里面加一个按钮经常出现边缘太大,样式填充问题(红线是笔者截图加上去的请忽略) 浅蓝色透明度的填充部分,需要设置按钮的显示样式才能去掉,默认就是上图这种方式有填充....经过上述操作后,我们只能给小组件加一个按钮,并不能实现点击按钮触发事件,当我们点击button的时候直接拉端,根本不给我们处理这个按钮的点击机会. 这是因为小组件不支持常规按钮....app is not in the foreground, consider the intent anyways. static var openAppWhenRun: Bool { get } 然而只能设置一次后不能修改了

52910

酷我音乐iOS小组件适配开发实践

的视图展示和交互使用),这种数据驱动视图符合swiftUI的声明式编程范式(跟我们用的OOP面向对象有较大差距) 这篇文章不能算教程,只能是算开发中遇到的过程记录,如果需要查看开发教程的话我建议去B站看一下相关开发视频...(我们不推荐这样实现,因为这样做可能一个组件只能适配iOS,却不能适配其它 例如watchOS、等系统,就造成兼容性下降等问题.) 2.SwiftUI中支持的Button 在widget中无法正常使用...在小组件里面加一个按钮经常出现边缘太大,样式填充问题(红线是笔者截图加上去的请忽略) 浅蓝色透明度的填充部分,需要设置按钮的显示样式才能去掉,默认就是上图这种方式有填充....经过上述操作后,我们只能给小组件加一个按钮,并不能实现点击按钮触发事件,当我们点击button的时候直接拉端,根本不给我们处理这个按钮的点击机会. 这是因为小组件不支持常规按钮....app is not in the foreground, consider the intent anyways. static var openAppWhenRun: Bool { get } 然而只能设置一次后不能修改了

81230
领券