您好,登錄后才能下訂單哦!
系統主題,如何自定義主題 高度與陰影 陰影與輪廓 輪廓與裁剪 矢量圖 drawable染色 取色器 漣漪動畫 xml漣漪動畫 代碼漣漪動畫 狀態動畫 矢量圖動畫 路徑動畫 揭示動畫 Activity轉場動畫 共享元素轉場動畫 xml配置轉場動畫 CardView 如何兼容低版本
Material Design材料設計,是的一種新的設計風格,谷歌希望寄由此來統一各種平臺上的應用外觀和用戶體驗。
官網介紹:
http://www.google.com/design/spec/material-design/introduction.html
@android:style/Theme.Material (深色)
@android:style/Theme.Material.Light (亮色)
@android:style/Theme.Material.Light.DarkActionBar(亮色,actionbar為深色)
l 如何使用材料風格主題?
官方資料:http://developer.android.com/training/material/theme.html或
file:///D:/Android/android-sdk-windows/docs/training/material/theme.html
顏色取色器:
http://www.materialpalette.com/
(1)定義主題:
<!-- api21以上版本生效 --> <style name="RedTheme" parent="android:Theme.Material"> |
(2)使用主題:(有兩種方式)
a) 配置文件中配置
<application |
b) 代碼方式:
protected void onCreate(Bundle savedInstanceState) { |
l 通過V7(部分)包兼容低版本
(1)添加support v7包
在build.gradle的dependencies節點下添加:
compile 'com.android.support:appcompat-v7:23.0.3' |
(2)使用Theme.AppCompat主題
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar"> |
(3)繼承AppCompatActivity
界面不再繼承 Activity, FragmentActivity 或ActionBarActivity, 而是繼承AppCompatActivity, 目的是為了將MD的風格,
及Toolbar等新的特效兼容到低版本。
注意:V7包只是兼容了材料主題的部分功能,一些主題樣式目前在低版本還無法使用
如:導航欄樣式修改;
n 陰影大小Z = elevation + translationZ (elevation是相對于父控件的高度)
n 比父控件的高寬小,才能顯示陰影
n 高度(陰影大小)決定了View的遮蓋關系
陰影效果設置:
android:elevation="4dp" android:translationZ="4dp" |
n 指定控件的輪廓
// 默認為background android:outlineProvider="none|background|bounds|paddedBounds" |
n 若控件背景為半透明的shape或圖片,則不會產生陰影。需要在代碼中設置。
// 代碼設置輪廓 |
n 裁剪視圖可以輕松改變視圖形狀;
n 裁剪方法:
通過mView.clipToOutline(true)或android:clipToOutline="true"
將視圖裁剪成輪廓指定形狀
n 不是所有輪廓都可裁剪:
僅有矩形、圓形和圓角矩形輪廓支持裁剪,Path、橢圓無法進行裁剪;
可通過Outline.canClip()判斷指定的輪廓是否可裁剪:
mTextView.setOutlineProvider(new ViewOutlineProvider() { // 指定輪廓:圓形 // 指定輪廓:圓角矩形 cut2.setText("判斷是否可裁剪: " + outline.canClip()); |
n 十六種PorterDuffXfermode(參考ApiDemo:graphics / xfermodes)
從上面我們可以看到PorterDuff.Mode為枚舉類,一共有16個枚舉值:
1.PorterDuff.Mode.CLEAR
所繪制不會提交到畫布上。
2.PorterDuff.Mode.SRC
顯示上層繪制圖片
3.PorterDuff.Mode.DST
顯示下層繪制圖片
4.PorterDuff.Mode.SRC_OVER
正常繪制顯示,上下層繪制疊蓋。
5.PorterDuff.Mode.DST_OVER
上下層都顯示。下層居上顯示。
6.PorterDuff.Mode.SRC_IN
取兩層繪制交集。顯示上層。
7.PorterDuff.Mode.DST_IN
取兩層繪制交集。顯示下層。
8.PorterDuff.Mode.SRC_OUT
取上層繪制非交集部分。
9.PorterDuff.Mode.DST_OUT
取下層繪制非交集部分。
10.PorterDuff.Mode.SRC_ATOP
取下層非交集部分與上層交集部分
11.PorterDuff.Mode.DST_ATOP
取上層非交集部分與下層交集部分
12.PorterDuff.Mode.XOR
異或:去除兩圖層交集部分
13.PorterDuff.Mode.DARKEN
取兩圖層全部區域,交集部分顏色加深
14.PorterDuff.Mode.LIGHTEN
取兩圖層全部,點亮交集部分顏色
15.PorterDuff.Mode.MULTIPLY
取兩圖層交集部分疊加后顏色
16.PorterDuff.Mode.SCREEN
取兩圖層全部區域,交集部分變為透明色
n tint模式
android:background="@drawable/ring"
android:backgroundTint="@color/color_tint" //tint顏色
android:backgroundTintMode="add" // 染色模式
n 一張圖片實現選擇器:
按下的樣式:drawable/ring_tint.xml
<?xml version="1.0" encoding="utf-8"?> |
選擇器的定義:
<?xml version="1.0" encoding="utf-8"?> |
Palette:調色板,取色板,它是v7包中的類: android.support.v7.graphics.Palette
可以用來獲取一張圖片中的顏色值。
Vibrant 鮮艷的
Vibrant dark 鮮艷的暗色
Vibrant light 鮮艷的亮色
Muted 柔和的
Muted dark 柔和的暗色
Muted light 柔和的亮色
Bitmap bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.palette); // 對圖片取色是一個比較消耗性能的操作,其內部會在子線程中運行。 |
l SVG: 矢量圖可以用一個根節點為svg的xml文件表示;
l w3矢量圖文檔: https://www.w3.org/TR/SVG11/paths.html
l 繪制矢量圖: http://editor.method.ac/
l Svg --> vector:http://inloop.github.io/svg2android/
要在android中顯示矢量圖,需要把svg文件轉換為vector文件
<LinearLayout
|
// drawable/heart.xml <?xml version="1.0" encoding="utf-8"?> |
在MaterialDesign設計中,為用戶與app交互反饋他們的動作行為和提供了視覺上的連貫性。Material主題為控件和Activity的過渡提供了一些默認的動畫,在android L上,允許自定義這些動畫:
Touch feedback 觸摸反饋動畫 (水波紋動畫,漣漪動畫)
Circular Revealanimation 圓形揭示動畫
Path-based animations 基于路徑的動畫(Curvedmotion曲線運動)
View state changes 視圖狀態動畫
Vector Drawables 矢量圖動畫
Activity transitionsActivity轉場動畫
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。