SwiftUI直通车系列(4)—— 处理用户交互

简介: SwiftUI直通车系列(4)—— 处理用户交互

一、SwiftUI中的按钮


   按钮是处理用户交互的最基础的组件,在SwiftUI中,使用Button可以十分方便的定义按钮组件,如下:


var count = 0

struct SimpleView:View {

 

   var body: some View {

       VStack(alignment: .center, spacing: 20) {

           Button(action:{

               count += 1

           }){

               Text("按钮一")

           }

           Text("\(count)")

       }

   }

}


struct ContentView_Previews: PreviewProvider {

   static var previews: some View {

      SimpleView()

   }

}

在预览界面,可以看到一个按钮和计数器已经布局在了页面上,我们尝试点击按钮,会发现变量count虽然已经被改变了,但是页面并没有更新。能够接收到用户交互只是第一步,在SwiftUI中通过用户交互而进行页面的刷新才是核心我们需要关注的。效果如下:


image.png


二、状态


   SwiftUI采用的是描述性的结构化布局策略,即通过定义结构体这种结构化的数据来描述页面的布局。这种布局思路开发直观快速,并且非常易于入门上手。其与流行的前端框架Flutter,React等布局思路已经非常相似。因此,对于页面的刷新操作,我们也不能采用原始的iOS开发页面刷新的方式(对对象进行操作),而是要使用状态来对组件进行管理,改变组件的状态来实现组件刷新操作。


   修改上面代码如下:


struct SimpleView:View {

   @State var count = 0

   var body: some View {

       VStack(alignment: /*@START_MENU_TOKEN@*/.center/*@END_MENU_TOKEN@*/, spacing: 20) {

           Button(action:{

               self.count += 1

           }){

               Text("按钮一")

           }

           Text("\(self.count)")

       }

   }

}


struct ContentView_Previews: PreviewProvider {

   static var previews: some View {

      SimpleView()

   }

}

重新恢复预览,可以看到计数器的功能已经正常了。@State是SwiftUI中提供的一个属性装饰器,其可以将某个属性指定为有状态的,当有状态的属性发生变化时,与其绑定的组件会自动刷新。


   如果有状态属性在父组件中,而我们需要在子组件中处理用户交互逻辑进行页面刷新,这时,如果不做特殊的处理,子组件会因为结构体不可修改的原则而导致无法对传递进来的状态属性进行更改。对于这种场景,我们可以使用SwiftUI中提供的@Binding装饰器来修改子组件中的属性,例如:


struct SimpleSubText:View {

   @Binding var count:Int

   var body: some View {

       Button(action:{

           self.count += 1

       }){

           Text("按钮一")

       }

       Text("\(self.count)")

   }

}



struct SimpleView:View {

   @State var count = 0

   var body: some View {

       VStack(alignment: /*@START_MENU_TOKEN@*/.center/*@END_MENU_TOKEN@*/, spacing: 20) {

           SimpleSubText(count: $count)

       }

   }

}


struct ContentView_Previews: PreviewProvider {

   static var previews: some View {

      SimpleView()

   }

}

三、使用环境对象


   使用状态来管理组件刷新并不复杂,但是如果组件的嵌套层数较多,有状态数据的传递可能需要层层下传,这会使数据的流转变得相对复杂。在SwiftUI中,还有另外一种方式,可以定义环境对象,环境对象在SwiftUI组件的任意位置都可以自由访问和修改,与环境对象有绑定关系的组件都会接收到变动的通知并刷新。示例代码如下:


// 作为环境数据的类,必须是可绑定监听的,需要继承ObservableObject

class EnviData: ObservableObject {

   @Published var count = 0

}


struct SimpleSubText:View {

   // 获取环境数据进行使用

   @EnvironmentObject var data:EnviData

   var body: some View {

       Button(action:{

           self.data.count += 1

       }){

           Text("按钮一")

       }

       Text("\(self.data.count)")

   }

}



struct SimpleView:View {

   var body: some View {

       VStack(alignment: .center, spacing: 20) {

           SimpleSubText()

       }

   }

}


struct ContentView_Previews: PreviewProvider {

   static var previews: some View {

       // 传递环境数据

       SimpleView().environmentObject(EnviData())

   }

}

需要注意,并不是环境对象中所有的属性都会触发绑定和监听,只有使用@published的属性才会触发,因此环境对象也是支持静态的内部属性。

