快捷導(dǎo)航

Android自定義View Material Design理念詳解

更新時(shí)間：2023年02月02日 09:26:43 作者：dora

這篇文章主要為大家介紹了Android自定義View Material Design理念詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪

正文

Material Design（原材料設(shè)計(jì)），簡稱MD。Android對MD的支持始于Android5.0，也就是API21，我們一般做應(yīng)用適配也是到API21，所以，適配的最舊的手機(jī)也是帶Material Design的。這里我不得不給Google的良苦用心點(diǎn)個贊，自從Google向Apple手機(jī)美麗的UI系統(tǒng)發(fā)起挑戰(zhàn)，推出MD以來，那黑不溜秋且無法修改的狀態(tài)欄就退出歷史舞臺了。

MD設(shè)計(jì)理念

體現(xiàn)更多的物理事件的特征，比如邊緣的投影、層級清晰。顏色更加鮮艷，動畫效果更加突出，更有代入感，一下子精氣神都來了。最主要的是Google想統(tǒng)一Android UI的風(fēng)格，我們配合一下，哈哈哈。

為什么推薦使用MD

在公司的項(xiàng)目開發(fā)過程中，能用系統(tǒng)的控件就盡量使用系統(tǒng)的，因?yàn)橄到y(tǒng)控件具有更佳的性能和穩(wěn)定性優(yōu)勢，且被廣泛開發(fā)者所使用，有利于別人接手項(xiàng)目的開發(fā)。MD的控件由于是官方推出的，所以也作為系統(tǒng)控件的擴(kuò)展控件來使用。

使用MD主題

1.依賴庫

implementation 'com.google.android.material:material:1.7.0'

2.定義一個應(yīng)用主題繼承自MD的主題

<style name="Theme.MyApplication" parent="Theme.MaterialComponents.DayNight.DarkActionBar">
</style>

MD主題顏色的名稱

常用MD控件使用

Snackbar

// 常駐底部的提示信息
Snackbar.make(view, "青春常駐", Snackbar.LENGTH_INDEFINITE).show()
// 短時(shí)間消失的提示信息
Snackbar.make(view, "短暫而精彩", Snackbar.LENGTH_SHORT).show()
// 長一點(diǎn)時(shí)間消失的提示信息
Snackbar.make(view, "長命百歲", Snackbar.LENGTH_LONG).show()

CardView

<androidx.cardview.widget.CardView
        android:layout_width="100dp"
        android:layout_height="60dp"
        android:layout_centerInParent="true"
        android:padding="10dp"
        app:cardBackgroundColor="@color/cardview_shadow_end_color"
        app:cardCornerRadius="4dp" >
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:text="卡片中的文字"/>
</androidx.cardview.widget.CardView>

當(dāng)然，使用elevation屬性

android:elevation="10dp"

也可以實(shí)現(xiàn)類似陰影效果。

BottomSheetDialog

val textView = TextView(this)
textView.layoutParams =
    RelativeLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, 1000)
textView.gravity = Gravity.CENTER
textView.text = "BottomSheet Text"
val dialog = BottomSheetDialog(this)
dialog.setContentView(textView)
dialog.show()