美文网首页
自定义togglestyle

自定义togglestyle

作者: 王勋才 | 来源:发表于2021-10-09 22:11 被阅读0次
IMG_0333.jpg
//自定义togglestyle
import SwiftUI

struct ContentView: View {
    @State private var flag = true

    var body: some View {
        VStack(spacing: 10) {
          
            
            Toggle(isOn: $flag) {
                Text(flag ? "开":"关")
            }.toggleStyle(MyToggleStyle())
        }
    }
}

struct MyToggleStyle: ToggleStyle {
    func makeBody(configuration: Self.Configuration) -> some View {
        MyToggleView(configuration: configuration)
    }
    
    struct MyToggleView: View {
        let configuration: MyToggleStyle.Configuration
        
        var body: some View {
            HStack {
                configuration.label
                    .font(.largeTitle)
                
                MyToggleSwitch(c: configuration)
            }
        }
    }
    
    struct MyToggleSwitch: View {
        let c: MyToggleStyle.Configuration

        var body: some View {
            ZStack(alignment: c.isOn ? .leading : .trailing) {
                
                Capsule()
                     .frame(width: 126, height: 50)
                 .foregroundColor(c.isOn ? .green : .gray)
                 .shadow(radius: 2)
                
             
             ZStack {
                     Circle()
                     .fill(c.isOn ? Color.orange : Color.black)
                     .frame(width: 50, height: 50)
                      Text(c.isOn ? "已开" : "已关")
                     .foregroundColor(c.isOn ? .white : .gray)
                     .shadow(radius: 2)
             }
             
         }
            .padding(5)
            .background(Color.white)
            .clipShape(Capsule())
            .shadow(radius: 10)
            .onTapGesture {
                withAnimation {
                    self.c.$isOn.wrappedValue.toggle()
                }
                    
            }
        }
    }
}



我的应用简单备忘录上架了。
https://apps.apple.com/cn/app/%E7%AE%80%E5%8D%95%E5%A4%87%E5%BF%98%E5%BD%95/id1588857931

相关文章

  • 自定义togglestyle

    我的应用简单备忘录上架了。https://apps.apple.com/cn/app/%E7%AE%80%E5%8...

  • SwiftUI:Toggle详解

    1.自定义样式 使用: ToggleStyle,可以根据该模板定制 条件判断是否能点击Toggle 2.使用自定义...

  • Dialog

    安卓dialog的使用+如何自定义dialog自定义Dialog自定义Dialog 自定义

  • django的自定义filter和自定义simple_tag

    django的自定义filter和自定义simple_tag 自定义filter: 自定义filter: 简单示例...

  • 自定义tabbarController

    要自定义tabBarController,就要自定义tabBar.要自定义tabBar就要自定义item.所以,咱...

  • 第三方

    ZYSideSlipFilter 侧边栏条件筛选器,支持自定义事件,自定义筛选栏目,自定义所有。。。样式完全自定义...

  • Android 高德地图 自定义Location小蓝点

    设置自定义定位蓝点 自定义Location小蓝点,自定义功能

  • vue 有自定义指令

    vue 的自定义指令,分为全局自定义指令和局部自定义指令,局部自定义指令等价于局部组件。 自定义指令可以对DOM进...

  • Android相关知识点博客记录

    自定义属性 Android自定义View(二、深入解析自定义属性) Android中XML的命名空间、自定义属性 ...

  • CocoaLumberjack源码分析

    1.使用 自定义custom context,自定义flag 自定义日志的格式 自定义日志级别,取消DDLog实现...

网友评论

      本文标题:自定义togglestyle

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