今天闲来无事,使用SwiftUI 实现拖动,并且返回的动态效果。代码不多。。。。。

效果如下:

代码如下:

  1. import SwiftUI
  2. import Combine
  3.  
  4. class KBDragObjectBind: BindableObject {
  5. var didChange = PassthroughSubject<KBDragObjectBind,Never>()
  6. var mass:Double = 1.0 {
  7. didSet{
  8. massString = String(format: "%.2f", mass)
  9. self.didChange.send(self)
  10. }
  11. }
  12. var massString = "1.0" {
  13. didSet {
  14. self.didChange.send(self)
  15. }
  16. }
  17. var stiffness:Double = 100.0 {
  18. didSet{
  19. stiffnessString = String(format: "%.0f", stiffness)
  20. self.didChange.send(self)
  21. }
  22. }
  23.  
  24. var stiffnessString = "100.0" {
  25. didSet {
  26. self.didChange.send(self)
  27. }
  28. }
  29.  
  30. var damping:Double = 10.0 {
  31. didSet {
  32. dampingString = String(format: "%.0f", damping)
  33. self.didChange.send(self)
  34. }
  35. }
  36. var dampingString = "10.0"{
  37. didSet {
  38. self.didChange.send(self)
  39. }
  40. }
  41.  
  42. var initialVelocity:Double = 0.0 {
  43. didSet {
  44. initialVelocityString = String(format: "%.0f", initialVelocity)
  45. self.didChange.send(self)
  46. }
  47. }
  48. var initialVelocityString = "0.0"{
  49. didSet{
  50. self.didChange.send(self)
  51. }
  52. }
  53. }
  54.  
  55. struct KBDragGestureView : View {
  56. @State var offset :CGSize = CGSize(width: 0, height: 0)
  57. @ObjectBinding var dragObj = KBDragObjectBind()
  58. @State var offset2 :CGSize = CGSize(width: 0, height: 0)
  59.  
  60. var body:some View {
  61. VStack {
  62. Text("Default Setting")
  63. Image(systemName: "hand.draw.fill")
  64. .resizable()
  65. .frame(width: 100, height: 100)
  66. .offset(offset)
  67. .gesture(
  68. DragGesture()
  69. .onEnded({ (value) in
  70. print("onEnd:\(value)")
  71. withAnimation(.spring()) {
  72. self.offset = CGSize(width: 0, height: 0)
  73. }
  74. })
  75. .onChanged({ (value) in
  76. print("onChanged: \(value)")
  77. self.offset = value.translation
  78. })
  79. ).zIndex(10)
  80. Divider()
  81. HStack(){
  82. Text("质量弥撒曲mass(\(self.dragObj.massString)):")//
  83. Slider(value: $dragObj.mass, from: 0.1, through: 1.0, by: 0.01)
  84. }
  85. HStack(){
  86. Text("刚度stiffness(\(self.dragObj.stiffnessString)):")
  87. Slider(value: $dragObj.stiffness, from: 0, through: 100.0, by: 1)
  88. }
  89. HStack(){
  90. Text("阻尼dampin(\(self.dragObj.dampingString)):")
  91. Slider(value: $dragObj.damping, from: 0, through: 100.0, by: 1)
  92. }
  93. HStack(){
  94. Text("初始速度initialVelocity(\(self.dragObj.initialVelocityString)):")
  95. Slider(value: $dragObj.initialVelocity, from: 0.0, through: 100.0, by: 1)
  96. }
  97.  
  98. Image(systemName: "hand.draw")
  99. .resizable()
  100. .frame(width: 100, height: 100)
  101. .offset(offset2)
  102. .gesture(
  103. DragGesture()
  104. .onEnded({ (value) in
  105. print("onEnd:\(value)")
  106. withAnimation(.spring(mass: self.dragObj.mass,
  107. stiffness: self.dragObj.stiffness,
  108. damping: self.dragObj.damping,
  109. initialVelocity: self.dragObj.initialVelocity)) {
  110. self.offset2 = CGSize(width: 0, height: 0)
  111. }
  112. })
  113. .onChanged({ (value) in
  114. print("onChanged: \(value)")
  115. self.offset2 = value.translation
  116. })
  117. )
  118.  
  119. }.padding()
  120. }
  121. }
  122.  
  123. #if DEBUG
  124. struct KBDragGestureView_Previews : PreviewProvider {
  125. static var previews: some View {
  126. KBDragGestureView()
  127. }
  128. }
  129. #endif

