PART ONE
專案總覽｜功能與應用場景
這是一個 Home Assistant Lovelace 的自訂卡片，能將多張卡片垂直或水平堆疊成單一卡片，並提供統一的視覺外觀。此版本為修改版，基於 LitElement 框架並支援透過 CSS 變數自訂間距，提供比原版更現代化的佈局與樣式控制。
🔑 核心功能
- 卡片堆疊
- 統一佈局
- 自訂間距
- 支援水平堆疊
- LitElement 框架
- TypeScript 型別安全
- 網格佈局支援
📋 功能詳細說明
| 功能名稱 | 說明 |
|---|---|
| 整合房間感測器資訊 | 將一個房間內的所有感測器合併到一張卡片中，讓儀表板看起來更簡潔，資訊更集中。 |
| 建立區域控制面板 | 將客廳的所有控制開關組合成一個水平排列的控制面板，並使用自訂間距調整按鈕之間的距離。 |
PART TWO
深入解析｜執行環境與部署步驟
⚙️ 執行環境需求
- 需要 Home Assistant 2023.4 或更高版本。
- 需要現代網頁瀏覽器（Chrome、Firefox、Safari）。
- 建議透過 HACS 進行安裝管理。本分支版本需手動安裝。
🔧 部署安裝步驟
| 步驟 | 說明 |
|---|---|
| Step 1 | 從倉庫下載 vertical-stack-in-card.js 檔案。 |
| Step 2 | 將檔案複製到 Home Assistant 設定目錄下的 www 資料夾。 |
| Step 3 | 在設定 > Lovelace 儀表板 > 資源中新增資源。 |
| Step 4 | URL 設定為 /local/vertical-stack-in-card.js，類型為 JavaScript 模組。 |
| Step 5 | 在 Lovelace 儀表板中新增手動卡片。 |
| Step 6 | 設定卡片類型為 custom:vertical-stack-in-card。 |
| Step 7 | 重新整理頁面即可使用。 |
PART THREE
總結與展望｜AI Agent 部署 Prompt
🤖 AI Agent 部署 Prompt
以下是用於部署此專案的 AI Agent Prompt，可直接複製使用：
請幫我安裝並部署 HA_card_vertical-stack-in-card。 ## 專案資訊 - 倉庫位址：https://github.com/WOOWTECH/HA_card_vertical-stack-in-card - 類型：Home Assistant 主題/卡片 - 功能說明：Lovelace 自訂卡片，可垂直/水平堆疊多張卡片。 ## 環境需求 - Home Assistant 2023.4+。 - 現代網頁瀏覽器。 - 建議使用 HACS。 ## 安裝步驟 1. 下載 vertical-stack-in-card.js。 2. 複製到 /config/www/ 資料夾。 3. 在資源中新增 /local/vertical-stack-in-card.js。 4. 設定卡片類型為 custom:vertical-stack-in-card。 5. 重新整理頁面。
← 返回開源專案列表