homeassistant 篇三:在ui介面中配置儀表盤 - Markdown Card的介紹與...

作者:紫殤情結

在上一篇中,我展示了目前正在使用的Dashboard的樣式以及大致的配置方法,這一篇著重介紹其中的一個卡片:Markdown Card

介紹

Markdown Card現在最新版本的hass中,是預設自帶的卡片,無需額外安裝即可使用

ps:這個是我很喜歡用的卡片,在我的Dashboard中有很多地方用到了

比如下圖

homeassistant 篇三:在ui介面中配置儀表盤 - Markdown Card的介紹與...

使用

想要用好這個卡片,首先要了解markdown語法,Markdown是一個很常用的語法格式,也比較簡單,網上有很多教程,在這就不水字數了

在hass中Markdown Card支援模板,所以可以透過模板獲取實體的各種狀態、屬性等,達到想要的效果。

上圖中的三個卡片都是透過Markdown Card完成的。其中,左邊最長的這個,是每天推送一個故宮文物,以此舉例

1 新增卡片

在儀表盤中,點選右上角三個點,選擇編輯儀表盤

點選新增卡片

選擇markdown卡片即可

2 文字內容

剛添加了markdown card後,預設會帶有如下內容

The **Markdown** card allows you to write any text。 You can style it **bold**, *italicized*, ~strikethrough~ etc。 You can do images, links, and more。

For more information see the [Markdown Cheatsheet](https://commonmark。org/help)。

homeassistant 篇三:在ui介面中配置儀表盤 - Markdown Card的介紹與...

這個演示了文字的加粗、斜體、刪除、超連結等等最基礎的markdown語法,我們刪掉即可

3 獲取實體狀態

比如可以透過模板來獲取指定實體的狀態

{{states(‘fan。broan’)}}

顯示為風扇的狀態

off

4 獲取實體屬性

比如透過屬性名來獲取指定實體的屬性值

{{state_attr(‘fan。broan’, ‘icon’)}}

顯示為風扇所用的icon

mdi:air-conditioner

5 使用icon

Markdown Card中可以使用hass的icon,具體格式為

homeassistant 篇三:在ui介面中配置儀表盤 - Markdown Card的介紹與...

如上圖,mdi:script-text-outline是我想使用的圖示,配合# 我把圖示成功放到了標題中

同樣的還有 朝代、作者我放在同一行顯示,作為副標題

#

詩詞

## {{ state_attr(‘sensor。mei_ri_shi_ci’, ‘origin’)[‘dynasty’] }}  {{ state_attr(‘sensor。mei_ri_shi_ci’, ‘origin’)[‘author’] }}

homeassistant 篇三:在ui介面中配置儀表盤 - Markdown Card的介紹與...

6 使用迴圈

當某些想要的屬性太長時,可能會影響卡片的排版,導致整個Dashboard變得很難看,這時,要麼增加樣式,限制卡片的高度(ps。我搞不定),要不就控制輸出

homeassistant 篇三:在ui介面中配置儀表盤 - Markdown Card的介紹與...

如上的實體中,為想要取content的內容,那麼透過迴圈來控制取的行數

首先,將content屬性取出,作為一個列表,再迴圈這個列表到指定次數即可

{% set content_list = state_attr(‘sensor。mei_ri_shi_ci’, ‘origin’)[‘content’] | list %}  # content取出當作列表

{% for content in content_list[0:10] %}  # 控制取列表中的0-10行

*{{ content }}*

{% endfor %}

這樣,透過markdown完整的顯示出一個每日詩詞的卡片了

homeassistant 篇三:在ui介面中配置儀表盤 - Markdown Card的介紹與...

附上完整程式碼

詩詞

### {{ state_attr(‘sensor。mei_ri_shi_ci’, ‘origin’)[‘title’] }}

#### {{ state_attr(‘sensor。mei_ri_shi_ci’, ‘origin’)[‘dynasty’] }}  {{ state_attr(‘sensor。mei_ri_shi_ci’, ‘origin’)[‘author’] }}

{% set content_list = state_attr(‘sensor。mei_ri_shi_ci’, ‘origin’)[‘content’] | list %}

{% for content in content_list[0:10] %}

*{{ content }}*

{% endfor %}

頂部