SwiftUI 实现Draggesture效果的更多相关文章

  1. 关于Mongodb的全面总结

    MongoDB的内部构造<MongoDB The Definitive Guide> MongoDB的官方文档基本是how to do的介绍,而关于how it worked却少之又少,本 ...

  2. 解析SwiftUI布局细节(二)循环轮播+复杂布局

    前言 上一篇我们总结的主要是VStack里面的东西,由他延伸到 @ViewBuilder, 接着我们上一篇总结的我们这篇内容主要说的是下面的几点,在这些东西说完后我准备解析一下苹果在SiwftUI文档 ...

  3. SwiftUI学习(一)

    总览 如果你想要入门 SwiftUI 的使用,那 Apple 这次给出的官方教程绝对给力.这个教程提供了非常详尽的步骤和说明,网页的交互也是一流,是觉得值得看和动手学习的参考. 不过,SwiftUI ...

  4. SwiftUI学习(二)

    教程 2 - Building Lists and Navigation Section 4 - Step 2: 静态 List var body: some View { List { Landma ...

  5. SwiftUI or Flutter ?

    看到这篇好文,忍不住想分享一下 本文转自https://juejin.im/post/5d05b45bf265da1bcc193ff4 版权归原文所有 ------------------------ ...

  6. SwiftUI 实战:从 0 到 1 研发一个 App

    心得感悟 起初看到 WWDC 上的演示 SwiftUI 时,我就觉得 SwiftUI 有种陌生的熟悉感(声明式语法),所以体验下,看看有没有什么启发. 先说下整体项目完成下来的感受: 用 Swift ...

  7. 基于 SwiftUI 创建一个可删除、可添加列表项的列表

    执行环境 macOS Mojave: 10.14.5 xcode: Version 11.0 beta 6 (11M392q) 预览效果 完整代码 import SwiftUI class Item: ...

  8. SwiftUI - 一步一步教你使用UIViewRepresentable封装网络加载视图(UIActivityIndicatorView)

    概述 网络加载视图,在一个联网的APP上可以讲得上是必须要的组件,在SwiftUI中它并没有提供如 UIKit 中的UIActivityIndicatorView直接提供给我们调用,但是我们可以通过 ...

  9. SwiftUI - 一起来仿写微信APP之一首页列表视图

    简介 最近在学习 SwiftUI ,我一般都是先去学习界面布局,所以就想着仿写一下经常使用的软件的界面,所以先拿微信开刀.因为不想一次性发太多的内容,所以只好将主题分解,一部分一部分地去讲,接下来我们 ...

随机推荐

  1. 47 ubuntu指令整理学习

    0 引言 在使用ubutnu时,积累了大量命令笔记.但是这些笔记比较零散,没有系统性,不便于查找和使用.通过系统性.分门别类地整理,希望可以增强对指令的记忆,提高工作效率,对ubuntu的使用更加地道 ...

  2. arcgis api for javascipt 输出图片

    地图模板制作-发布-gpurl调用 window.open可以直接打开url链接. saveas可以另存,仅支持ie浏览器 <!DOCTYPE html><html><h ...

  3. AtCoder ABC 132F Small Products

    题目链接:https://atcoder.jp/contests/abc132/tasks/abc132_f 题目大意 分析 代码如下

  4. 拾遗:Perl 正则表达式

    三种正则模式: 匹配:m//,其中前缀 m 可省略 替换:s/// 转化:tr/// 操作符: =~:存在匹配项则返回结果 !~:不存在匹配项则返回结果 修饰符: i:忽略大小写,如:s/.../.. ...

  5. jquery操作html元素之(设置内容和属性)

    设置内容 - text().html() 以及 val() 我们将使用前一章中的三个相同的方法来设置内容: text() - 设置或返回所选元素的文本内容 html() - 设置或返回所选元素的内容( ...

  6. yolo3使用darknet卷积神经网络训练pascal voc

    darknet本来最开始学的是https://github.com/pjreddie/darknet yolo3作者自己开发的,但是它很久不更新了而且mAP值不好观察,于是另外有个https://gi ...

  7. 2018-8-10-VisualStduio-打断点调试和不打断点调试有什么区别

    title author date CreateTime categories VisualStduio 打断点调试和不打断点调试有什么区别 lindexi 2018-08-10 19:16:52 + ...

  8. excel 导数据

    参考: ="insert tsilverinfo(ss_id,memo,ss_weight,ts_id,ss_type,ModelPosX,ss_stoneW,ss_stoneWU) val ...

  9. android 自定义shape 带阴影边框效果

    在drawable 里面 建立一个 xml 直接复制 看效果 自己调试就可以 <?xml version="1.0" encoding="utf-8"?& ...

  10. windows2012 日志查看过程

    Windows2012界面修改好造成有些人不知道在哪里查找windows 日志 我这边截图描述一下 1. 2.输入 命令  eventvwr.msc 3.弹出 windows 事件查看器 4.若需要  ...