目录
相关文章
|
6月前
|
安全 编译器 Swift
IOS开发基础知识: 对比 Swift 和 Objective-C 的优缺点。
IOS开发基础知识: 对比 Swift 和 Objective-C 的优缺点。
388 2
|
4月前
|
Unix 调度 Swift
苹果iOS新手开发之Swift 中获取时间戳有哪些方式?
在Swift中获取时间戳有四种常见方式:1) 使用`Date`对象获取秒级或毫秒级时间戳;2) 通过`CFAbsoluteTimeGetCurrent`获取Core Foundation的秒数,需转换为Unix时间戳;3) 使用`DispatchTime.now()`获取纳秒级精度的调度时间点;4) `ProcessInfo`提供设备启动后的秒数,不表示绝对时间。不同方法适用于不同的精度和场景需求。
140 3
|
13天前
|
Swift iOS开发 UED
如何使用Swift和UIKit在iOS应用中实现自定义按钮动画
本文通过一个具体案例,介绍如何使用Swift和UIKit在iOS应用中实现自定义按钮动画。当用户点击按钮时,按钮将从圆形变为椭圆形,颜色从蓝色渐变到绿色;释放按钮时,动画以相反方式恢复。通过UIView的动画方法和弹簧动画效果,实现平滑自然的过渡。
28 1
|
22天前
|
Swift iOS开发 UED
如何使用Swift和UIKit在iOS应用中实现自定义按钮动画
【10月更文挑战第18天】本文通过一个具体案例,介绍如何使用Swift和UIKit在iOS应用中实现自定义按钮动画。当用户按下按钮时,按钮将从圆形变为椭圆形并从蓝色渐变为绿色;释放按钮时,动画恢复原状。通过UIView的动画方法和弹簧动画效果,实现平滑自然的动画过渡。
43 5
|
3月前
|
存储 移动开发 Swift
使用Swift进行iOS应用开发:探索现代移动开发的魅力
【8月更文挑战第12天】使用Swift进行iOS应用开发,不仅能够享受到Swift语言带来的简洁、快速、安全的编程体验,还能够充分利用iOS平台提供的丰富资源和强大功能。然而,iOS应用开发并非易事,需要开发者具备扎实的编程基础、丰富的实践经验和不断学习的精神。希望本文能够为您的iOS应用开发之旅提供一些有益的参考和帮助。
|
4月前
|
Swift iOS开发 Kotlin
苹果iOS新手开发之Swift中实现类似Kotlin的作用域函数
Swift可通过扩展实现类似Kotlin作用域函数效果。如自定义`let`, `run`, `with`, `apply`, `also`,增强代码可读性和简洁性。虽无直接内置支持,但利用Swift特性可达成相似功能。
71 7
|
4月前
|
调度 Swift Android开发
苹果iOS新手开发之Swift中的并发任务和消息机制
Swift的消息机制类似Android的Handler,实现任务调度有三种方式: 1. **Grand Central Dispatch (GCD)**:使用`DispatchQueue`在主线程或后台线程执行任务。 2. **OperationQueue**:提供高级接口管理`Operation`对象。 3. **RunLoop**:处理事件如输入源、计时器,类似Android的`Looper`和`Handler`。 **示例**: - GCD:在不同线程执行代码块。 - OperationQueue:创建操作并执行。 - RunLoop:用Timer添加到RunLoop中。
98 2
|
4月前
|
安全 编译器 Swift
探索iOS开发:Swift语言的现代魔法
【7月更文挑战第11天】本文深入探讨了Swift编程语言,它如何革新iOS开发领域,以及它为开发者带来的独特优势。我们将从Swift的基础语法出发,通过实际案例分析其性能优化技巧,最后讨论Swift在跨平台开发中的潜力。文章旨在为读者提供一个全面而深入的视角,了解Swift不仅仅是一门语言,更是一种推动创新的力量。
|
6月前
|
设计模式 前端开发 Swift
使用Swift进行iOS应用开发:深入探索与最佳实践
【5月更文挑战第24天】探索Swift在iOS开发中的深度应用与最佳实践。Swift以其简洁语法、类型安全、面向对象、高性能及与Objective-C的互操作性脱颖而出。使用Xcode设置开发环境,学习Swift语法,创建并设计项目,编写业务逻辑,同时进行调试和测试。遵循MVC模式,利用SwiftUI、并发特性,并注重内存管理,持续学习新工具和技术,以实现高质量应用开发。
|
6月前
|
安全 Swift iOS开发
【Swift 开发专栏】Swift 与 UIKit:构建 iOS 应用界面
【4月更文挑战第30天】本文探讨了Swift和UIKit在构建iOS应用界面的关键技术和实践方法。Swift的简洁语法、类型安全和高效编程模型,加上与UIKit的紧密集成,使开发者能便捷地创建用户界面。UIKit提供视图、控制器、布局、动画和事件处理等功能,支持灵活的界面设计。实践中,遵循设计原则,合理组织视图层次,运用布局和动画,以及实现响应式设计,能提升界面质量和用户体验。文章通过登录、列表和详情界面的实际案例展示了Swift与UIKit的结合应用。
290 1