Android: Material Design 简单介绍(1)

翻译 2016年08月29日 03:04:08

Android: Material Design 简单介绍


谷歌的material design 提供了全新的,令人激动的一些方法去让你的app更加生动。但等等,究竟什么是material design?

Google在2014年的时候在I/O大会上引入,把它描绘成一个包含‘可触控的外观,强大的图片设计、流畅的手势去创造美丽的,直观的体验’。
Material design是一个新的用户体验哲学。

在这个教程了,你将会接触material design,我们将会通过一个Travel Wish List. 的例子来帮助你理解,你将会学到:

  • 实现material 主题
  • 创建动态的view,使用新的控件,比如说 RecyclerView and CardView;
  • 使用Palette API 去为背景或者文字生成颜色
  • 使用新的动画api其实现美丽的动画

这个教程需要你有基本的安卓编程经验,期中包括java,xml,android studio,以及Gradle。

开始吧!

准备工作

下载 starter project, 进入到Android Studio

这里写图片描述

选择我们下载的项目点击ok

这里写图片描述

Travel Wish List 是一个非常简单的应用,用户将会看到一系列的美丽风景图片,然后可以选择图片,并且加上注视,关于想具体看什么风景。

环境搭建好了,你应该看到下图

这里写图片描述

现在很简单,你需要加上material 组件,期中包括动态的view,颜色设计,动画

打开build.gradle,然后加上下面的依赖

dependencies {
  compile fileTree(dir: 'libs', include: ['*.jar'])
  compile 'com.android.support:recyclerview-v7:21.+' 
  compile 'com.android.support:cardview-v7:21.+'
  compile 'com.android.support:palette-v7:21.0.0'
  compile 'com.squareup.picasso:picasso:2.5.0' 
}

这里你只是简单的声明了这个应用将会用到的依赖。前面几个是谷歌提供的支持库,但最后一个,Picasso是一个强大的图片下载、缓存组件,是由Square大神开发的。

设置主题

在干别的之前,你应该设置主题,打开style.xml ,然后加上下面的
默认主题应该是android:Theme.Material.Light。

<item name="android:colorPrimary">@color/primary</item>
<item name="android:colorPrimaryDark">@color/primary_dark</item>
<item name="android:colorAccent">@color/accent</item>
<item name="android:navigationBarColor">@color/primary_dark</item>
<item name="android:displayOptions">disableHome</item>

Android将会自动的把
android:colorPrimary应用的action bar,
android:colorPrimaryDark 应用到 status bar,
android:colorAccent应用到ui空间,比如说输入框
在上面的代码,你也可以指定 navigation bar的颜色。 android:displayOptions你可以传递disableHome 去适应屏幕的布局。

你讲看到如下界面

这里写图片描述

下面的一章我们将会介绍Recycler View 以及Card View

Android: Material Design 简单介绍(2)

使用 Recycler 和Card Views为了在屏幕上显示美丽的风景,你需要一个view。你可以使用 RecyclerView作为ListView的替代者,但它比ListView更加强大,Goog...
  • gusgao
  • gusgao
  • 2016年08月29日 04:00
  • 459

Android: Material Design 简单介绍(3)

处理点击事件不像ListVIew,RecyclerVIew没有onItemClick 接口,所以你需要在你的adapter里TravelListAdapter,创建一个局部变量来存放MateriOnI...
  • gusgao
  • gusgao
  • 2016年08月29日 15:00
  • 273

android material design之简单控件(八)

这算是md风格这一段时间的最后一篇博客吧,以后也可能会更新,看几个图 先来看edittext的activity package com.fanyafeng.materialdesign.activ...

Android Material Design简单使用

作为一个 Android developer,没有什么比拿着 UI 设计的一堆 iOS 风格的设计 来做需求更恶心的了,基本所有空间都要照着 iOS 来画一遍,Material Design 辣么酷炫...

Android玩 --- Material Design(1) --- Recycleview的装饰(2)

上一篇我们认识了Recycelview,并且能够简单的使用它,这一次我们来点酷炫的东西。一.侧边栏ScollBars为了实现侧边滑动的ScollBars,我们只需要在xml里添加一行代码//当然还有横...
  • Su_ling
  • Su_ling
  • 2017年06月04日 17:54
  • 224

Android5.0新特性 -- Material Design材料设计(1)

Android5.0的10大新特性 全新Material Design设计风格 支持多种设备 全新的通知中心设计 支持64位ART虚拟机 Project Volta电池续航改进计划 全新的“最近应用程...
  • Sjim_
  • Sjim_
  • 2016年01月09日 11:23
  • 1917

Android Design Support Library 中控件的使用简单介绍(一)介绍 在这个 Lib 中主要包含了 8 个新的 material design 组件!最低支持 Android

介绍 在这个 Lib 中主要包含了 8 个新的 material design 组件!最低支持 Android 2.1 。 这些组件在我看来就是对 Github中最近比较火的 android 组...

Android中Material Design中的风格介绍

Google在Android 5.0推出了Material Design,就增加了材料设计风格的主题,系统自带的三个材料风格主题: @android:style/Theme.Material (深色...

Android Material Design系列之主题样式介绍说明等

今天这篇文章应该算是Material Design系列的补充篇,因为这篇文章本来应该放到前面讲的,因为讲的是主题嘛,对于一些状态和颜色的介绍,因为我们一新建一个项目时,系统自带了三个属性的颜色,现在就...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:Android: Material Design 简单介绍(1)
举报原因:
原因补充:

(最多只允许输入30个字)