MTK的GUI 设计

 

目录

前言
第一章    待机
第二章  主菜单
第三章    状态栏
第四章  标题栏
第五章  softkey bar
第六章
第七章
第八章
第九章

 

前言

MTK的高仿和新的UI设计涉及到待机，主菜单，二级菜单，标题栏，状态栏，弹出框等等。MTK的界面都是由一些控件组合而成，那么一个界面的重新布局，要经历那些步骤呢？下面就来讨论一下。

首先要考虑好当前界面需要那些功能，每个功能需要什么控件来实现。对于具体的控件，要确定它的有效区域（剪切区域），包括宽度和高度，还有背景的宽度和高度，以及背景是用图片还是用颜色填充，都是我们需要在设计之前要考虑的，完了就是把我们常用的宽度和高度用宏定义起来，并准备需要的一些背景图片。

 

第一章      待机界面

待机界面常见的显示元素一般如下：

状态栏，时间，日期，运营商，快捷菜单和一些动态显示菜单。接下我们需要在纸上画出它们的布局图，每个元素要显示的位置和大小。下面我们就逐个讲解上面的一些元素是如何显示的。

第一 ，状态栏，这个我们在讲状态栏的那章专门介绍。

第二 ，时间和日期，如果我们要实现我们自己风格的时间和日期，我们可以新定义一个时间日期类型，我们可以在枚举DT_DISPLAY_TYPE中添加一个新定义的变量，例如：DT_HTC_DIGITAL_CLOCK，然后在函数set_dt_display（）设定该时间日期显示类型中，包含哪些元素，比如是模拟时钟还是数字时钟，是否日期显示和星期显示。那如何设定呢，首先我们要wgui_clock_create（）创制一个时间日期类型，常用几种类型如下：

GUI_CLOCK_MAINLCD_TYPE_ANALOG  //模拟时钟

GUI_CLOCK_MAINLCD_TYPE_DIGITAL_TIME_SMALL  //小数字时钟

GUI_CLOCK_MAINLCD_TYPE_DIGITAL_TIME_IMAGE  //数字时钟，时间数字用图片来实现

GUI_CLOCK_MAINLCD_TYPE_DIGITAL_TIME     //数字时钟

GUI_CLOCK_MAINLCD_TYPE_DIGITAL_DAY      //日期时钟（年月日显示）

GUI_CLOCK_MAINLCD_TYPE_DIGITAL_DATE     //星期显示

然后在show_main_LCD_date_time函数中加入该DT类型的显示和hide_main_LCD_date_time函数中加入该DT类型的背景显示。

接下来，我们需要定义各个时间，日期，日历控件的坐标和宽度，对于固定不变的元素，我们建议用宏控制，这样便于代码的维护和可读性，例如

#if defined(__MMI_HTC_IDLE_DIGITAL__)

                   #define HTC_DATE_BACKGROUND_X                    

                   #define HTC_DATE_BACKGROUND_Y                         

                   #define HTC_DATE_BACKGROUND_WIDTH                 

                   #defi