SwiftUI 按钮的8种酷炫效果和3种高级用法(按钮使用大全)

最新推荐文章于 2025-07-20 10:47:08 发布

原创最新推荐文章于 2025-07-20 10:47:08 发布 · 1.9k 阅读

2 ·

CC 4.0 BY-SA版权

本文详细介绍SwiftUI中按钮的8种酷炫效果与3种高级用法，包括文本按钮、颜色背景按钮、边框按钮等，并深入探讨ButtonStyle协议的高级应用。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

你点击的是按钮，我提供的是服务

本文您将能学到

8种酷炫效果

最简单的文本按钮
自定义文本按钮
颜色背景按钮
边框按钮
使用图标的按钮
图片按钮
带形状的图片按钮
漂浮的按钮

3种高级用法

Button Style protocol的高级使用
Button styles and environment的高级使用
PrimitiveButtonStyle protocol的高级使用

最终效果

Button按钮大全

按钮是程序与用户的纽带，程序通过用户点击不同的按钮来提供相应的服务。因此，按钮的使用是程序开发基础。本文将给通过介绍按钮使用的4种不同境界，来带领大家了解并掌握按钮的使用。

8种酷炫效果

Button 是一个pull-in视图，按钮既可以是简单文本、一张照片图像或者是更负责的视图组合。接下来让我们一起来看看格式各样的按钮吧！

1、最简单的文本按钮

image.png

  Button(action:{
                    print("最简单文本按钮")
                }){
                    Text("最简单文本按钮")
                }.padding()

2、自定义文本按钮

image.png

  Button(action:{
                    print("自定义文本按钮")
                }){
                    Text("自定义文本按钮")
                        .font(.largeTitle)
                        .foregroundColor(.orange)
                }.padding()

3、颜色背景按钮

image.png

 Button(action:{
                    print("颜色背景的按钮")
                }){
                    Text("颜色背景的按钮")
                        .padding()
                        .foregroundColor(.white)
                        .background(Color.purple)
                        .cornerRadius(8)
                    
                }.padding()

4、边框按钮

image.png

 Button(action:{
                    print("边框的按钮")
                }){
                    Text("边框的按钮")
                        .padding()
                        
                        .border(Color.orange)
                        .cornerRadius(10)
                    
                }.padding()
                
                Button(action:{
                    print("边框的按钮2")
                }){
                    Text("边框的按钮2")
                        .padding()
                        .background(RoundedRectangle(cornerRadius: 10)
                            .stroke(Color.green,lineWidth: 2)
                    )
                    
                }.padding()

5、使用图标的按钮

完整文章地址

向大家推荐《SwiftUI 按钮的8种酷炫效果和3种高级用法(按钮使用大全)》
https://xiaozhuanlan.com/topic/9386174052