美文网首页
SwiftUI—如何以动画的方式显示或隐藏指定的位图

SwiftUI—如何以动画的方式显示或隐藏指定的位图

作者: anny_4243 | 来源:发表于2020-07-14 19:58 被阅读0次

原文链接:https://github.com/fzhlee/SwiftUI-Guide#-%E7%AC%AC8%E8%8A%82togglevisibility-

本节课演示如何以动画的方式显示或隐藏指定的位图,该功能在日常的开发工作里很常见。

示例代码:

struct ContentView : View {
    
    @State var showingPassword = false //标识是否显示或隐藏指定的视图
    @State var password = "" //作为和密码输入框进行绑定的状态属性

    var body: some View {
        
        VStack {
            Toggle(isOn: $showingPassword.animation(.spring())) { //用来切换密码输入框的显示和隐藏,给布尔属性添加动画效果,这样当布尔属性的值发生变化时,将以弹性样式的时间曲线播放动画
                Text("Toggle Password")
            }

            if showingPassword {
                TextField("Password", text: $password)
                    .padding()
                    .border(Color.green, width: 1)
            }
        }
        .padding()
    }
}

相关文章

  • SwiftUI—如何以动画的方式显示或隐藏指定的位图

    原文链接:https://github.com/fzhlee/SwiftUI-Guide#-%E7%AC%AC8%...

  • GridManager 隐藏列

    GridManager 表格管理组件, 对列的隐藏与显示的操作有两种方式。 1.初始化时指定列为隐藏或显示状态。方...

  • GridManager 隐藏列

    GridManager 表格管理组件, 对列的隐藏与显示的操作有两种方式。 1.初始化时指定列为隐藏或显示状态。方...

  • jQuery 动画

    动画函数 .show()/.hide() 函数用于显示/隐藏所有匹配的元素。此外,还可以指定元素显示的过渡动画效果...

  • Android带过渡动画的折叠收缩View

    很多需要实现点击显示和隐藏指定布局的功能,但不带过渡动画的显示和隐藏会显得比较生硬,因此需要自定义一个带过渡动画的...

  • JQuery高级篇

    1.动画 三种方式显示和隐藏元素 1.默认显示和隐藏方式:show([speed,[easing],[fn]])h...

  • CSS display显示

    显示 CSS的display属性指定了HTML元素的显示方式,visibility属性指定一个元素应可见还是隐藏。...

  • 11_JQuery高级

    JQuery 高级 1. 动画 1. 三种方式显示和隐藏元素 1. 默认显示和隐藏方式 1. show([spee...

  • SwiftUI实战-滑动隐藏或显示头部

    SwiftUI实战系列 SwiftUI实战-使用ViewModifier自定义微信TabBar底部导航和Navig...

  • jQuery 动画

    隐藏与显示 .hide() 隐藏某个元素.hide("fast / slow") //这是一个动画设置的快捷方式,...

网友评论

      本文标题:SwiftUI—如何以动画的方式显示或隐藏指定的位图

      本文链接:https://www.haomeiwen.com/subject/jzafhktx.html