付費限定

🖥️練習用 SwiftUI 畫 Mac mini:從俯視角開始

更新 發佈閱讀 5 分鐘

前一篇文章💻學習 SwiftUI:為什麼從畫 Mac 開始?的反應比預期熱烈。所以我決定延伸一下,分篇說明怎麼畫 Mac mini。

這是我的實作與 Preview 截圖:

MacminiM4TopView 與 Preview

MacminiM4TopView 與 Preview

程式碼如下:

import SwiftUI

struct MacminiM4TopView: View {
private let bodyWidth = 512.0

var body: some View {
RoundedRectangle(cornerRadius: bodyWidth / 4)
.aspectRatio(1, contentMode: .fit)
.foregroundStyle(
LinearGradient(
colors: [Color(white: 0.9), Color(white: 0.8)],
startPoint: .topTrailing,
endPoint: .bottomLeading
)
)
.frame(width: bodyWidth)
.overlay {
Image(systemName: "apple.logo")
.resizable()
.aspectRatio(contentMode: .fit)
.frame(width: bodyWidth / 3.5)
.foregroundStyle(Color.black)
}
}
}

#Preview("Top View") {
MacminiM4TopView()
}

以下說明實作重點。

創作者正在準備中
請加入 13+ 了解最新動態!
留言
avatar-img
13+
3.5K會員
161內容數
13 以 10+ 年 iOS 開發經驗為基礎撰寫,助你在 AI 時代成為更有自信的技術工作者。 ❤️ 支持 13 創作! 🤖 AI 工具實戰經驗與深度思考 🧠 軟體開發思維、職涯發展建議 💡 實用技巧與踩坑經驗分享 😔 開發者身心健康與職業傷害
13+的其他內容
2025/10/13
學 SwiftUI 排版最單純又有趣的方式,就是拿它來畫東西。我在新手練習時畫過 MacBook Air 鍵盤,最近又為了教學畫了 Mac mini,程式碼都有開源供參考。
Thumbnail
2025/10/13
學 SwiftUI 排版最單純又有趣的方式,就是拿它來畫東西。我在新手練習時畫過 MacBook Air 鍵盤,最近又為了教學畫了 Mac mini,程式碼都有開源供參考。
Thumbnail
2025/09/15
Swift Dependencies 的語法設計受到 SwiftUI Environment 啟發,兩者的宣告方式幾乎完全相同。透過互相對照,讓你一次學會兩種機制。
Thumbnail
2025/09/15
Swift Dependencies 的語法設計受到 SwiftUI Environment 啟發,兩者的宣告方式幾乎完全相同。透過互相對照,讓你一次學會兩種機制。
Thumbnail
2025/04/08
帶你用全新的方式學習 SwiftUI:不是從 App 介面開始,而是從你手邊的實體物品出發,練習用 SwiftUI 描述它的外觀與結構,就像用程式碼做素描。這樣的練習能幫助你熟悉 SwiftUI 的排版語法與元件拆解邏輯。
Thumbnail
2025/04/08
帶你用全新的方式學習 SwiftUI:不是從 App 介面開始,而是從你手邊的實體物品出發,練習用 SwiftUI 描述它的外觀與結構,就像用程式碼做素描。這樣的練習能幫助你熟悉 SwiftUI 的排版語法與元件拆解邏輯。
Thumbnail
看更多
你可能也想看
Thumbnail
花了一點時間研究自己喜歡的寫作模式,最後決定以 UpNote 為寫作軟體,使用經驗目前體驗上都還不錯。
Thumbnail
花了一點時間研究自己喜歡的寫作模式,最後決定以 UpNote 為寫作軟體,使用經驗目前體驗上都還不錯。
Thumbnail
背景:從冷門配角到市場主線,算力與電力被重新定價   小P從2008進入股市,每一個時期的投資亮點都不同,記得2009蘋果手機剛上市,當時蘋果只要在媒體上提到哪一間供應鏈,隔天股價就有驚人的表現,當時光學鏡頭非常熱門,因為手機第一次搭上鏡頭可以拍照,也造就傳統相機廠的殞落,如今手機已經全面普及,題
Thumbnail
背景:從冷門配角到市場主線,算力與電力被重新定價   小P從2008進入股市,每一個時期的投資亮點都不同,記得2009蘋果手機剛上市,當時蘋果只要在媒體上提到哪一間供應鏈,隔天股價就有驚人的表現,當時光學鏡頭非常熱門,因為手機第一次搭上鏡頭可以拍照,也造就傳統相機廠的殞落,如今手機已經全面普及,題
Thumbnail
購買連結:https://r.zecz.ec/vG6c 歡迎至IG私訊領取折扣碼,或填寫表單領取折扣碼 若有疑問歡迎來信[email protected] 今天想和大家分享一下,即將上市的這款
Thumbnail
購買連結:https://r.zecz.ec/vG6c 歡迎至IG私訊領取折扣碼,或填寫表單領取折扣碼 若有疑問歡迎來信[email protected] 今天想和大家分享一下,即將上市的這款
Thumbnail
將我的 Macbook Pro 換成 Steam Deck OLED
Thumbnail
將我的 Macbook Pro 換成 Steam Deck OLED
Thumbnail
《轉轉生》(Re:INCARNATION)為奈及利亞編舞家庫德斯.奧尼奎庫與 Q 舞團創作的當代舞蹈作品,結合拉各斯街頭節奏、Afrobeat/Afrobeats、以及約魯巴宇宙觀的非線性時間,建構出關於輪迴的「誕生—死亡—重生」儀式結構。本文將從約魯巴哲學概念出發,解析其去殖民的身體政治。
Thumbnail
《轉轉生》(Re:INCARNATION)為奈及利亞編舞家庫德斯.奧尼奎庫與 Q 舞團創作的當代舞蹈作品,結合拉各斯街頭節奏、Afrobeat/Afrobeats、以及約魯巴宇宙觀的非線性時間,建構出關於輪迴的「誕生—死亡—重生」儀式結構。本文將從約魯巴哲學概念出發,解析其去殖民的身體政治。
Thumbnail
這是一場修復文化與重建精神的儀式,觀眾不需要完全看懂《遊林驚夢:巧遇Hagay》,但你能感受心與土地團聚的渴望,也不急著在此處釐清或定義什麼,但你的在場感受,就是一條線索,關於如何找著自己的路徑、自己的聲音。
Thumbnail
這是一場修復文化與重建精神的儀式,觀眾不需要完全看懂《遊林驚夢:巧遇Hagay》,但你能感受心與土地團聚的渴望,也不急著在此處釐清或定義什麼,但你的在場感受,就是一條線索,關於如何找著自己的路徑、自己的聲音。
Thumbnail
如果你已經習慣使用 Mac 蘋果電腦, 像是 MacBook Air、Macbook Pro 或是 iMac 來工作、 娛樂或查資料的話,那你一定很熟悉基本操作, 但其實還有蘋果電腦還有非常多隱藏的 Mac 功能與實用小技巧喔! 不論是應用在文書、辦公等等都非常實用,讓你在使用上更方便更有效
Thumbnail
如果你已經習慣使用 Mac 蘋果電腦, 像是 MacBook Air、Macbook Pro 或是 iMac 來工作、 娛樂或查資料的話,那你一定很熟悉基本操作, 但其實還有蘋果電腦還有非常多隱藏的 Mac 功能與實用小技巧喔! 不論是應用在文書、辦公等等都非常實用,讓你在使用上更方便更有效
Thumbnail
以往對於macOS系統都不會追求要更新到最新版本,儘管許多人推的macOS Sonoma免費版釋出後,也遲遲沒有升級XD。 直到知道升級後就能透過App Store下載copilot使用GPT-4就衝動更新了!(有聽說部分人的網頁版就可以直接選擇GPT-4?)
Thumbnail
以往對於macOS系統都不會追求要更新到最新版本,儘管許多人推的macOS Sonoma免費版釋出後,也遲遲沒有升級XD。 直到知道升級後就能透過App Store下載copilot使用GPT-4就衝動更新了!(有聽說部分人的網頁版就可以直接選擇GPT-4?)
Thumbnail
Macbook的Siri聲音聽起來不錯,幫忙朗讀網頁原文文章吧! 朗讀中...~@3V#=%^$*> 怎麼朗讀的聲音這麼像機器人...(╯°Д°)╯︵ /(.□ . \)...啊 案例中,相信對於內建朗讀功能心灰意冷...ಠ_ಠ 開始在搜尋引擎或擴充功能搜尋欄中,輸入關鍵字“讀、...
Thumbnail
Macbook的Siri聲音聽起來不錯,幫忙朗讀網頁原文文章吧! 朗讀中...~@3V#=%^$*> 怎麼朗讀的聲音這麼像機器人...(╯°Д°)╯︵ /(.□ . \)...啊 案例中,相信對於內建朗讀功能心灰意冷...ಠ_ಠ 開始在搜尋引擎或擴充功能搜尋欄中,輸入關鍵字“讀、...
Thumbnail
📢 精選 Apple 3C 皮革配件 折扣專區 📌爲科技生活保有手感與溫度 #Pp貓 #Apple #蘋果 #蘋果手機 #精選 #3C #皮革 #配件 #皮革配件 #優惠 #優惠專區 #折扣 #折扣專區 #Alto #義大利 (😁喜歡我的分享內容,請幫我點擊看一下~謝謝!) ⬇️說明
Thumbnail
📢 精選 Apple 3C 皮革配件 折扣專區 📌爲科技生活保有手感與溫度 #Pp貓 #Apple #蘋果 #蘋果手機 #精選 #3C #皮革 #配件 #皮革配件 #優惠 #優惠專區 #折扣 #折扣專區 #Alto #義大利 (😁喜歡我的分享內容,請幫我點擊看一下~謝謝!) ⬇️說明
Thumbnail
本文分析導演巴里・柯斯基(Barrie Kosky)如何運用極簡的舞臺配置,將布萊希特(Bertolt Brecht)的「疏離效果」轉化為視覺奇觀與黑色幽默,探討《三便士歌劇》在當代劇場中的新詮釋,並藉由舞臺、燈光、服裝、音樂等多方面,分析該作如何在保留批判核心的同時,觸及觀眾的觀看位置與人性幽微。
Thumbnail
本文分析導演巴里・柯斯基(Barrie Kosky)如何運用極簡的舞臺配置,將布萊希特(Bertolt Brecht)的「疏離效果」轉化為視覺奇觀與黑色幽默,探討《三便士歌劇》在當代劇場中的新詮釋,並藉由舞臺、燈光、服裝、音樂等多方面,分析該作如何在保留批判核心的同時,觸及觀眾的觀看位置與人性幽微。
追蹤感興趣的內容從 Google News 追蹤更多 vocus 的最新精選內容追蹤 Google News