【Interface&navigation】材料設計(20)

材料設計是跨平臺和設備的視覺,動作和交互設計的綜合指南。要在Android應用程序中使用材料設計,請遵循材料設計規範中定義的準則,並使用材料設計支持庫中提供的新組件和樣式。此頁面提供了您應該使用的模式和API的概述。

Android提供以下功能來幫助您構建材料設計應用程序:

用於設置所有UI小部件樣式的材質設計應用主題
用於複雜視圖的小部件,例如列表和卡片
用於自定義陰影和動畫的新API

視頻:https://youtu.be/YaG_ljfzeUw

材料主題和小部件


要利用標準UI小部件的樣式等材質功能,並簡化應用的樣式定義,請將基於材質的主題應用於您的應用。

【Interface&navigation】材料設計(20)

黑暗的材料主題
【Interface&navigation】材料設計(20)
輕質材料主題

有關更多信息,請參閱如何 應用材質主題。

要爲您的用戶提供熟悉的體驗,請使用材料最常見的UX模式:

使用浮動操作按鈕(FAB)提升UI的主要操作。
使用App Bar顯示您的品牌,導航,搜索和其他操作。
使用導航抽屜顯示和隱藏應用程序的導航。
使用許多其他材質組件之一進行應用佈局和導航,例如摺疊工具欄,標籤,底部導航欄等。要查看所有內容,請查看適用於Android目錄的 Material Components
並儘可能使用預定義的材料圖標。例如,導航抽屜的導航“菜單”按鈕應使用標準的“漢堡包”圖標。有關可用圖標的列表,請參閱材料設計圖標。您還可以使用Android Studio的Vector Asset Studio從材質圖標庫導入SVG圖標。

海拔陰影和卡片


除了X和Y屬性之外,Android中的視圖還具有Z屬性。此新屬性表示視圖的高程,該高程確定:

陰影的大小:具有較高Z值的視圖會投射更大的陰影。
繪圖順序:具有較高Z值的視圖顯示在其他視圖的頂部。

【Interface&navigation】材料設計(20)

當您的佈局包含基於卡片的佈局時,通常會應用高程,這有助於您在卡片中顯示提供材質外觀的重要信息。您可以使用CardView窗口小部件創建具有默認高程的卡片。有關更多信息,請參閱 創建基於卡的佈局。

有關向其他視圖添加高程的信息,請參閱創建陰影和剪輯視圖。

動畫


新的動畫API允許您爲UI控件中的觸摸反饋,視圖狀態的更改和活動轉換創建自定義動畫。

這些API可以讓您:

使用觸摸反饋動畫響應視圖中的觸摸事件。
使用圓形顯示動畫隱藏和顯示視圖。
使用自定義活動轉換動畫在活動之間切換。
使用彎曲動作創建更自然的動畫。
使用視圖狀態更改動畫爲一個或多個視圖屬性中的更改設置動畫。
在視圖狀態更改之間的狀態列表drawable中 顯示動畫。
觸摸反饋動畫內置於多個標準視圖中,例如按鈕。新API允許您自定義這些動畫並將其添加到自定義視圖中。

有關更多信息,請參閱動畫概述。

可繪


這些用於drawable的新功能可幫助您實現材料設計應用程序:

矢量drawables可擴展而不會丟失定義,非常適合單色應用程序內圖標。瞭解有關矢量繪圖的更多信息。
可繪製着色允許您將位圖定義爲alpha蒙版,並在運行時使用顏色對其進行着色。瞭解如何爲drawable添加色調。
通過顏色提取,您可以從位圖圖像中自動提取突出的顏色。瞭解如何使用Palette API選擇顏色。

聯繫我

QQ:94297366
微信打賞:https://pan.baidu.com/s/1dSBXk3eFZu3mAMkw3xu9KQ

公衆號推薦:

【Interface&navigation】材料設計(20)

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章