首页 > 其他分享 >SwiftUI State,Binding 状态管理

SwiftUI State,Binding 状态管理

时间:2024-05-08 22:13:52浏览次数:19  
标签:color counter Binding private State SwiftUI var CounterButton

代码

//
//  ContentView.swift
//  SwiftUIState
//
//  Created by CHEN Hao on 2024/5/8.
//

import SwiftUI

struct ContentView: View {
    @State private var isPlaying = false
    @State private var clickNumber1 = 0
    @State private var clickNumber2 = 0
    @State private var clickNumber3 = 0

    var body: some View {
        Text("\(clickNumber1+clickNumber2+clickNumber3)") // "\(variables)",文本差插值
            .font(.system(size: 100, weight: .bold, design: .rounded))

        HStack {
            CounterButton(counter: $clickNumber1, color: .red) // $variables 传值, 可以理解成父传子
            CounterButton(counter: $clickNumber2, color: .orange)
            CounterButton(counter: $clickNumber3, color: .green)
        }
    }
}

struct CounterButton: View {
    @Binding var counter: Int // 接受值
    var color: Color

    var body: some View {
        Button {
            counter += 1
        } label: {
            Circle().frame(width: 50, height: 50)
                .foregroundStyle(color)
                .overlay {
                    Text("\(counter)")
                        .font(.system(size: 20, weight: .bold, design: .rounded))
                        .foregroundStyle(.white)
                }
        }
    }
}

#Preview {
    ContentView()
}

效果

标签:color,counter,Binding,private,State,SwiftUI,var,CounterButton
From: https://www.cnblogs.com/thankcat/p/18180992

相关文章

  • DevTutor 一款旨在帮助开发者使用 SwiftUI 创建出色应用程序的应用
    提供可复制的代码示例和相应的用户界面预览,以简化您的编码过程。此外,还包括了《Swift编程语言》官方中英文文档的本地离线预览。主要功能■提供可直接在您的项目中使用的样本代码■实时查看您的代码如何影响应用的外观■提供官方中英文Swift编程语言离线文档■探索第......
  • react中的state值修改了,也触发了页面的重新渲染,但是视图没有更新,可能是什么原因?
    state更新的是一个值List,但是页面渲染使用的是List中的某一项(当前选中项curItem),也定义成了state,而更新状态时,只更新了List,忽视了当前选中项curItem的状态更新,导致视图没有更新,即使组件重新渲染了,但是视图中使用的是curItem解决方案:state中不要保存当前选中项curItem,而应该保......
  • SwiftUI ScrollView 滚动视图
    代码////ContentView.swift//SwiftUIScrollView////CreatedbyCHENHaoon2024/5/7.//importSwiftUIstructContentView:View{varbody:someView{VStack(alignment:.leading){VStack(alignment:.leading){......
  • SwiftUI ZStack、HStack、VStack 布局
    代码////ContentView.swift//SwiftUIStacks////CreatedbyCHENHaoon2024/5/6.//importSwiftUIstructContentView:View{varbody:someView{VStack(spacing:15){HeaderView()HStack(spacing:15){......
  • SwiftUI Image 图片处理
    代码片段////ContentView.swift//SwiftUIImage////CreatedbyCHENHaoon2024/5/6.//importSwiftUIstructContentView:View{varbody:someView{Image("paris").resizable()//延伸模式,平铺整个屏幕/......
  • SwiftUI Text 文字处理
    代码////ContentView.swift//SwiftUIText////CreatedbyCHENHaoon2024/5/6.//importSwiftUIstructContentView:View{varbody:someView{VStack{Text("Yourtimeislimited,sodon’twasteitlivingsomeoneels......
  • WPF Text MultiBinding StringFormat
    <TextBlock.Text><MultiBindingStringFormat="R:{0:N0},G:{1:N0},B:{2:N0}"><BindingPath="Value"ElementName="_red"/><BindingPath="Value"ElementName="_green"/>......
  • WPF MultiBinding
    <Windowx:Class="WpfApp84.MainWindow"xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"xmlns:d="http://schemas.microsoft.......
  • WPF DataContext="{Binding SelectedItem,ElementName=_master}"
    <Windowx:Class="WpfApp80.MainWindow"xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"xmlns:d="http://schemas.microsoft.......
  • vscode 快捷件的配置文件地址 C:\Users\Reciter\AppData\Roaming\Code\User\ke
    vscode快捷件的配置文件地址C:\Users\Reciter\AppData\Roaming\Code\User\keybindings.json更改快捷键冲突我要把QuickGoToSelectedFilePath插件的快捷键Ctrl+E,换成F12,插件文章:https://www.cnblogs.com/pengchenggang/p/18163728但是系统里面已经有好几个F12的......