Skip to content

Instantly share code, notes, and snippets.

View johnbear724's full-sized avatar
☄️

John johnbear724

☄️
52 followers · 325 following
View GitHub Profile
@johnbear724
johnbear724 / git 设置和取消代理
Last active October 6, 2016 16:17 — forked from laispace/git 设置和取消代理
git config --global https.proxy http://127.0.0.1:1280
git config --global https.proxy https://127.0.0.1:1280
git config --global --unset http.proxy
git config --global --unset https.proxy
npm config delete proxy
@johnbear724
johnbear724 / gist:a3b527091d58774c1641
Last active August 29, 2015 14:08
使用 Material Design 创建应用

该文档翻译自 Android 5.0 文档中对 Material Design 的介绍，原文地址：http://developer.android.com/training/material/index.html

Material Design 是一个横跨各平台和设备，为视觉，行为和交互设计提供的综合指导。如果要在你的应用上使用 Material Design ，遵循 Material Design 规范中描述的准则，并使用在 Android 5.0(API level 21)中提供的新组件和函数。

该课程向你展示如何使用下列元素创建 Material Design 应用:

  • Material 主题
  • 卡片和列表部件
  • 自定义阴影和裁剪视图
  • 矢量图形(Vector drawables)
@johnbear724
johnbear724 / gist:5c1e40c01eb6d0c1078b
Last active August 29, 2015 14:08
维护兼容性

该文档翻译自 Android 5.0 文档中对 Material Design 的介绍，原文地址：http://developer.android.com/training/material/compatibility.html

有些 Material Design 的特性像是 Material 主题和自定义 Activity 过渡只在 Android 5.0(API level 21)及以上可用。然而，你可以配置你的应用，使其在支持 Material Design 的设备上运行时可以使用这些特性，同时在之前发布的 Android 版本上运行时仍然可以兼容运行。

##定义备选样式

你可以设置你的应用在支持 Material Design 的设备上使用 Material 主题 ，并且在运行早期版本的 Android 的设备上恢复为旧的主题：

  1. 在 res/values/styles.xml 中定义一个主题，该主题继承了一个旧主题（如 Holo）。
  2. 在 res/values-v21/styles.xml 中使用相同的名字定义一个主题，继承 Material 主题。
@johnbear724
johnbear724 / gist:83ca04a416c67d67b554
Last active August 29, 2015 14:08
定义自定义动画

该文档翻译自 Android 5.0 文档中对 Material Design 的介绍，原文地址：http://developer.android.com/training/material/animations.html

Material Design 中的动画用于在用户执行操作时给予他们反馈，并使用户在与你的应用交互时提供良好的视觉连续性。Material 主题为按钮和 Activity 过渡提供了一些默认的动画，同时在Android 5.0(API level 21)及以上版本你可以自定义这些动画并创建新的：

  • 触摸反馈 (Touch feedback)
  • 圆形波纹 (Circular Reveal)
  • Activity 过渡 (Activity transitions)
  • 曲线运动 (Curved motion)
  • 视图状态变化 (View state changes)
@johnbear724
johnbear724 / gist:c189782efd1eaa63ddea
Last active August 29, 2015 14:08
使用Drawables

该文档翻译自 Android 5.0 文档中对 Material Design 的介绍，原文地址：http://developer.android.com/training/material/drawables.html

Drawables 的以下功能帮助你在你的应用中实现 Material Design：

  • 将图像染色
  • 提取图像中的显著颜色
  • 矢量图像(Vector Drawables)

该课程向你展示如何在你的应用中使用这些特性。

@johnbear724
johnbear724 / gist:b1c323c782887e29defe
Last active August 29, 2015 14:08
定义阴影和裁剪视图

该文档翻译自 Android 5.0 文档中对 Material Design 的介绍，原文地址：http://developer.android.com/training/material/shadows-clipping.html

Material Design 对 UI 元素提出了深度(depth)的概念。深度(depth)可以帮助用户理解每个元素的主次关系，以及使用户的注意力集中在手头的任务上。

视图的高度(elevation)，也代表了视图的 Z 方向上的属性，决定了阴影的大小：Z 值越大的视图会投射越大的阴影。视图只会在 Z = 0 的平面上投射阴影；不会在比他们低的视图或比 Z = 0 平面高的视图上投射阴影。

Z 值更高的视图会遮挡 Z 值更低的视图。但无论怎样，视图的 Z 值都不会影响视图的大小。

高度(elevation)属性也常用于创建动画，如在执行一些行动时组件暂时从视图平面升起的动画。

@johnbear724
johnbear724 / gist:3c1df87f3a001d9cfaa2
Last active August 29, 2015 14:08
创建列表和卡片

该文档翻译自 Android 5.0 文档中对 Material Design 的介绍，原文地址：http://developer.android.com/training/material/lists-cards.html

要在你的应用中使用 Material Design 创建复杂的列表和卡片，你可以使用 RecycleView 和 CardView 组件。

##创建列表

RecyclerView 是更高级和更灵活的 ListView。该组件是一个存放了大量数据集合的容器，它可以通过维护有限数量的视图，来有效率的滚动显示其中的大数据集。当你有一个需要在运行时根据用户的行为或网络事件而改变其中元素的数据集合时，你可以使用 RecyclerView 组件。

RecyclerView 类通过提供以下功能来简化大数据集合的显示和操作：

@johnbear724
johnbear724 / gist:b5c52ccb6c74ddd2f199
Last active August 29, 2015 14:08
使用 Material 主题

该文档翻译自 Android 5.0 文档中对 Material Design 的介绍，原文地址：http://developer.android.com/training/material/theme.html

新的 Material 主题提供了：

  • 可以设置调色板（color palette）的系统组件
  • 为系统组件增加了触摸反馈动画
  • Activity 过渡动画

你可以根据你的品牌特性创建一个调色板(color palette)，并使用该调色板对 Material 主题的外观进行自定义。你可以使用主题中的属性对 ActionBar 和 状态栏(status bar)进行染色，就像图例3展示的那样。

@johnbear724
johnbear724 / gist:0c054fa61fa57be57d47
Last active February 1, 2016 08:23
Material Desgin 入门

该文档翻译自 Android 5.0 文档中对 Material Design 的介绍，原文地址：http://developer.android.com/training/material/get-started.html

##入门

使用Material Design创建应用步骤：

  1. 回顾 Material Design 规范.
  2. 为你的应用使用 Material 主题
  3. 创建遵循 Material Design 指导的布局
  4. 指定视图的高度(elevation)来投射阴影