SwiftUI 基礎之Toggle控件與@Binding屬性裝飾器（含代碼demo）

Toggle 介紹

A control that toggles between on and off states.

在打開和關閉狀態之間切換的控件

大白話：狀態開關

@Binding 屬性裝飾器

A manager for a value that provides a way to mutate it.

值的管理器，提供了一種對其進行變異的方法

大白話：將一個變量從不可以修改，轉化為可以修改。而且是可以跨視圖修改。就是將變量的引用傳給其他的視圖

Toggle和@Binding聯合demo

我們做一個開關來控制列表中數據的顯示

import SwiftUI

struct Product : Identifiable{
    let id = UUID()
    let title:String
    let isFavorited:Bool
}
struct FilterView: View {
    @Binding var showFavorited: Bool

    var body: some View {
        Toggle(isOn: $showFavorited) {
            Text("Change filter")
        }
    }
}

struct ContentView: View {
    
    let products: [Product] = [
        Product(title:"abc1",isFavorited: true),
        Product(title:"abc2",isFavorited: true),
        Product(title:"abc3 false",isFavorited: false),
        Product(title:"abc4",isFavorited: true),
        
    ]
    
    @State private var showFavorited: Bool = false
    
    var body: some View {
        List {
           FilterView(showFavorited: $showFavorited)
            
            ForEach(products) { product in
                if !self.showFavorited || product.isFavorited {
                    Text(product.title)
                }
            }
        }
    }
    
    
}

效果

Jietu20200118-212714.gif

更多SwiftUI教程和代碼關注專欄

請關注我的專欄 SwiftUI教程與源碼

本文鏈接：https://blog.csdn.net/iCloudEnd/article/details/104037794

智能推薦

SwiftUI-基礎使用-1

參考：SwiftUI 教程基礎用法 Text Customize the Text View 自定義TextView VCtack:豎向布局 HStack:橫向布局 Spacer：空白 Image Create a Custom Image View 圖片 clipShape 切割方式 Use UIKit and SwiftUI Views Together 將UIKit與SwiftUI結合使用...

SwiftUI封裝UIKit之UIDatePicker

本文價值與收獲看完本文后，您將能夠作出下面的界面 [email protected] 看完本文您將掌握的技能 UIDatePicker基礎使用掌握SwiftUI使用UIDatePicker方法代碼推薦基礎文章推薦《SwiftUI是什么，聽聽大牛們如何說》經典教程推薦 onevcat 大神的《SwiftUI 與 Combine 編程》更新近百篇SwiftUI教程《...

SwiftUI學習筆記之Animations

SwiftUI學習筆記之Animations 一 SwiftUI的Animations可以用到View當中，不僅是數值變化可以使用，即使是布爾變量也可以使用，例如在Button中使用當點擊button時，背景顏色立刻變為藍色或者紅色。如果我們加上animation 則顏色變化則漸變為紅色或者藍色。除了默認的動畫模式還有很多可供選擇比如 interpolatingSpring easeInOu...

SwiftUI 新屬性MenuPickerStyle 教程含源碼

實戰需求 SwiftUI 新屬性MenuPickerStyle，允許Picker在菜單中顯示其選項。這種風格將在主頁面進行遮蓋處理。本文將演示一下MenuPickerStyle的基礎使用本文價值與收獲看完本文后，您將能夠作出下面的界面看完本文您將掌握的技能掌握Picker基礎使用掌握MenuPickerStyle基礎使用實現菜單彈出效果基礎知識 MenuPickerStyle 一種選...

SwiftUI 新屬性InlinePickerStyle 教程含源碼

實戰需求 SwiftUI 新屬性InlinePickerStyle，該屬性允許Picker與周圍容器中的其余內容保持一致。該樣式將適應不同容器和平臺的外觀，例如菜單中的單個菜單項。本文將演示一下InlinePickerStyle的基礎使用本文價值與收獲看完本文后，您將能夠作出下面的界面看完本文您將掌握的技能掌握Picker基礎使用掌握InlinePickerStyle基礎使用實現內置效...