手把手教你打造一个Material Design风格的App(一)

你应该听说过Android的Material Design，它是在Android 5.0(Lollipop)版本引入的。在Material Design中还引入了很多新东西，比如Material Theme，新的小部件，自定义的阴影，矢量图片及自定义动画等。如果你之前没有用过Material Design，那么本文将是一个很好的入门教程。

在这篇教程中，我们将会学习Material Design开发的基本步骤，即编写自定义的主题以及使用RecyclerView来实现抽屉导航。

通过下面的两个链接可以获取更多关于Material Design的知识：

>Material Design规范

>使用Material Design创建App

本文Demo的视频在YouTube上，请点击这里。

我根据教程，写了一个Demo，放在了Github上，请点击这里。

 

1.下载Android Studio

在开始之前，需要下载Android Studio并做一些必要的配置，因为从现在开始，在本教程中，我将会一直使用Android Studio。如果你是第一次接触Android Studio，可以通过其说明文档来大致了解一下Android Studio。

2.Material Design色彩定制

Material Design提供了一系列属性来自定义颜色主题，但是我们一般使用5个主要的属性来定义整体的主题风格。

colorPrimaryDark——这是App深色调的基本颜色，主要用于通知栏背景。

colorPrimary——这是App的主要颜色，用于工具栏背景。

textColorPrimary——这是文本的主要颜色，用于工具栏标题。

windowBackGroud——这是App的默认背景色。

navigationBarColor——这是底部导航栏的背景颜色。

你可以浏览一下Material Design的色彩方案，然后选择一个适合你的App的。

3.创建Material Design主题

（1）在Android Studio中，通过菜单File-->New Project，填写必需的详细信息来创建一个新的工程，当提示选择一个默认的Activity时，选择Blank Activity，然后继续。

（2）打开res-->values-->strings.xml，然后添加下面的string值。

strings.xml

    Material Design

    Settings

    Search

    Open

    Close

 

    Home

    Friends

    Messages

 

    

    

        @string/nav_item_home

        @string/nav_item_friends

        @string/nav_item_notifications

    

 

    Messages

    Friends

    Home

（3）打开res-->values-->colors.xml，然后添加下面的颜色值。如果你没有找到colors.xml文件，请创建一个名为colors.xml的资源文件。

colors.xml

    #F50057

    #C51162

    #FFFFFF

    #FFFFFF

    #000000

    #FF80AB

（4）打开res-->values-->dimens.xml，然后添加如下内容。

dimens.xml

    

    16dp

    16dp

    260dp

（5）打开res-->values中的style.xml文件，然后添加如下样式。在style.xml中定义的样式是所有Android版本中通用的，这里我将我的主题命名为MyMaterialTheme。

styles.xml

 

    

 

    

 

    

        true

        false

        @color/colorPrimary

        @color/colorPrimaryDark

        @color/colorAccent

    

     

（6）现在，在res文件夹下，新建一个名为values-v21的文件夹。在values-v21文件夹里面，创建另一个style.xml文件并填写如下内容，这个style则是仅供Android Lollipop（5.0）使用的。

styles.xml

 

    

        true

        true

        true

        @android:transition/move

        @android:transition/move

    

 

（7）到这里我们已经准备好了基本的Material Design 样式。为了使用该主题，打开AndroidManifest.xml文件然后修改标签中的android:theme属性：

android:theme="@style/MyMaterialTheme"

在应用了这个主题之后，你的AndroidManifest.xml文件应该是下面的样子：

AndroidManifest.xml

    package="androidhive.info.materialdesign" >

 

    

        android:allowBackup="true"

        android:icon="@mipmap/ic_launcher"

        android:label="@string/app_name"

        android:theme="@style/MyMaterialTheme" >

        

            android:name=".activity.MainActivity"

            android:label="@string/app_name" >

            

                

 

                

            

        

    

 

现在，如果你运行App，你可以看到通知栏的颜色变成了我们在样式里所声明的颜色。

完整Demo托管在Github上，请点击这里。

由于文章太长，请继续关注：手把手教你打造一个Material Design风格的App(二)

原文地址：http://www.androidhive.info/2015/04/android-getting-started-with-material-design/