Part 02 - 環境安裝與設定

Unit 02: 介面導覽

認識 Antigravity 的每一個角落

側邊欄編輯區 AI 面板終端機

本單元學習目標

1️⃣

認識介面佈局

了解各區域的位置和功能

2️⃣

掌握快捷鍵

學會最常用的鍵盤快捷鍵

3️⃣

開啟專案

學會開啟和管理專案資料夾

4️⃣

使用 AI 面板

找到並開啟 AI 對話功能

Antigravity 介面總覽

📝 編輯區
(程式碼在這裡)

🤖 AI 面板
(Agent 對話)

⌨️ 終端機 / 輸出面板

重點：介面分為四大區域，跟 VS Code 幾乎一樣！

區域 1：側邊欄 (Activity Bar)

最左邊的圖示列，用來切換不同功能面板：

📁

檔案總管

瀏覽專案中的所有檔案和資料夾

Ctrl+Shift+E

🔍

搜尋

在整個專案中搜尋文字

Ctrl+Shift+F

🌿

版本控制

Git 版本控制操作

Ctrl+Shift+G

🧩

擴充功能

安裝和管理擴充套件

Ctrl+Shift+X

檔案總管詳細操作

1開啟資料夾：點擊「Open Folder」或按 Ctrl+K Ctrl+O

2新增檔案：在資料夾上右鍵 → New File

3新增資料夾：在資料夾上右鍵 → New Folder

4重新命名：選取檔案後按 F2

5刪除檔案：選取檔案後按 Delete

區域 2：編輯區 (Editor)

中間最大的區域，用來編輯程式碼和檔案：

📑 分頁標籤

可同時開啟多個檔案，用分頁切換

📏 行號

左側顯示行號，方便定位

🎨 語法高亮

自動為程式碼上色，提高可讀性

🗺️ 迷你地圖

右側顯示整個檔案的縮略圖

提示：按住 Ctrl 點擊檔案可以在新分頁開啟！

編輯區：分割視窗

可以同時顯示多個檔案並排比較：

1水平分割：Ctrl+\ 或拖曳分頁到右邊

2垂直分割：右鍵分頁 → Split Down

[ 分割視窗示意圖 ]

┌─────────┬─────────┐
│ file1.md │ file2.md │
│ │ │
└─────────┴─────────┘

使用場景：一邊看範例，一邊寫程式碼！

區域 3：AI 面板 (最重要！)

Antigravity 獨有的 AI 代理對話區域：

開啟方式：

點擊右側的 🤖 圖示
或按 Ctrl+Shift+A

💬

對話輸入

在底部輸入框輸入你的指令

📜

對話歷史

上方顯示與 Agent 的對話記錄

AI 面板基本操作

1點擊底部輸入框（或按 Ctrl+L 快速聚焦）

2輸入你的指令，例如：幫我建立一個 hello.md 檔案

3按 Enter 送出

4等待 Agent 回應並執行任務

試試看：輸入「你好」看看 Agent 會怎麼回應！

區域 4：終端機面板

底部的終端機，可以執行命令列指令：

開啟方式：

按 Ctrl+`（數字 1 左邊的按鍵）
或選單：View → Terminal

終端機功能

執行 pandoc 等命令列工具
執行 npm、python 等開發指令
Agent 也會在這裡自動執行指令

重點：這是後面執行 Pandoc 轉換的地方！

終端機基本操作

1新增終端機：點擊 + 按鈕或 Ctrl+Shift+`

2切換終端機：點擊下拉選單選擇

3關閉終端機：輸入 exit 或點擊垃圾桶圖示

4清除畫面：輸入 cls（Windows）或 clear（Mac/Linux）

# 試試在終端機輸入：
echo "Hello Antigravity!"

重要功能：命令面板

按 Ctrl+Shift+P 開啟命令面板

這是 Antigravity 的「萬能搜尋框」，可以：

🔧 執行命令

輸入命令名稱直接執行

⚙️ 修改設定

輸入「settings」開啟設定

🎨 更換主題

輸入「theme」更換顏色主題

📦 安裝擴充

輸入「install」安裝擴充套件

記住這個快捷鍵！Ctrl+Shift+P 是最常用的！

快速開啟檔案

按 Ctrl+P 開啟快速開啟

直接輸入檔案名稱，快速找到並開啟：

[ 快速開啟示意 ]

🔍 readme
📄 README.md
📄 readme.txt
📄 src/readme.html

技巧：支援模糊搜尋，輸入 rdm 也能找到 README.md！

必學快捷鍵總表

功能	Windows / Linux	macOS
命令面板	Ctrl+Shift+P	Cmd+Shift+P
快速開啟檔案	Ctrl+P	Cmd+P
開啟終端機	Ctrl+`	Cmd+`
開啟 AI 面板	Ctrl+Shift+A	Cmd+Shift+A
儲存檔案	Ctrl+S	Cmd+S
全部儲存	Ctrl+K S	Cmd+K S

實作練習 1：開啟專案資料夾

1按 Ctrl+K 然後 Ctrl+O

2選擇任意一個資料夾（例如桌面）

3點擊「選擇資料夾」

4確認左側檔案總管顯示該資料夾的內容

成功標準：左側出現資料夾名稱和檔案列表！

實作練習 2：建立新檔案

1在左側檔案總管的資料夾名稱上右鍵

2選擇「New File」

3輸入檔名：test.md

4按 Enter 確認

5在編輯區輸入：# 這是我的第一個檔案

6按 Ctrl+S 儲存

實作練習 3：使用 AI 面板

1按 Ctrl+Shift+A 開啟 AI 面板

2在輸入框輸入：請說「哈囉」

3按 Enter 送出

4等待 Agent 回應

成功標準：Agent 回應「哈囉」或類似的問候！

實作練習 4：使用終端機

1按 Ctrl+` 開啟終端機

2輸入以下指令並按 Enter：

echo "Antigravity 終端機測試成功！"

3確認終端機顯示：Antigravity 終端機測試成功！

成功標準：終端機正確顯示輸出文字！

隨堂測驗 1

問題：開啟命令面板的快捷鍵是什麼？

Ctrl+P
Ctrl+Shift+P
Ctrl+`
Ctrl+S

✅ 測驗 1 解答

答案：(2) Ctrl+Shift+P

解釋：

Ctrl+P：快速開啟檔案
Ctrl+Shift+P：命令面板（正解）
Ctrl+`：開啟終端機
Ctrl+S：儲存檔案

隨堂測驗 2

問題：Antigravity 的 AI 面板位於介面的哪個位置？

左側
上方
右側
底部

✅ 測驗 2 解答

答案：(3) 右側

解釋：Antigravity 的 AI 面板預設在右側，這樣可以一邊看程式碼（中間），一邊與 Agent 對話（右側）。

Unit 02 總結

📁

側邊欄

檔案總管、搜尋、版本控制

📝

編輯區

撰寫和編輯程式碼

🤖

AI 面板

與 Agent 對話互動

⌨️

終端機

執行命令列指令

下一步：Unit 03

學習如何選擇和切換 AI 模型（Gemini / Claude）！