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 提供了一项称为拖放的特殊功能。拖放允许用户将任何项目或内容从应用程序的一个部分或位置移动到应用程序的另一个部分或位置。或者,我们可以将内容从一个应用程序拖放到另一个应用程序。它可以拖放视图中给出的数据、图像、文本或其他内容。

它在图像库、文件管理器、笔记等应用程序中很有用。此功能在 iOS、iPadOS 和 macOS 中可用。除了内容之外,我们还可以通过拖放来移动、重新排列、重新排序或传输来自应用程序不同部分的对象(例如 UI 元素或 UIView)。

使用可转移项目进行拖放

在 SwiftUI 中,我们可以借助 Transferable 协议拖放项目。这是在给定视图之间移动元素的最简单的协议。它提供了两个修饰符:.draggable() 和 .dropDestination,用于将元素从一个视图拖放到另一个视图。

.draggable() 修饰符

.draggable() 修饰符允许我们在指定视图中执行拖放操作。此修饰符符合 Transferable 协议。它允许用户使用手势拖动视图,并且它将自动在内部执行拖动。我们还可以将此修饰符与 DragGesture() 结合使用,以在拖动时更好地控制视图。

语法

以下是语法 −

.draggable(_payload: @autoclosure)

参数

它只接受一个参数,即有效负载。它是一个闭包,表示来自视图的可拖动数据。

.dropDestination() 修饰符

.dropDestination() 修饰符指定放置内容的目标。或者我们可以说它允许我们在视图层次结构中指定可以放置可拖动项目的位置。

语法

以下是语法 −

.dropDestination(
   for payloadType: Type,
   action: @escapingClosure,
   isTargeted: @escapingClosure
)

参数

  • for: 表示我们要放置的视图。

  • action: 表示一个闭包,它接受放置的元素并做出相应响应。如果拖动操作成功,它将返回 true,否则将返回 false。

  • isTargeted:表示当拖放操作进入目标位置时调用的闭包。如果光标在指定区域,它将返回 true,否则返回 false。

示例

以下 SwiftUI 程序用于使用 Transferable Items 执行拖放。

import SwiftUI

struct ContentView: View {
   @State private var language: [String] = ["Java", "C++", "Python", "Go"]
   @State private var dropIcon = Image(systemName: "square.and.arrow.down")

   var body: some View {
      VStack {
         HStack {
            ForEach(language, id: \.self) { x in
               Text(x)
                  .frame(minWidth: 50, minHeight: 50)
                  .background(.white)
                  .foregroundStyle(.pink)
                  .cornerRadius(10)
                  .draggable(x)
            }
         }
         .frame(minWidth: 250, minHeight: 70)
         .cornerRadius(10)

         Text("Drop favorite language here:")

         dropIcon
            .frame(width: 200, height: 150)
            .background(.yellow.opacity(0.4))
            .foregroundStyle(.white)
            .dropDestination(for: Image.self) { 
               x, loc in
               dropIcon = x.first ?? Image(systemName: "square.and.arrow.down")
               print(loc)
               return true
            }
      }
   }
}
#Preview {
   ContentView()
}

输出

拖放