SwiftUI 教程

SwiftUI 主页 SwiftUI 概览 SwiftUI 与 UIkit

SwiftUI 环境

SwiftUI 安装和环境配置 SwiftUI 基本组件 SwiftUI 构建第一个应用程序

SwiftUI 视图

SwiftUI 视图 SwiftUI 自定义文本视图 SwiftUI 自定义图像视图 SwiftUI 堆栈

SwiftUI 绘制形状

SwiftUI 形状 SwiftUI 绘制线条 SwiftUI 绘制矩形 SwiftUI 绘制圆角矩形 SwiftUI 绘制三角形 SwiftUI 绘制圆形 SwiftUI 绘制星形 SwiftUI 绘制多边形 SwiftUI 绘制饼图 SwiftUI 使用内置形状

SwiftUI 文本

SwiftUI 文本视图 SwiftUI 文本输入和输出

SwiftUI 颜色

SwiftUI 颜色 SwiftUI 颜色选择器 SwiftUI 渐变 SwiftUI 调整颜色

SwiftUI 效果

SwiftUI 效果 SwiftUI 混合效果 SwiftUI BLur 效果 SwiftUI 阴影效果 SwiftUI 悬停效果

SwiftUI 动画

SwiftUI 动画 SwiftUI 创建动画 SwiftUI 创建显式动画 SwiftUI 多个动画 SwiftUI 过渡 SwiftUI 不对称过渡 SwiftUI 自定义过渡

SwiftUI 图像

SwiftUI 图像 SwiftUI 图像作为背景 SwiftUI 旋转图像 SwiftUI 媒体

SwiftUI 视图布局

SwiftUI 视图布局 SwiftUI 视图大小 SwiftUI 视图间距 SwiftUI 视图填充

SwiftUI UI 控件

SwiftUI UI 控件 SwiftUI 按钮 SwiftUI 复选框 SwiftUI 菜单栏 SwiftUI 工具栏 SwiftUI 搜索栏 SwiftUI 文本字段 SwiftUI 滑块 SwiftUI 切换 SwiftUI 选择器 SwiftUI 菜单

SwiftUI 列表 &表格

SwiftUI 列表 SwiftUI 静态列表 SwiftUI 动态列表 SwiftUI 自定义列表 SwiftUI 表格

SwiftUI 表单

SwiftUI 表单 SwiftUI 在部分中拆分表单

SwiftUI 事件处理

SwiftUI 事件处理 SwiftUI 手势 SwiftUI 剪贴板 SwiftUI 拖放 SwiftUI 焦点 SwiftUI 警报

SwiftUI 杂项

SwiftUI 容器 SwiftUI 导航 SwiftUI 通知 SwiftUI 跨平台 UI SwiftUI 数据 SwiftUI 可访问性

SwiftUI 框架集成

SwiftUI 框架集成 SwiftUI 与 UIKit 交互 SwiftUI 创建 macOS 应用

SwiftUI 有用资源

SwiftUI 有用资源 SwiftUI 讨论


SwiftUI- 框架集成

将其他框架集成到您的 SwiftUI 应用中是一种常见做法,因为它允许您在使用 SwiftUI 构建用户界面时充分利用 iOS 或 macOS 的全部功能。SwiftUI 可与现有的 UIKit、AppKit 和其他 iOS/macOS 框架无缝协作,允许您在必要时将声明式 SwiftUI 视图与命令式 UI 组件相结合。

  • 将 Combine 与 SwiftUI 集成

  • 集成自定义框架或外部库

  • 将 AVFoundation 或 Core Graphics 与 SwiftUI 结合使用

将 Combine 与 SwiftUI 集成

Combine 是 Apple 用于处理异步事件的声明式框架。它与 SwiftUI 深度集成,因为许多 SwiftUI 视图和修改器都依赖于数据绑定,而数据绑定由 Combine 提供支持。

示例

以下 SwiftUI 程序用于与 Combine 集成。

import SwiftUI
import Combine

class CounterViewModel: ObservableObject {
   @Published var count = 0

   var cancellable: AnyCancellable?
   init() {
      // 使用 Combine 更新计数的示例
      cancellable = Timer.publish(every: 1, on: .main, in: .common)
         .autoconnect()
         .sink { _ in
            self.count += 1
         }
   }
}
struct ContentView: View {
   @StateObject var viewModel = CounterViewModel()

   var body: some View {
      VStack {
         Text("Count: \(viewModel.count)").font(.largeTitle).padding()

         Button("Reset Count") {
            viewModel.count = 0
         }.padding()
      }
   }
}

输出

FrameWork Integration

集成自定义框架或外部库

您可以轻松地在基于 SwiftUI 的应用中集成第三方库和自定义框架。SwiftUI 与 Objective-C 和基于 Swift 的库兼容。

示例

以下 SwiftUI 程序用于自定义框架或外部库。

import SwiftUI
import Alamofire

struct ContentView: View {
   @State private var data: String = ""

   var body: some View {
      VStack {
         Text(data)
            .padding()

         Button("Fetch Data") {
            fetchData()
         }
      }
   }
   func fetchData() {
      AF.request("https://api.example.com/data")
         .responseString { response in
            switch response.result {
            case .success(let value):
               self.data = value
            case .failure:
               self.data = "Failed to load data"
            }
         }
   }
}

输出

FrameWork Integration

将 AVFoundation 或 Core Graphics 与 SwiftUI 结合使用

有时,您需要使用 AVFoundation 等框架进行音频/视频处理或使用 Core Graphics 绘制自定义视图。SwiftUI 允许您使用 UIViewRepresentable 或 NSViewRepresentable 协议集成这些框架。

示例

以下 SwiftUI 程序用于将 AVFoundation 或 Core Graphics 与 SwiftUI 结合使用。

import SwiftUI
import AVKit

struct VideoPlayerView: View {
   var body: some View {
      VStack {
         Text("Video Player")
            .font(.largeTitle)
            .padding()

         AVPlayerView(player: AVPlayer(url: URL(string: "https://www.example.com/video.mp4")!))
            .frame(width: 300, height: 200)
      }
   }
}
struct AVPlayerView: View {
   var player: AVPlayer

   var body: some View {
      VideoPlayer(player: player)
         .frame(width: 300, height: 200)
   }
}

输出

FrameWork Integration