搜索
Cosmos控件设计与Android的比较1，cosmos概要介绍Cosmos是MTK平台的一个MMIpackage，不同的package为不同的平台提供有差异的UI风格。比如plutopackage适用于key或者key加触笔的低端平台。Cosmos致力于FingerTouch的平台(比如Iphone和Android平台手机的风格)，采用cosmos开发的应用UI风格精美（fancy）。按照MTK文档，Cosmos的定义为：FTO（FingerTouchOptimized）style，用VenusUI和VenusFW重写的MMIPackage。与MTK平台的其他featurephone相比较，cosmos平台对硬件的性能要求比较高：1，为了满足fingertouch，屏幕尺寸和分辨率要足够大。推荐屏幕最低配置2.6inches，分辨率240*320；2，芯片要提供优异的图形加速效果；3，支持重力感应；cosmos平台按键设计要求底部按键必须支持下面四个按键，与android的常见按键风格相比较，少了“menu”按键（图1）。图1cosmos底部按键本文主要关注的是Cosmos的控件方面的设计，并与Android中的设计做对比。2cosmos的控件以及与android的比较在Cosmos中控件被称之为CP(Component),分为以下几个系列：menu，bar，buttons，text，popup，others。2.1MenuCosmos的menu包括Listmenu，GroupListmenu，Form，Picker，Basemenu和Wheelmenu。2.2.1ListmenuListmenu是最为常见的表达列表的一种控件（图2.2.1.1）：图2.2.1.1支持动态列表；列表中的每一个Cell是固定的高度；当列表内容发生变化时随之更新；通过不同的设置来实现不同风格的Cell，如celllayout风格（图2.2.1.2），editingmode（图2.2.1.3），controlmode（图2.2.1.4）；支持用户定制，比如添加searchbar，seekbar，cellstyle等。图2.2.1.2图2.2.1.3图2.2.1.4在android平台的开发中，可采用listview和adapter实现listmenu的功能。对于不同的cell风格，用户可以在cell的layout文件中根据需要自定义。2.2.2GroupListmenuGroupListmenu与listmenu功能类似，不同是添加了indexbar把列表区分为不同的群组。常用于联系人列表界面（图2.2.2.1）。图2.2.2.12.2.3Form这里的form是表单的意思，与menu的形式类似（图2.2.3.1）。其特点为：每个Cell的高度和布局可能是不同的，menu的Cell高度和布局都是相同的；每个Cell都是预先定义好的，且Cell的数量是预先确定的；支持删除和插入Cell；前三种在android的开发中都没有类似封装好的控件，需要用户根据需要自定义开发。建议UI能提供比较美观的layout定义，统一整体的菜单风格。图2.2.3.12.2.4Picker用于设置日期或者时间（图2.2.4.1）。Android类似控件有Datepicker和Timepicker。图2.2.4.12.2.5BasemenuBaseMenu用于在屏幕上滚动的显示大量的menuitem，在用户上下滚动菜单时，menuitem会动态的创建或者关闭，大大节省了资源。用户可以拖拽和点击menuitem。效果类似与android新浪微博的查看微博的菜单风格。BaseMenu只是提供了一个用于创建menuUI的框架，实现一个这样的菜单还需要实现大量的代码。BaseMenu这种风格的菜单目前比较受欢迎，在android的应用中也很常见，建议封装。图2.2.5.12.2.6WheelmenuWheelmenu提供一个用于动画显示大量菜单的框架。在任何时候只有一个item处于焦点位置，并且焦点位置是固定的，点击其他非焦点的item，会自动切换焦点到这个item。Menuitem的移动具有动画效果，且支持非线性的动画效果。每个Item自身也支持动画。图2.2.6.1是一个效果截图。图2.2.6.2-图2.2.6.5是几个应用场景的示意图。图2.2.6.1图2.2.6.1常用联系人图2.2.6.3home图2.2.6.4图片浏览图2.2.6.5音乐播放Wheelmenu是一类效果很炫的菜单，尤其适合展示多媒体资源。实现wheelmenu需要支持图形变化和3D等效果，在Android上实现有一定难度。2.3BarCosmos提供的bar的类型有以下几种（图2.3.1—图2.3.6）：图2.3.1StatusIconBar图2.3.2Titlebar图2.3.3TabTitle/Tabbar图2.3.4Toolbar图2.3.5Panelbar图2.3.6FunctionbarBar在形式上比较简单，Android中并没有单独提供这样一个控件，一般用button，text等控件组合即可实现。Toolbar放在屏幕的底端，用于显示当前的view所支持的功能。这种风格在Android平台更多的是以optionsmenu的方式提供的，跟Activity关联，在用户需要的时候，由menukey触发，并不是一直显示在屏幕的底端。2.4ButtonButton是比较简单的一类控件，一般都是一个矩形的背景加上文字或者图片组成。Cosmos有两个button比较特别，Imagebutton和Swtichbutton。Imagebutton是由表示状态变化的图片加上Glow特效（图2.4.1），比如MP3的播放条的各种按钮（图2.4.2）。Glow特效在字体效果上也有应用。图2.4.1图2.4.2Swtichbutton表达on-off效果。Android平台常用checkbox表示on-off，相对来讲Swtichbutton表达更准确生动（图2.4.3），且代码实现上也很简单，建议封装。图2.4.32.5TextCosmos提供用于显示简单文本的TextFrame，显示大段可读文本的TextViewer以及显示可编辑文本的Texteditor。其中TextView的功能比较强大（图2.5.1），除了支持显示多行文本，还可以支持显示包含图片的文本，格式化文本，包含video的文本(客户定制)。图2.5.1Marquee用于显示滚动的文本和图片(比如MP3的歌词，图2.5.2)，支持各种配置：滚动的方向(向左，向右)；水平或垂直排列；滚动模式(标准，幻灯片，交替)；循环次数(0-无限)；滚动速度；距开始滚动的初始延时。图2.5.22.6PopupCosmos提供了种类的丰富的popup，一部分功能类似于对话框，起到提示用户的效果，比如confirmpop。另外一部分与其他featurephone平台的popmenu功能类似，例如Commandpopup和MoreCommandPopup。2.6.1Confirmpopup最为常用的一种对话框（图2.6.1.1），在其他featurephone平台上也常用。支持不同的提示类型(Failure，info，warning，success，progress，question，由不同的图片表示)。用户可以设置文本，按钮(最多两个)。支持用户自定义风格。Android与之对应的控件是AlertDialog。图2.6.1.12.6.2Commandpopup和MoreCommandPopupVcpCommandPopup（图2.6.2.1）用于某一个动作会有几个不同的选项的场景，比如把一个铃音设置为sim1来电铃音，sim2的来电铃音，闹钟铃音等；居屏幕底部，最多显示7个不同选项。VcpMoreCommandPopup（图2.6.2.2）与VcpCommandPopup类似，用于当user点击“more”button（位于toolbar，当toolbar中显示功能项超过7个的时候，最后一个为morebutton）时，title为“more”，居中显示；图2.6.2.1图2.6.2.22.6.3MenuPopupMenuPopup显示文本菜单列表（图2.6.3.1）。与android的contextmenu类似。图2.6.3.12.6.4InputPopup用于快速输入文本的popmsg（图2.6.4.1），比如输入密码，修改文件夹或者文件的名字等场景。建议封装。图2.6.4.12.6.5IndiactorPopupIndicatorpopup用于指示正在进行的活动，支持两种风格，支持“取消”按钮（图2.6.5.1）。与android的ProgressDialog类似。图2.6.5.12.6.6SelectPopup三种风格，用于简单选择，单选，多选的pop框，在设置类菜单很常见（图2.6.6.1）。android通过过自定义dialog可以实现，考虑到使用场景比较多，建议封装，使用方便，也统一风格。图2.6.6.12.6.7LoadingPopup用于一个应用启动时，提示用于需要等待。显示在屏幕中间，非交互。HTCG7上有不少应用启动时有短暂的白屏，黑屏或者只显示出小部分界面的情况，加个loadingpop会美观一些。2.7Misc.Misc.顾名思义包含内容是比较杂的，一些常见的控件这里就不再提及，仅列出其中几个比较有意思的控件。2.7.1Infoballoon用于通知用于某些事件，可以显示在屏幕的顶端（图2.7.1.1）或者底端（图2.7.12）。Android的Toast空间支持类似功能，显示的位置和形式更丰富一些。图2.7.1.1图2.7.1.22.7.2PhotoBorderFramePhotoBorderFrame用于在显示图片时自动加上边框（图2.7.2.1），可用于显示联系人头像或者图片列表的缩略图。图2.7.2.12.7.3PageGridPageGrid是由一组page组成，每个page是grid（m*n个元素）layout风格（图2.7.3.1），可用于显示具有多个图标构成的界面。图2.7.3.13小结cosmos的控件设计延续了MTK的一贯turnkey的风格，所有可能用到的控件都已经封装好，这里的控件更像是模板，用户通过继承，重载的形式，可以很轻松的实现需要的界面。Android的控件粒度比cosmos要小，用户创建一个UI界面，需要从layout的xml文件开始写起，按照需求对各种控件进行组合。两者的优缺点都很明显，cosmos的控件使用起来很方便，做出来的UI风格统一，虽然也支持用户自定义，但是还是受到一定的限制。Android的控件使用起来很灵活，扩展性好，缺点是开发复杂程度稍大。建议在Android平台中，对一些通用的标准件进行封装，有利于UI风格统一，也提高上层应用开发的效率。同时也可以借鉴cosmos平台支持的特效，丰富UI的酷炫效果。