当前位置: 首页 > 科技观察

多图详解 “Android UI”设计官方教程

时间:2023-03-14 16:26:08 科技观察

《AndroidUI》设计官方教程多图详解经过一些AndroidUI设计,我们整理了这篇教程,希望大家喜欢。想了解所有AndroidUI教程内容,请点击独家专题:谷歌官方教程:AndroidUI设计技巧作为开发者,我们为什么要关心UI?因为好的UI设计可以帮助我们卖更多的份,赚更多的钱。#p#简介本教程由5个部分组成:◆该做什么,不该做什么◆设计理念和注意事项◆你必须知道的UI框架特性◆新的UI设计模式◆图标和指南#p#UI设计5不要不要:◆不要在其他平台上复制您的UI设计。它应该让用户感觉他们在使用安卓软件。在徽标显示与平台的整体外观和感觉之间取得平衡。◆不要过度使用模态对话框。◆不要使用固定的绝对定位布局不要使用px单位,文本使用dp或sp不要使用太小的字体(比放大更好)◆需要调整的元素单击应足够大◆图标设计遵循Android准则◆使用适当的间距(边距、填充)◆支持方向键和轨迹球导航◆正确管理活动(活动)堆栈◆正确处理屏幕方向变化◆使用主题/样式,尺寸和颜色资源,减少冗余值◆与视觉交互设计师合作!#p#4AndroidUI设计理念:◆干净但不过于简单◆重内容而不是装饰◆一致,让用户容易参与,并添加一点变化◆使用云服务(用户数据的存储和同步)提升用户体验#p#5优秀界面设计的原则:◆以用户为中心◆显示正确的内容◆给用户适当的内容反馈◆基于规则的行为模式◆容忍错误以用户为中心:◆了解你的用户(年龄、技能、文化、对您的应用程序的需求、使用的设备、何时、何地以及如何使用设备)◆“用户至上”的设计心态(用户通常是面向任务的行为模式)◆真实用户更早和更频繁的测试显示正确的内容:◆最常用的动作需要用户最快看到并可用◆不常用的功能可以放在菜单中给用户适当的反馈:◆交互UI元素需要反映至少4种不同的状态(default,disabled,focused,pressed)◆确保操作结果清晰可见◆给用户更多的进度提示,但不干扰他们当前的操作基于规则的行为模式:◆行为模式遵循用户期望(正确操作活动堆栈,显示用户期望看到的信息和动作)◆使用适当的方法增强功能可见性责任(可点击的元素应该看起来是可点击的)◆如果用户需要复杂的动作来完成任务,重新考虑你的设计!!!容忍错误:◆只允许有意义的操作(适当禁用一些按钮)◆尽量减少非回滚操作◆允许回滚(撤消)而不是使用确定对话框更好(实际上,应该尽可能少地使用OK对话框,它会分散用户的注意力)#p#“如果错误可能发生,它们就会发生”-DonaldNorman,TheDesignofEverydayThings作者的8点设计时需要考虑:◆屏幕的物理尺寸◆屏幕密度◆屏幕方向(垂直和水平)◆主界面交互方式(触摸屏或使用方向键/轨迹球)◆软键盘或物理键盘◆了解不同的设备不同很重要!◆阅读CDD以了解设备可能存在的差异◆了解屏幕尺寸和密度类别#p#AndroidUI框架功能您必须了解(并使用)UI框架功能。使用相对布局来管理界面元素。译者注:相对布局和线性布局是Android中常用的两种布局。线性布局比较简单,而相对布局可以进行更复杂的布局管理,所以只了解线性布局往往是不够的。不过从笔者以往使用Qt的经验来看,Android中的布局管理功能有比较好用也有不好用的,不过这可能跟移动平台的性能考虑有关。#p#资源修饰符的合理使用使用资源修饰符可以修饰同一组资源的多个不同版本。◆一个apk包会包含所有的资源文件。◆系统运行时,会根据软硬件环境,自动选择相应修饰符版本的资源。译者注:最常用的修饰符大概是locale修饰符(制作多语言文本)、dpi修饰符(为不同密度的屏幕制作不同尺寸的图标和皮肤)、orientation修饰符(提供不同的UI布局)。如果系统找不到对应的修改版本,就会选择未修改的版本,也就是通常所谓的默认选择。#p#9-patchdrawables使用9-patchdrawables–foo.9.png◆9-patchdrawables的语法类似于CSS3borderimage◆根据边缘的像素宽度切出不同的拉伸区域***还有hdpi版本提供mdpi译者注:Android中的drawables类似于WPF中的Drawing,用于定义一个drawable对象,包括位图、画笔、填充颜色或以上对象的组合等。所谓9-patchdrawable就是将一个drawable按照定义的4条边的宽度切割成9个区域,包括4个角,4个边和一个中心区域。将这个drawable绘制到任意矩形区域时,drawable的每个区域都有不同的拉伸控制(边角不拉伸,水平边水平拉伸,垂直边垂直拉伸,中心区域两个水平拉伸和垂直)。9-patchdrawable通常用于绘制更漂亮的圆角背景,可以防止圆角和边缘被任意拉伸而导致变形。当然,如果你程序中绘制的图片和目标区域的大小完全一样,就不用那么麻烦了,但是Android的话,为了适配多设备,最好不要预先假设目标区域的像素大小。#p#使用状态列表和多层叠加来制作具有复杂效果的drawableimages使用Selector(statelist)drawables(状态列表)提供不同状态(normal,disabled,focused,pressed...)的drawableimages。使用Layerdrawables(多层叠加层)创建具有复杂效果的可绘制图像。译者注:所谓多层叠加,用PS制作图标和皮肤的同学可能有所了解。例如,一个按钮的PS模板通常包括定义背景颜色的所谓背景层、定义轮廓的遮罩层和定义前景的发光层。突出效果。Android允许直接在XML脚本中使用Layerdrawables的语法来定义上述的多层叠加效果,这可能比直接在PS中做更加灵活,有些layer可以来自png位图,有些Layers可以直接通过XML脚本生成(如纯色、过渡色等)。【小编推荐】MeeGo移动终端设备开发UI设计基础教程图文并茂在MyEclipse8.6搭建Android开发环境21款Android开发必备的免费资源和工具独家专访:Android开发入门Q&A