付費限定

🖥️練習用 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
以往對於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 Pro 換成 Steam Deck OLED
Thumbnail
將我的 Macbook Pro 換成 Steam Deck OLED
Thumbnail
當時間變少之後,看戲反而變得更加重要——這是在成為母親之後,我第一次誠實地面對這一件事:我沒有那麼多的晚上,可以任性地留給自己了。看戲不再只是「今天有沒有空」,而是牽動整個週末的結構,誰應該照顧孩子,我該在什麼時間回到家,隔天還有沒有精神帶小孩⋯⋯於是,我不得不學會一件以前並不擅長的事:挑選。
Thumbnail
當時間變少之後,看戲反而變得更加重要——這是在成為母親之後,我第一次誠實地面對這一件事:我沒有那麼多的晚上,可以任性地留給自己了。看戲不再只是「今天有沒有空」,而是牽動整個週末的結構,誰應該照顧孩子,我該在什麼時間回到家,隔天還有沒有精神帶小孩⋯⋯於是,我不得不學會一件以前並不擅長的事:挑選。
Thumbnail
本文深度解析賽勒布倫尼科夫的舞臺作品《傳奇:帕拉贊諾夫的十段殘篇》,如何以十段殘篇,結合帕拉贊諾夫的電影美學、象徵意象與當代政治流亡抗爭,探討藝術在儀式消失的現代社會如何承接意義,並展現不羈的自由靈魂。
Thumbnail
本文深度解析賽勒布倫尼科夫的舞臺作品《傳奇:帕拉贊諾夫的十段殘篇》,如何以十段殘篇,結合帕拉贊諾夫的電影美學、象徵意象與當代政治流亡抗爭,探討藝術在儀式消失的現代社會如何承接意義,並展現不羈的自由靈魂。
Thumbnail
Macbook的Siri聲音聽起來不錯,幫忙朗讀網頁原文文章吧! 朗讀中...~@3V#=%^$*> 怎麼朗讀的聲音這麼像機器人...(╯°Д°)╯︵ /(.□ . \)...啊 案例中,相信對於內建朗讀功能心灰意冷...ಠ_ಠ 開始在搜尋引擎或擴充功能搜尋欄中,輸入關鍵字“讀、...
Thumbnail
Macbook的Siri聲音聽起來不錯,幫忙朗讀網頁原文文章吧! 朗讀中...~@3V#=%^$*> 怎麼朗讀的聲音這麼像機器人...(╯°Д°)╯︵ /(.□ . \)...啊 案例中,相信對於內建朗讀功能心灰意冷...ಠ_ಠ 開始在搜尋引擎或擴充功能搜尋欄中,輸入關鍵字“讀、...
Thumbnail
如果你已經習慣使用 Mac 蘋果電腦, 像是 MacBook Air、Macbook Pro 或是 iMac 來工作、 娛樂或查資料的話,那你一定很熟悉基本操作, 但其實還有蘋果電腦還有非常多隱藏的 Mac 功能與實用小技巧喔! 不論是應用在文書、辦公等等都非常實用,讓你在使用上更方便更有效
Thumbnail
如果你已經習慣使用 Mac 蘋果電腦, 像是 MacBook Air、Macbook Pro 或是 iMac 來工作、 娛樂或查資料的話,那你一定很熟悉基本操作, 但其實還有蘋果電腦還有非常多隱藏的 Mac 功能與實用小技巧喔! 不論是應用在文書、辦公等等都非常實用,讓你在使用上更方便更有效
Thumbnail
購買連結:https://r.zecz.ec/vG6c 歡迎至IG私訊領取折扣碼,或填寫表單領取折扣碼 若有疑問歡迎來信momoco12355@gmail.com 今天想和大家分享一下,即將上市的這款
Thumbnail
購買連結:https://r.zecz.ec/vG6c 歡迎至IG私訊領取折扣碼,或填寫表單領取折扣碼 若有疑問歡迎來信momoco12355@gmail.com 今天想和大家分享一下,即將上市的這款
Thumbnail
花了一點時間研究自己喜歡的寫作模式,最後決定以 UpNote 為寫作軟體,使用經驗目前體驗上都還不錯。
Thumbnail
花了一點時間研究自己喜歡的寫作模式,最後決定以 UpNote 為寫作軟體,使用經驗目前體驗上都還不錯。
Thumbnail
全新版本的《三便士歌劇》如何不落入「復刻經典」的巢臼,反而利用華麗的秀場視覺,引導觀眾在晚期資本主義的消費愉悅之中,而能驚覺「批判」本身亦可能被收編——而當絞繩升起,這場關於如何生存的黑色遊戲,又將帶領新時代的我們走向何種後現代的自我解構?
Thumbnail
全新版本的《三便士歌劇》如何不落入「復刻經典」的巢臼,反而利用華麗的秀場視覺,引導觀眾在晚期資本主義的消費愉悅之中,而能驚覺「批判」本身亦可能被收編——而當絞繩升起,這場關於如何生存的黑色遊戲,又將帶領新時代的我們走向何種後現代的自我解構?
Thumbnail
5 月,方格創作島正式開島。這是一趟 28 天的創作旅程。活動期間,每週都會有新的任務地圖與陪跑計畫,從最簡單的帳號使用、沙龍建立,到帶著你從一句話、一張照片開始,一步一步找到屬於自己的創作節奏。不需要長篇大論,不需要完美的文筆,只需要帶上你今天的日常,就可以出發。征服創作島,抱回靈感與大獎!
Thumbnail
5 月,方格創作島正式開島。這是一趟 28 天的創作旅程。活動期間,每週都會有新的任務地圖與陪跑計畫,從最簡單的帳號使用、沙龍建立,到帶著你從一句話、一張照片開始,一步一步找到屬於自己的創作節奏。不需要長篇大論,不需要完美的文筆,只需要帶上你今天的日常,就可以出發。征服創作島,抱回靈感與大獎!
Thumbnail
📢 精選 Apple 3C 皮革配件 折扣專區 📌爲科技生活保有手感與溫度 #Pp貓 #Apple #蘋果 #蘋果手機 #精選 #3C #皮革 #配件 #皮革配件 #優惠 #優惠專區 #折扣 #折扣專區 #Alto #義大利 (😁喜歡我的分享內容,請幫我點擊看一下~謝謝!) ⬇️說明
Thumbnail
📢 精選 Apple 3C 皮革配件 折扣專區 📌爲科技生活保有手感與溫度 #Pp貓 #Apple #蘋果 #蘋果手機 #精選 #3C #皮革 #配件 #皮革配件 #優惠 #優惠專區 #折扣 #折扣專區 #Alto #義大利 (😁喜歡我的分享內容,請幫我點擊看一下~謝謝!) ⬇️說明
追蹤感興趣的內容從 Google News 追蹤更多 vocus 的最新精選內容追蹤 Google News