SwiftUI-Preview帶有Binding參數的View

閱讀時間約 4 分鐘

在寫SwiftUI view的時候,碰到一個瓶頸(? 帶有Binding的參數要如何preview。
舉例來說有個右邊圖片左邊文字的View,給他一個@Binding var isActive: Bool的狀態,當active時圖片要跟著改變:

struct RightImageView: View {
@State var activeIcon: String
@State var originalIcon: String
@State var title: String
@Binding var isActive: Bool
var body: some View {
HStack {
Image(systemName: isActive ? activeIcon : originalIcon)
Text(title)
}.font(.system(size: 14.0))
.frame(minWidth: 0, maxWidth: .infinity, alignment: .center)
.padding([.all], 10.0)
.background(Color.blue)
}
}

isActive = false

raw-image



isActive = true

raw-image


單獨Preview時,Binding參數要怎麼填??????

出現錯誤

出現錯誤


Xcode14我是做一個@State private參數填進preview裡

struct RightImageView_Previews: PreviewProvider {
@State private static var isActive = false
static var previews: some View {
RightImageView(activeIcon: "arrow.up", originalIcon: "arrow.down", title: "456", isActive: $isActive)
}
}


Xcode15 preview的預設變成macro

沒辦法再寫@State private var🫨

#Preview {
// your view​
}


後來查到一個比較好的作法

StatefulPreviewWrapper

struct StatefulPreviewWrapper<Value, Content: View>: View {
@State var value: Value
var content: (Binding<Value>) -> Content
var body: some View {
content($value)
}
init(_ value: Value, content: @escaping (Binding<Value>) -> Content) {
self._value = State(wrappedValue: value)
self.content = content
}
}


用法

#Preview {
StatefulPreviewWrapper(false) { isActive in
RightImageView(activeIcon: "arrow.up", originalIcon: "arrow.down", title: "456", isActive: isActive)
}
}


不過只能塞一個Binding參數,如果有好幾個要在自己擴寫


參考資料:

https://developer.apple.com/forums/thread/118589



