【App Dev-SwiftUI心得筆記】#2 切換頁面與模擬Loading資料

承上次初次用SwiftUI切版,這次Code越來越上手了 😎

這是的目標是將首頁的畫面弄的更完整,並且新增CategoryDetail頁面 :D

將首頁畫面豐富&完整化

Components Used:

Zstack, Color(literal), LineGradient,

利用Zstack做出前後圖層,在底圖上用LineGradient、Color(literal)直接玄取顏色製作漸層背景

將 PopularRestaurantsView、TrendingCreators 畫面補齊

CleanCode 時間

將Code分類建立成獨立檔案放入不同的資料夾內

可以運用 PreviewProvider 建立兩個模擬器 (獨立檔案的View & 整體的View)

struct PopularDestinationsView_Previews: PreviewProvider {
static var previews: some View {
PopularDestinationsView()
DiscoverView()
}
}

ViewModifier 建立管理重複的樣式

extension View{
func asTile() -> some View{
modifier(TileModifier())
}
}

struct TileModifier: ViewModifier {
func body(content: Content) -> some View {
content
.background(Color(.white))
.cornerRadius(10)
.shadow(color: .gray, radius: 3, x: 0, y: 2)
}
}

製作CategoryDetail 畫面

使用NavigationLink 連接畫面

製作Loading頁面

用DispatchQueue.main.asyncAfter 來模擬loading時間

新增讀取畫面元件

使用ActiveIndicatorView

加入畫面中

Free

Distraction-free reading. No ads.

Organize your knowledge with lists and highlights.

Tell your story. Find your audience.

Membership

Read member-only stories

Support writers you read most

Earn money for your writing

Listen to audio narrations

Read offline with the Medium app

Shin Yulin
Shin Yulin

Written by Shin Yulin

一個在前往 iOS 工程世界的視覺工作者

No responses yet

Write a response