android UI 推荐

原创 2015年07月07日 11:33:20

可触摸控件都是以 48dp 为单位的。

为什么是 48dp?

一般情况下,48dp 在设备上的物理大小是 9mm (会有一些浮动)。这是触摸控件的推荐大小 (范围7-10mm) ,用户用手指触摸起来比较容易、且准确。

如果您设计的 UI 元素都至少有 48dp 的高度和宽度,那么可以保证:

  • 您设计的元素在任何屏幕上显示时,都不会小于推荐的最低值 7mm。
  • 你可以在信息密度和界面的可操控性之间得到较好的平衡。

metrics_closeup.png

注意留白

界面元素之间的留白应当是 8dp。

iconography_actionbar_size.png

大小和缩放

Icon mobile.png 图标应当是 32x32 dp。

iconography_actionbar_focal.png

内容区域

Icon mobile.png 整体大小是 32x32 dp

实际内容 24x24 dp

iconography_actionbar_style.png

样式

形象化,平面,不要小细节,搭配使用平滑和尖锐的轮廓。如果图画是长瘦型的,将它转45度角再填满内容区。线的宽度不应低于2 dp

颜色

颜色: #333333

可用: 60% 的透明度

禁用: 30% 的透明度


颜色: #FFFFFF

可用: 80% 的透明度

禁用: 30% 的透明度

iconography_actionbar_colors.png


小图标和上下文图标 - Small / Contextual Icons

在您应用的主体区域中,使用小图标表示操作或者特定的状态。例如在 Gmail 应用中,每条信息都有一个星型图标用来标记“重要”。

iconography_small_size.png

大小和缩放

Icon mobile.png 小图标应当是 16x16 dp。

iconography_small_focal.png

内容区域

Icon mobile.png 整体大小是 16x16 dp

实际内容 12x12 dp


iconography_small_style.png

样式

灰色为主、平面和简单。最好使用填充图标而不是细线条勾勒。使用简单直观的图画,让用户容易理解图标的目的。

 

通知栏图标 - Notification Icons

如果您的应用使用通知系统,您需要给系统提供一个图标。每当有一条新的通知时,它就会显示在状态栏上。

iconography_notification_size.png

大小和缩放

Icon mobile.png 通知栏图标大小必须是 24x24 dp。

iconography_notification_focal.png

内容区域

Icon mobile.png 整体大小是 24x24 dp

实际内容 22x22 dp

iconography_notification_style.png

样式

使用简单、平面的图标,应当和您应用的启动图标视觉上相似。

 

默认的字体颜色

Android 界面使用以下的系统默认字体颜色: textColorPrimary 和 textColorSecondary。而在浅色主题中则使用 textColorPrimaryInverse 和 textColorSecondaryInverse。在系统主题中还支持几种不同的触摸反馈的字体颜色。

typography_defaults.png

 

 

体的缩放

字体大小上的不同可以创造出有序和容易理解的布局。不过在同一个界面中使用过多的字体大小则会造成混乱。Android 设计框架建议您使用以下几种字体大小:

typography_sizes.png

用户可以在“设置”中调整整个系统的字体大小。为了支持这一特性,字体的大小应尽量使用可缩放的单位,我们称之为 (sp)。测试排版的时候也应当测试这些用到 sp 的布局。

版权声明:本文为博主原创文章,未经博主允许不得转载。

android UI界面更新之通知与服务结…

网上看到的,实际操作了下,例子代码如下。加深对BroadcastReceiver与Service理解 package org.yihu; import android.app.Activity; im...

105+ 个免费的扁平UI工具包&n…

作为一名开发人员,需要时刻保持敏锐度,站在趋势的最新潮流上。如果你是一个热衷于设计的人,你必须要很好地了解扁平界面设计的新趋势,因为它现在已经无处不在了。扁平UI设计使用的颜色像黄色,绿色,红色,没有...

导航控制器 UI_08(上)

主要内容:UINavigationController 重要:属性传值(向后一个界面传值)、代理传值(向前相邻的界面传值)、单例传值(不相邻的界面向前传值) 1、UINavigationControl...

实战项目:通讯录 UI—第十一天

1、推出视图的两种方式:  1.通过导航控制器push到下一个界面,使用pop返回到上一个界面  2.通过模态的形式推出视图,不需要依赖于导航控制器,通过使用present到下一个界面,通过dism...

Android SDK更新以及ADT更新…

不错,谢啦原文地址:SDK更新以及ADT更新出现问题的解决办法">Android SDK更新以及ADT更新出现问题的解决办法作者:五步蛇问题描述 使用SDK Manager更新时出现问题 Faile...

Android开发实例 简单拨打电话

Android手机开发当中打电话的功能是怎样实现的呢?我来看下简单的拨打电话的代码实例: 步骤一::新建一个Android工程,命名为phoneCallDemo. 步骤二:设计程序的界面,打开main...

Android xml资源文件中@、@an…

http://greatverve.cnblogs.com/archive/2011/12/27/Android-xml.html 一.@代表引用资源 1.引用自定义资源。格式:@[packa...

android 实现图片加水印

File fImage = new File("/sdcard/dcim","beijing.jpeg"); FileOutputStream iStream = new FileOutputStr...

(转)Android XML解析与生成

在Android平台上可以使用Simple API for XML(SAX) 、 Document Object Model(DOM)和Android附带的pull解析器解析XML文件。   下面是本...

android Service学习之本地服务

http://android.blog.51cto.com/268543/527314  Service是在一段不定的时间运行在后台,不和用户交互应用组件。每个Service必须在manifest中...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:android UI 推荐
举报原因:
原因补充:

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