美文网首页
【小结】使用Material Design的一般步骤

【小结】使用Material Design的一般步骤

作者: jackLee | 来源:发表于2016-03-17 11:11 被阅读611次

    • 使用Material Design的一般步骤如下:
      • 下载安装Android开发环境:Android Studio
      • 新建一个Android的项目
      • 在res/values文件下的strings文件中添加业务相关的string,注意string的国际化
      • res ⇒ values ⇒ colors.xml 自定义Material Design 的颜色主题资源,
        <code>
        colors.xml
        <?xml version="1.0" encoding="utf-8"?>
        <resources>
        <color name="colorPrimary">#F50057</color>
        <color name="colorPrimaryDark">#C51162</color>
        <color name="textColorPrimary">#FFFFFF</color>
        <color name="windowBackground">#FFFFFF</color>
        <color name="navigationBarColor">#000000</color>
        <color name="colorAccent">#FF80AB</color>
        </resources>
        </code>
      • 在res/values文件下的dimens.xml添加尺寸
      • 在res/values文件下的styles.xml自定义styles,代码如下:
    styles.png
    • 接下来最重要的一步,在AndroidManifest.xml清单文件中使用我们定义好的主题:
      <code>
      <application
      android:allowBackup="true"
      android:icon="@mipmap/ic_launcher"
      android:label="@string/app_name"
      android:theme="@style/MyMaterialTheme" >
      ...
      ...
      </application>
      </code>

    • 然后编译运行程序会看见我们设计的Material Design的效果:

    Material Design.png
    • 项目的组织结构


      项目结构.png

    上面是为APP设置Material Design的基本效果

    • 一般Material Design 会配合Toolbar,DrawerLayout,Navigation View,Floating Tables ,Fragment,Floating Action Button ,Snackbar,RecyclerView等控件配合使用

    拓展学习


    What’s Next?
    Below are few more material components you can add to your app. These were implemented using recent Android Design Support Library.

    1. Material Design Tab Layout
      If you want to add tabs to your app, Android Material Design Tabs covers different aspects of Tab Layout.
    2. Floating Labels for EditText
      Learn how floating labels works on EditText with a simple form validation example.
    3. Floating Action Button (FAB)
      Add the Floating Action Button to your which displays in circular shape floating on the top of the UI.
    4. Snackbar
      Add the Snackbar to your app to give immediate feedback about any operation that user performed.

    相关文章

      网友评论

          本文标题:【小结】使用Material Design的一般步骤

          本文链接:https://www.haomeiwen.com/subject/fahclttx.html