Android Material Design向下兼容至低版本Android SDK设备
新版的Android Material Design增加了一些很多有趣、有意思的设计元素和风格,比如最近比较常见的Floating Action Button等等。这在新版的Android L,Android 6.0中随处可见。然而Android Material Design在标准的Android低版本SDK中无法使用,比如现在常用的Floating Action Button:
还有SnackBar:
等等,在Android L上可以直接使用原生Android SDK API实现。
但是还是有第三方的开源库,帮助开发者向下兼容,将Android Material Design的优秀设计元素向下支持到低版Android设备上。
MaterialDesignLibrary就是这样的第三方开源库,其在github上的网址链接:https://github.com/navasmdc/MaterialDesignLibrary
MaterialDesignLibrary的作用和目的:“This is a library with components of Android L to you use in android 2.2”。
简言之,就是让低版本Android使用上最新的Android L中新的组件。
MaterialDesignLibrary使用方法:
(1)直接将其开发包从github上下载,然后解压导入成一个Android库即可。需要注意的是,MaterialDesignLibrary现在是一个基于gradle的库,如果是Eclipse开发者,则需要一定的转换,或者直接将解压后,目录结构MaterialDesignLibrary-master\MaterialDesignLibrary-master\MaterialDesignLibrary\MaterialDesign\src\main下的代码直接导入到Eclipse工程中作为库也可以,不过需要将该目录下的java目录名整合到Eclipse下的标准src目录,最终导入后代码和工程结构如图:
(2)到这里还没完,因为MaterialDesignLibrary向下兼容开发,作者使用了另外一个第三方库NineOldAndroids,NineOldAndroids库就是帮助一些高版本的Android代码向下兼容设计的。NineOldAndroids在github上的网址链接:https://github.com/JakeWharton/NineOldAndroids
NineOldAndroids也是一个在gradle上的项目库,如果是Eclipse开发者,则需要将其中Eclipse需要的库包分离出来,Eclipse需要的库的代码在 \MaterialDesignLibrary-master\MaterialDesignLibrary-master\MaterialDesignLibrary\MaterialDesign\src\main目录下,直接将其导入到Eclipse下作为库即可,但需要调整这个目录下的java代码到Eclipse结构下的src目录中,如图:
(3)前两步导入后,就要开始添加库引用了。需要注意的是:MaterialDesignLibrary和NineOldAndroids本身就是Android库而不是一个Android APP;而MaterialDesignLibrary又引用了NineOldAndroids。
在我们自己的代码开发中,直接添加对MaterialDesignLibrary库的引用即可。就可以像Android L那样使用Floating Action Button、Snackbar等等了。
现在把MaterialDesignLibrary库中的一个演示Floating action button的Activity:ButtonsActivity.java抽出来供参考:
package com.gc.materialdesigndemo.ui; import android.annotation.SuppressLint; import android.app.Activity; import android.graphics.Color; import android.os.Bundle; import android.view.Window; import com.gc.materialdesigndemo.R; public class ButtonsActivity extends Activity { int backgroundColor = Color.parseColor("#1E88E5"); @SuppressLint("NewApi") @Override protected void onCreate(Bundle savedInstanceState) { requestWindowFeature(Window.FEATURE_NO_TITLE); super.onCreate(savedInstanceState); setContentView(R.layout.activity_buttons); int color = getIntent().getIntExtra("BACKGROUND", Color.BLACK); findViewById(R.id.buttonflat).setBackgroundColor(color); findViewById(R.id.button).setBackgroundColor(color); findViewById(R.id.buttonFloatSmall).setBackgroundColor(color); findViewById(R.id.buttonIcon).setBackgroundColor(color); findViewById(R.id.buttonFloat).setBackgroundColor(color); } }
ButtonsActivity.java的布局文件activity_buttons.xml:
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:materialdesign="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent" android:background="#FFF" > <com.gc.materialdesign.views.ScrollView android:layout_width="fill_parent" android:layout_height="fill_parent" > <LinearLayout android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" > <!-- FLAT BUTTON --> <RelativeLayout android:layout_width="fill_parent" android:layout_height="32dp" android:layout_marginLeft="24dp" > <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerVertical="true" android:text="Flat Button" /> <View android:layout_width="fill_parent" android:layout_height="1dp" android:layout_alignParentBottom="true" android:background="#1E88E5" /> </RelativeLayout> <RelativeLayout android:layout_width="fill_parent" android:layout_height="72dp" > <com.gc.materialdesign.views.ButtonFlat android:id="@+id/buttonflat" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerInParent="true" android:text="Button" android:textColor="#ffffff" /> </RelativeLayout> <!-- RECTANGLE BUTTON --> <RelativeLayout android:layout_width="fill_parent" android:layout_height="32dp" android:layout_marginLeft="24dp" > <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerVertical="true" android:text="Rectangle Button" /> <View android:layout_width="fill_parent" android:layout_height="1dp" android:layout_alignParentBottom="true" android:background="#1E88E5" /> </RelativeLayout> <RelativeLayout android:layout_width="fill_parent" android:layout_height="72dp" > <com.gc.materialdesign.views.ButtonRectangle android:id="@+id/button" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerInParent="true" android:background="#1E88E5" android:text="Button" /> </RelativeLayout> <!-- SMALL FLOAT BUTTON --> <RelativeLayout android:layout_width="fill_parent" android:layout_height="32dp" android:layout_marginLeft="24dp" > <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerVertical="true" android:text="Small Float Button" /> <View android:layout_width="fill_parent" android:layout_height="1dp" android:layout_alignParentBottom="true" android:background="#1E88E5" /> </RelativeLayout> <RelativeLayout android:layout_width="fill_parent" android:layout_height="72dp" > <com.gc.materialdesign.views.ButtonFloatSmall android:id="@+id/buttonFloatSmall" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerInParent="true" android:background="#1E88E5" materialdesign:iconDrawable="@drawable/ic_action_new" /> </RelativeLayout> <!-- FLOAT BUTTON --> <RelativeLayout android:layout_width="fill_parent" android:layout_height="32dp" android:layout_marginLeft="24dp" > <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerVertical="true" android:text="Icon Button" /> <View android:layout_width="fill_parent" android:layout_height="1dp" android:layout_alignParentBottom="true" android:background="#1E88E5" /> </RelativeLayout> <RelativeLayout android:layout_width="fill_parent" android:layout_height="72dp" > <com.gc.materialdesign.views.ButtonIcon android:id="@+id/buttonIcon" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerInParent="true" android:background="#1E88E5" materialdesign:iconDrawable="@drawable/ic_next" /> </RelativeLayout> <!-- FLOAT BUTTON --> <RelativeLayout android:layout_width="fill_parent" android:layout_height="32dp" android:layout_marginLeft="24dp" > <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerVertical="true" android:text="Float Button" /> <View android:layout_width="fill_parent" android:layout_height="1dp" android:layout_alignParentBottom="true" android:background="#1E88E5" /> </RelativeLayout> </LinearLayout> </com.gc.materialdesign.views.ScrollView> <com.gc.materialdesign.views.ButtonFloat android:id="@+id/buttonFloat" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_alignParentRight="true" android:layout_marginRight="24dp" android:background="#1E88E5" materialdesign:animate="true" materialdesign:iconDrawable="@drawable/ic_action_new" /> </RelativeLayout>
其运行效果图就是本文中的第1图显示的那样。
我把全部的代码工程(MaterialDesignLibrary库,NineOldAndroids库,以及一个测试MaterialDesignLibrary的项目MaterialDesignActivity)上传到CSDN上供下载使用,CSDN下载页面:http://download.csdn.net/detail/zhangphil/9124325
将这个压缩文件下载后逐个导入,正确添加库引用后,就可以直接跑MaterialDesignActivity查看运行结果了。