swiftui
SwiftUI 小技巧：如何在列表視圖隱藏 Disclosure 指示器
有了 SwiftUI ，開發者就可以輕鬆創建像 UIKit 表格視圖的列表視圖。在 UIKit 中使用表格視圖時，我們可以設置 accessoryType 屬性 (property)，來輕鬆配置單元格 (cell) 的指示器 (indicator)。舉個例子，如果我們要禁用 disclosure 指示器，可以將屬性設置為 .none： 但在 [...]
利用 VisionKit 框架 在 SwiftUI 掃描圖片及辨識文字
歡迎來到新一篇教學，這次我們要來討論兩個有趣而且互相關聯的概念：如何掃描圖片並辨識當中的文字。這件事聽起來或許非常複雜，不過很快你就會發現完全不是如此。有了 Vision 框架，現在要執行文字掃描和辨識，已經是相當簡便的工作了。 讓我們來了解一下文字掃描和辨識的細節。我們會使用 [...]
利用 ScrollViewReader 輕鬆讓滾動視圖滾動到特定位置
在新版 SwiftUI 中，其中一個我最喜歡的新功能就是 ScrollViewReader。在 iOS 14 推出之前，要控制內置 ScrollView 的滾動位置並不容易。如果想要滾動視圖滾動到特定位置，就需要自己想出解決方案。 有了 ScrollViewReader 之後，我們只需要幾行程式碼，就可以使滾動視圖滾動到特定位置。在這篇教學文章中，我們會探索這個新視圖元件，讓大家了解如何把它應用在 [...]
利用 RealityKit 和 SwiftUI 建立你的第一個 AR App
要利用 SwiftUI 創建一個 RealityKit App，你需要先更新到 MacOS Catalina，因為會用到的新框架不能在 MacOS Mojave 或更舊的版本上運行。你還需要在 Mac App Store 確認 Xcode 已經是最新的版本。你一定要有最新版本的 Xcode 和 MacOS，這個 App 才可以正常運作。 雖然任何人都可以就這樣複製程式碼和閱讀當中的解釋，但如果你了解 [...]
SwiftUI Map 視圖 讓我們更簡單顯示地圖界面和客製化標註
在 SwiftUI 框架剛發佈時，開發者需要包裝 MKMapView 類別，來將地圖嵌入到一個 SwiftUI App 中。隨著 Xcode 12 推出，最新版本的 SwiftUI 提供了本機 SwiftUI Map 視圖，讓我們顯示地圖界面。另外，我們還可以使用內建的標註 (annotations) 視圖（像是 MapMarker）顯示標註。 [...]
在 SwiftUI 構建簡單的數據視覺化工具：圓餅圖 (Pie Chart)
Apple 在 2019 年推出了 SwiftUI，為我們提供了一個輕巧易用的工具，來創建使用者界面。這系列的教學文章，會讓大家看看如何利用 SwiftUI 框架，構建簡單而漂亮的數據視覺化工具 (data visualization tool)。在第三篇文章中，我們會介紹如何構建圓餅圖 (pie chart)。 什麼是圓餅圖？ [...]
利用 SwiftUI 簡單構建傳統的數據視覺化工具：長條圖 (Bar Chart)
Apple 在 2019 年推出了 SwiftUI，為我們提供了一個輕巧易用的工具，來創建用戶界面。這系列的教學文章，會讓大家看看如何利用 SwiftUI 框架，構建簡單而漂亮的數據視覺化工具 (data visualization tool)。這是第二篇教學文章，我們將會介紹傳統耐用的長條圖 (bar chart)。 [...]
10 個 SwiftUI Libraries 為你大大提高開發速度！
SwiftUI 真的改變了我們設計 iOS App，以及我們對 iOS App 的印象。SwiftUI 在 WWDC 2019 亮相後，Apple 引入大量新視圖、屬性包裝器 (property wrapper) 和客製化型別，進一步完善了其功能。 但是，宣告式 (declarative) 框架仍然處於起步階段。SwiftUI 的 bugs 令我們在開發時難以使用這些框架，而且 [...]
在 SwiftUI 構建漂亮的數據視覺化工具：雷達圖 (Radar Chart)
Apple 在 2019 年推出了 SwiftUI，為我們提供了一個輕巧易用的工具，來創建使用者界面。這系列的教學文章，會讓大家看看如何利用 SwiftUI 框架，構建簡單而漂亮的數據視覺化工具 (data visualization tool)，而我們將會從雷達圖 (radar chart) 開始。 什麼是雷達圖？ 雷達圖（亦稱網路圖、蜘蛛網圖），是一種統計圖表，以同一點開始向不同方向延伸的軸，來表示不同的變量。讓我們先看看這篇文章會構建的雷達圖： [...]
在 SwiftUI 利用 Path 和 Shape 建立 iMessage 的對話框！
在這篇教學文章中，我們會學習建立 iMessage 那種有尾巴 (tail) 的對話框 (chat bubble)。這篇文章不是旨在建立一個端對端 (End-to-End) 的聊天 UI。讓我們先看看完成的範例： 實作邏輯 在 Shape Struct 中建立對話框的 Path。 這個 Shape 會以尾巴為參數，來定義形狀。 建立一個 [...]