Material Design 原来这么有趣

前言

在材料设计中，有许多设计理念。运用现实生活中的材料，随时进行设计，这是它的核心。

目录

• 平面
• 高度
• FAB 悬浮按钮
• CoordinatorLayout
• 颜色
• 字体

平面

• 平面就是 View 的抽象描述，toolBar 是一个平面，一个 Crad 也是一个平面，总之，用来包裹内容的，并且投射阴影的（在 MD 中通过阴影来实现部件的分层）。
• 基本准则：最好不要同时出现5个平面。
  

高度

• 高度是平面离背景平面的距离，数值越大，离用户越近。
• 需要吸引用户关注的部分，使用大数值的高度。
• 使用 “elevation”属性设置高度
• 效果图

• 各部件的高度 链接

FAB 悬浮按钮

• 涟漪效果在旧版本的机器上无法实现，即使使用支持库同样不行。
• MD 中新加入的按钮，按设计标准 FAB 应该在所有平面的最上层。
• FAB 的标准高度 ：6dp
• Gradle 依赖

compile 'com.android.support:design:22.2.0'

• xml 代码实例

  <android.support.design.widget.FloatingActionButton
        android:id="@+id/fab"
        app:fabSize="normal"
        app:elevation="6dp"
        app:layout_gravity="end"
        app:pressedTranslationZ="12dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="@dimen/fab_margin"
        app:srcCompat="@android:drawable/ic_input_add"
        android:tint="@android:color/white"/>

• Java 代码实例

    FloatingActionButton fabButton = (FloatingActionButton) findViewById(R.id.fab);

        fabButton.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                // Create a new intent to start an AddTaskActivity
                Intent addTaskIntent = new Intent(MainActivity.this, AddTaskActivity.class);
                startActivity(addTaskIntent);
            }
        });

CoordinatorLayout

• 一个开源框架

颜色

• 颜色在 UI 必不可少的元素，电池电量由绿变红，网易云音乐的标志性红色主题，这些都是颜色在 UI 中使用。
• Primary Color : 主色调，toolBar中的底色，用于塑造品牌风格。
• Accent Color ： 强调色，在 FAB 上使用，采用较鲜艳的，饱和度较高的一款颜色来吸引用户的关注度。
• Primary Color 和 Accent Color 之间要具有较大的颜色跨度。

字体

• Sp 是 android 中字体大小的单位，可缩放独立像素。
• Roboto 系统默认字体。
• 字体分为有衬线，无衬线两种。有衬线字体大多出现在印刷书籍中，因为适合长时间的阅读，而无衬线的适合在屏幕上显示，更容易辨认。

* TextView 中对字体的操作