SwiftUI Button 基础教程

Button

触发时执行操作的控件

struct Button where Label : View

使用教程

您可以通过提供操作和标签来创建按钮。操作是一个方法或闭包属性，当用户单击或轻触按钮时，它会执行某些操作。标签是描述按钮操作的视图，例如，通过显示文本（如取消）或图标（如后退箭头）。

Button(action: {//您的代码}) {
    Text("Sign In")
}

代码

iOSButton效果

macOS代码

tvOS代码

import SwiftUI

struct ContentView: View {
    var body: some View {
        ScrollView{
            LazyVStack{
                
                Button("默认Button"){}
                    .padding()
                Text("默认样式")
                    .font(.subheadline)
                Button("PlainButtonStyle"){}
                    .buttonStyle(PlainButtonStyle())
                    .padding()
                Text("一种按钮样式，它在闲置时不会设置样式或修饰其内容，但可以应用视觉效果来指示按钮的按下，聚焦或启用状态。")
                    .font(.subheadline)
                Button("BorderlessButtonStyle"){}
                    .buttonStyle(BorderlessButtonStyle())
                    .padding()
                Text("不应用边框的按钮样式。")
                    .font(.subheadline)
                #if os(macOS)
                Button("LinkButtonStyle"){}
                    .buttonStyle(LinkButtonStyle())
                    .padding()
                Text("模拟链接的按钮")
                    .font(.subheadline)
                #endif
                Divider()
               Button("PrimitiveButtonStyle"){}
                .padding()
                .overlay(RoundedRectangle(cornerRadius: 20, style: .continuous)
                .stroke())
                .buttonStyle(PriButton())
                Text("PrimitiveButtonStyle 自定义样式")
                    .font(.subheadline)
                
            }
        }
    }
}

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

struct PriButton: PrimitiveButtonStyle {
    typealias Body = Button
    func makeBody(configuration: Configuration) -> some View {
        configuration.trigger()
          return
            Button(configuration)
            .background(Color.orange)
            .clipShape(RoundedRectangle(cornerRadius: /*@START_MENU_TOKEN@*/25.0/*@END_MENU_TOKEN@*/, style: /*@START_MENU_TOKEN@*/.continuous/*@END_MENU_TOKEN@*/))
    }
}

推荐

基础文章推荐

• 《SwiftUI是什么，听听大牛们如何说》

经典教程推荐

• 更新近百篇SwiftUI教程《SwiftUI2020教程》
• 帮您突破数据存储难关《SwiftUI vs CoreData数据存储解决方案》

技术源码推荐

推荐文章

CoreData篇

• SwiftUI数据存储之做个笔记App 新增与查询(CoreData)
• SwiftUI进阶之存储用户状态实现登录与登出
• SwiftUI 数据之List显示Sqlite数据库内容（2020年教程）

Combine篇

• 一篇文章学懂弄通SwiftUI与Combine(含轮播动画App源码)

TextField篇

• 《SwiftUI 一篇文章全面掌握TextField文本框 (教程和全部源码)》
• 《SwiftUI实战之TextField风格自定义与formatters》
• 《SwiftUI实战之TextField如何给键盘增加个返回按钮(隐藏键盘)》
• 《SwiftUI 当键盘出现时避免TextField被遮挡自动向上移动》
• 《SwiftUI实战之TextField如何给键盘增加个返回按钮(隐藏键盘)》

JSON文件篇

• SwiftUI JSON文件下载、存储、解析和展示(代码大全)

---

一篇文章系列

• SwiftUI一篇文章全面掌握List(教程和源码)
• 《SwiftUI 一篇文章全面掌握TextField文本框 (教程和全部源码)》
• SwiftUI一篇文章全面掌握Picker,解决数据选择(教程和源码)
• SwiftUI一篇文章全面掌握Form(教程和源码)
• SwiftUI Color 颜色一篇文章全解决

技术交流

QQ:3365059189
SwiftUI技术交流QQ群:518696470

• 请关注我的专栏icloudend, SwiftUI教程与源码
  https://www.jianshu.com/c/7b3e3b671970