6會員
35內容數
紀錄iOS開發上遇到的問題或是一些流程筆記。主要都是Swift。
留言0
查看全部
發表第一個留言支持創作者!
Michelle Chen的沙龍 的其他內容
雖然我之前文章大力讚美SwiftUI的tabView有多好用,無奈專案大部分都是UIKit啊~~~~要在既有專案用Tab架構只能用UITabBarController了 設計這次還出了一個超複雜的UI,陰影+圓角+客製化高度 大套餐 馬上開始吧。 圓角+陰影 重點就是subclass一個
Sandbox 架構 /Documents:主要用於儲存用戶生成的數據或者不能重新創建的數據。這些可能包括由你的應用程式創建的文件、從服務器下載的文件、用戶在應用程式中創建或修改的數據等。 這些數據在應用程式的生命週期中是持久保存的,即使應用程式被終止或者系統重啟,這些數據也會保留。此外
SwiftUI的TabView實在太好用啦!我要大大的推廣他ლ(╹◡╹ლ) 換頁+小圓點滑動 無限自動輪播 底部Tabbar
這個浮誇標題是ChatGPT幫我想的😊 圖也是DALL幫我產的, AI萬歲! GCD也是面試必問題啊!我答超爛的,只會用背景呼叫API+切Main Thread更新畫面,今天就來認真了解。 GCD是什麼? 先來問ChatGPT什麼是GCD? GCD,全名 Grand Central Dis
字數算法 = string.count? 在swift算一個string的字數時候,很直覺的會想到用.count來算 let s = "這是幾個字呢".count print(s.count) // 6 毫無疑問的安心信賴6個字 表情符號的場合 let emoji = "😂" print
Xcode15的 @escaping closure裡解包後的[weak self]不必再寫 self了!! 用一個範例class Test來實驗,裡面只有一個變數a跟一個testClosure回"test",再用callTestClosure把變數a改成"test" 編譯正常!變數a成功被改成
雖然我之前文章大力讚美SwiftUI的tabView有多好用,無奈專案大部分都是UIKit啊~~~~要在既有專案用Tab架構只能用UITabBarController了 設計這次還出了一個超複雜的UI,陰影+圓角+客製化高度 大套餐 馬上開始吧。 圓角+陰影 重點就是subclass一個
Sandbox 架構 /Documents:主要用於儲存用戶生成的數據或者不能重新創建的數據。這些可能包括由你的應用程式創建的文件、從服務器下載的文件、用戶在應用程式中創建或修改的數據等。 這些數據在應用程式的生命週期中是持久保存的,即使應用程式被終止或者系統重啟,這些數據也會保留。此外
SwiftUI的TabView實在太好用啦!我要大大的推廣他ლ(╹◡╹ლ) 換頁+小圓點滑動 無限自動輪播 底部Tabbar
這個浮誇標題是ChatGPT幫我想的😊 圖也是DALL幫我產的, AI萬歲! GCD也是面試必問題啊!我答超爛的,只會用背景呼叫API+切Main Thread更新畫面,今天就來認真了解。 GCD是什麼? 先來問ChatGPT什麼是GCD? GCD,全名 Grand Central Dis
字數算法 = string.count? 在swift算一個string的字數時候,很直覺的會想到用.count來算 let s = "這是幾個字呢".count print(s.count) // 6 毫無疑問的安心信賴6個字 表情符號的場合 let emoji = "😂" print
Xcode15的 @escaping closure裡解包後的[weak self]不必再寫 self了!! 用一個範例class Test來實驗,裡面只有一個變數a跟一個testClosure回"test",再用callTestClosure把變數a改成"test" 編譯正常!變數a成功被改成
你可能也想看
Google News 追蹤
Thumbnail
這個秋,Chill 嗨嗨!穿搭美美去賞楓,裝備款款去露營⋯⋯你的秋天怎麼過?秋日 To Do List 等你分享! 秋季全站徵文,我們準備了五個創作主題,參賽還有機會獲得「火烤兩用鍋」,一起來看看如何參加吧~
Thumbnail
美國總統大選只剩下三天, 我們觀察一整週民調與金融市場的變化(包含賭局), 到本週五下午3:00前為止, 誰是美國總統幾乎大概可以猜到60-70%的機率, 本篇文章就是以大選結局為主軸來討論近期甚至到未來四年美股可能的改變
Thumbnail
Faker昨天真的太扯了,中國主播王多多點評的話更是精妙,分享給各位 王多多的點評 「Faker是我們的處境,他是LPL永遠繞不開的一個人和話題,所以我們特別渴望在決賽跟他相遇,去直面我們的處境。 我們曾經稱他為最高的山,最長的河,以為山海就是盡頭,可是Faker用他28歲的年齡...
Thumbnail
該服務透過記錄在AWS控制台上執行的操作並產生範例程式碼來實現 Infrastructure as Code (IaC) 目前僅在 us-east-1 的 EC2 控制台上可用 支援的格式: CDK(Java) CDK(Python) CDK(TypeScript) CloudFor
1.Fed 9月不會升息,但是,會發出嚴厲的tone調。會給市場2023年得再加息一次並且拉高未來降息門檻的訊號。但是,最終,除非通膨大幅度增溫或者是美國經濟顯著加速,Fed是不會真的這樣做。 2.點陣圖應該中位數依舊在2023年還需要升息一次,但是,近半數的投票者應該依舊會是投不升息。 3.點
Thumbnail
【給只想知道大概劇情的人】 曾是連續殺人犯的金秉洙停止犯案後低調生活,獨自扶養女兒長大,原本以為會在無人知曉罪孽的狀況下平靜過完一生,卻被診斷出阿茲海默症與血管型失智症,記憶逐漸消失的他似乎只剩下殺人的身體記憶,偏偏小鎮上又開始有年輕女性接連被殺害,兇手是他感應到的那個同類,還是──根本就是他自己
Thumbnail
在這個瞬息萬變的世界裡,才子佳人的出現總是讓人眼前一亮。古人曾言:「江山代有才人出,各領風騷數百年」,這句話表達了一代又一代的傑出人才不斷脫穎而出,各自獨領風騷,成為歷史的佼佼者。 🌟 無論是文學、藝術、科學還是商業,每個領域都有他們的風采。在這浩瀚的江山裡,才子佳人們用自己的才華和智慧,塑造了各
Thumbnail
他是一位很特別的英文老師。雖然平常教課都快忙不過來了,但他有著自己的堅持,有些事情,他一定會去完成。
Thumbnail
單純以年齡來看,確實有世代之分,然而,每位詩人起步的時間點不同,年紀高低未必與詩齡長短正相關,再者,新世代的時代語言或許與前一代有些差異,但終究生活在相近的時間點,老將在持續筆耕的同時,也會自我要求創新及突破,因此世代之間很難找到明確的歧異點。
Thumbnail
他的祕訣就是大量閱讀、大量學習,隨時更新自己的資料庫,腦袋裡永遠都是滿滿的乾貨。因為抽屜裡什麼都有,所以他從沒在怕的,任何場子他都能罩得住。
Thumbnail
在這說的不是別的,我指的就是自殺,因為作家自殺跟一般自殺不大一樣,我一定要先提出來。 是這樣的,我熱愛寫作,也深信寫作可以是絕佳的療癒措施,能夠透過寫作抒發心智是很幸福的一件事情(當然創作不見得只有寫作,任何藝術創作都可以)。 但作家自殺則是另一回事。 甚至可以嘗試去修復這段關係。 因為上帝愛你。
Thumbnail
這天和朋友聊起養寵物的心得,他養了一隻狗和兩隻貓,我正在請教他要怎麼開始養寵物,因為我是連一隻蠶寶寶都沒養過的人。我是相當喜歡動物的,只不過沒有養他們衝動,近幾年還有返老還童的跡象,很喜歡到動物園遊蕩,只要看著動物就感到無限療癒。但人到了一個年紀好像得養個什麼,養房養兒養花養草之類的。  
Thumbnail
pictogram(中文:象形符號,亦稱象形圖、形圖或象形文字),是既有象形畫義又有定義且能依定義作文的符號- From 維基百科 每到一個新的國家時,我很喜歡收集這些pictogram,它們代表的不只是圖像上的意思,更深的含意是表現當下環境生活的方式,也會在緊急時救自己一命。 細看韓國首爾的這些
Thumbnail
這個秋,Chill 嗨嗨!穿搭美美去賞楓,裝備款款去露營⋯⋯你的秋天怎麼過?秋日 To Do List 等你分享! 秋季全站徵文,我們準備了五個創作主題,參賽還有機會獲得「火烤兩用鍋」,一起來看看如何參加吧~
Thumbnail
美國總統大選只剩下三天, 我們觀察一整週民調與金融市場的變化(包含賭局), 到本週五下午3:00前為止, 誰是美國總統幾乎大概可以猜到60-70%的機率, 本篇文章就是以大選結局為主軸來討論近期甚至到未來四年美股可能的改變
Thumbnail
Faker昨天真的太扯了,中國主播王多多點評的話更是精妙,分享給各位 王多多的點評 「Faker是我們的處境,他是LPL永遠繞不開的一個人和話題,所以我們特別渴望在決賽跟他相遇,去直面我們的處境。 我們曾經稱他為最高的山,最長的河,以為山海就是盡頭,可是Faker用他28歲的年齡...
Thumbnail
該服務透過記錄在AWS控制台上執行的操作並產生範例程式碼來實現 Infrastructure as Code (IaC) 目前僅在 us-east-1 的 EC2 控制台上可用 支援的格式: CDK(Java) CDK(Python) CDK(TypeScript) CloudFor
1.Fed 9月不會升息,但是,會發出嚴厲的tone調。會給市場2023年得再加息一次並且拉高未來降息門檻的訊號。但是,最終,除非通膨大幅度增溫或者是美國經濟顯著加速,Fed是不會真的這樣做。 2.點陣圖應該中位數依舊在2023年還需要升息一次,但是,近半數的投票者應該依舊會是投不升息。 3.點
Thumbnail
【給只想知道大概劇情的人】 曾是連續殺人犯的金秉洙停止犯案後低調生活,獨自扶養女兒長大,原本以為會在無人知曉罪孽的狀況下平靜過完一生,卻被診斷出阿茲海默症與血管型失智症,記憶逐漸消失的他似乎只剩下殺人的身體記憶,偏偏小鎮上又開始有年輕女性接連被殺害,兇手是他感應到的那個同類,還是──根本就是他自己
Thumbnail
在這個瞬息萬變的世界裡,才子佳人的出現總是讓人眼前一亮。古人曾言:「江山代有才人出,各領風騷數百年」,這句話表達了一代又一代的傑出人才不斷脫穎而出,各自獨領風騷,成為歷史的佼佼者。 🌟 無論是文學、藝術、科學還是商業,每個領域都有他們的風采。在這浩瀚的江山裡,才子佳人們用自己的才華和智慧,塑造了各
Thumbnail
他是一位很特別的英文老師。雖然平常教課都快忙不過來了,但他有著自己的堅持,有些事情,他一定會去完成。
Thumbnail
單純以年齡來看,確實有世代之分,然而,每位詩人起步的時間點不同,年紀高低未必與詩齡長短正相關,再者,新世代的時代語言或許與前一代有些差異,但終究生活在相近的時間點,老將在持續筆耕的同時,也會自我要求創新及突破,因此世代之間很難找到明確的歧異點。
Thumbnail
他的祕訣就是大量閱讀、大量學習,隨時更新自己的資料庫,腦袋裡永遠都是滿滿的乾貨。因為抽屜裡什麼都有,所以他從沒在怕的,任何場子他都能罩得住。
Thumbnail
在這說的不是別的,我指的就是自殺,因為作家自殺跟一般自殺不大一樣,我一定要先提出來。 是這樣的,我熱愛寫作,也深信寫作可以是絕佳的療癒措施,能夠透過寫作抒發心智是很幸福的一件事情(當然創作不見得只有寫作,任何藝術創作都可以)。 但作家自殺則是另一回事。 甚至可以嘗試去修復這段關係。 因為上帝愛你。
Thumbnail
這天和朋友聊起養寵物的心得,他養了一隻狗和兩隻貓,我正在請教他要怎麼開始養寵物,因為我是連一隻蠶寶寶都沒養過的人。我是相當喜歡動物的,只不過沒有養他們衝動,近幾年還有返老還童的跡象,很喜歡到動物園遊蕩,只要看著動物就感到無限療癒。但人到了一個年紀好像得養個什麼,養房養兒養花養草之類的。  
Thumbnail
pictogram(中文:象形符號,亦稱象形圖、形圖或象形文字),是既有象形畫義又有定義且能依定義作文的符號- From 維基百科 每到一個新的國家時,我很喜歡收集這些pictogram,它們代表的不只是圖像上的意思,更深的含意是表現當下環境生活的方式,也會在緊急時救自己一命。 細看韓國首爾的這些