Atom官方下載創(chuàng)建主題圖文教學

Atom是一款專業(yè)的代碼文本編輯工具，是對 GitHub 通過合作構(gòu)建更好軟件的主要使命的完美補充，本軟件一直在進行持續(xù)的更新，想圍繞文本編輯器建立一個繁榮、持久的社區(qū)，它必須是開源的，是免費的，添加應(yīng)用程序和上下文菜單項，操縱窗口尺寸等，需要的朋友趕緊下載體驗吧！

Atom 的界面使用 HTML 呈現(xiàn)，并通過CSS 的超集Less進行樣式設(shè)置。如果您以前沒有聽說過 Less，請不要擔心；它就像 CSS，但有一些方便的擴展。

Atom 支持兩種類型的主題：UI和Syntax。UI 主題樣式元素，例如樹視圖、選項卡、下拉列表和狀態(tài)欄。語法主題為編輯器視圖中的代碼、裝訂線和其他元素設(shè)置樣式。

Atom官方下載創(chuàng)建主題圖文教學圖1

可以從設(shè)置視圖安裝和更改主題，您可以通過選擇文件 > 首選項菜單打開該視圖，然后單擊左側(cè)導(dǎo)航中的“安裝”或“主題”選項卡。

主題非常簡單，但在開始之前熟悉一些事情仍然很有幫助：

Less 是 CSS 的超集，但它有一些非常方便的特性，比如變量。如果您不熟悉其語法，請花幾分鐘時間熟悉一下。

您可能還想查看 a 的概念package.json（如Atom 中所述package.json）。此文件用于幫助將您的主題分發(fā)給 Atom 用戶。

您的主題package.json必須包含一個theme值為ui或的鍵，syntax以便 Atom 識別并將其作為主題加載。

您可以在atom.io 主題注冊表中找到要安裝或分叉的現(xiàn)有主題。

Atom官方下載創(chuàng)建主題圖文教學圖2

讓我們創(chuàng)建您的第一個主題。

首先，按下Ctrl+Shift+P并開始輸入“生成語法主題”以生成新的主題包。選擇“生成語法主題”，系統(tǒng)會詢問您創(chuàng)建主題的路徑。讓我們打電話給我們的motif-syntax。

Atom官方下載創(chuàng)建主題圖文教學圖3

Atom 將顯示一個新窗口，顯示motif-syntax 主題，并為我們創(chuàng)建了一組默認的文件夾和文件。如果您打開設(shè)置視圖Ctrl+，并單擊左側(cè)的“主題”選項卡，您將看到“語法主題”下拉列表中列出的“主題”主題。從菜單中選擇它以激活它，現(xiàn)在當您打開編輯器時，您應(yīng)該會看到新的motif-syntax 主題正在運行。

Atom官方下載創(chuàng)建主題圖文教學圖4

打開styles/colors.less以更改已定義的各種顏色變量。例如，@red變成#f4c2c1.

然后打開styles/base.less并修改已經(jīng)定義的各種選擇器。這些選擇器為編輯器中不同部分的代碼設(shè)置樣式，例如注釋、字符串和裝訂線中的行號。

舉個例子，讓我們把.gutter background-colorinto @red。

按 重新加載 AtomAlt+Ctrl+R以查看您所做的更改反映在您的 Atom 窗口中。挺整潔的！