关闭

Android: Material Design 简单介绍(1)

标签: android设计MaterialDesignview
327人阅读 评论(0) 收藏 举报
分类:

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

0
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:209477次
    • 积分:2491
    • 等级:
    • 排名:第14781名
    • 原创:78篇
    • 转载:60篇
    • 译文:21篇
    • 评论:13条
    博客专栏
    最新评论