Android Material Design向下兼容至低版本Android SDK设备

￡神魔★判官ぃ 2023-10-16 22:17 41阅读 0赞

**Android Material Design向下兼容至低版本Android SDK设备**

新版的Android Material Design增加了一些很多有趣、有意思的设计元素和风格，比如最近比较常见的Floating Action Button等等。这在新版的Android L，Android 6.0中随处可见。然而Android Material Design在标准的Android低版本SDK中无法使用，比如现在常用的Floating Action Button：

![Center][]

还有SnackBar：

![Center 1][]

等等，在Android L上可以直接使用原生Android SDK API实现。

但是还是有第三方的开源库，帮助开发者向下兼容，将Android Material Design的优秀设计元素向下支持到低版Android设备上。  
MaterialDesignLibrary就是这样的第三方开源库，其在github上的网址链接：[https://github.com/navasmdc/MaterialDesignLibrary][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目录，最终导入后代码和工程结构如图：

![Center 2][]

（2）到这里还没完，因为MaterialDesignLibrary向下兼容开发，作者使用了另外一个第三方库NineOldAndroids，NineOldAndroids库就是帮助一些高版本的Android代码向下兼容设计的。NineOldAndroids在github上的网址链接：[https://github.com/JakeWharton/NineOldAndroids][https_github.com_JakeWharton_NineOldAndroids]  
NineOldAndroids也是一个在gradle上的项目库，如果是Eclipse开发者，则需要将其中Eclipse需要的库包分离出来，Eclipse需要的库的代码在 \\MaterialDesignLibrary-master\\MaterialDesignLibrary-master\\MaterialDesignLibrary\\MaterialDesign\\src\\main目录下，直接将其导入到Eclipse下作为库即可，但需要调整这个目录下的java代码到Eclipse结构下的src目录中，如图：

![Center 3][]

（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" >
    
                
    
                <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>
                
    
                <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>
                
    
                <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>
    
                
    
                <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>
    
                
    
                <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][http_download.csdn.net_detail_zhangphil_9124325]  
将这个压缩文件下载后逐个导入，正确添加库引用后，就可以直接跑MaterialDesignActivity查看运行结果了。

[Center]: https://img-blog.csdn.net/20150921152404695?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center
[Center 1]: https://img-blog.csdn.net/20150921152425314?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center
[https_github.com_navasmdc_MaterialDesignLibrary]: https://github.com/navasmdc/MaterialDesignLibrary
[Center 2]: https://img-blog.csdn.net/20150921152447005?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center
[https_github.com_JakeWharton_NineOldAndroids]: https://github.com/JakeWharton/NineOldAndroids
[Center 3]: https://img-blog.csdn.net/20150921152507211?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center
[http_download.csdn.net_detail_zhangphil_9124325]: http://download.csdn.net/detail/zhangphil/9124325