魔秀手机主题制作分析

相关页面

主页面:theme.html?sid=
设置页面:theme-setting.html?sid=&path=&HJD=
预览页面:theme-preview.html?sid=&path=&sceneId=&HJD=
制作主题:theme-save.html?sid=&op=
素材页面:material.html?sid=&path=
图片处理:theme-img.html?sid=&path=
菜单配置:theme-design.html?sid=&HJD=
预览配置:theme-previewxml.html?sid=&path=



流程

1). 首次打开theme.html会生成一个sid;
2). 根据sid从theme-design.html获取主题菜单配置信息,以JSON格式返回,保存至G_designData;
3). 根据G_designData生成操作菜单;
4). 选择各个菜单项并在theme-setting.html中进行设置;
5). theme-setting.html每次设置完成(页面加载)后都会重新加载theme-preview.html;
6). theme-preview.html从theme-previewxml.html获取主题预览配置信息,以XML格式返回,并生成预览图;
7). 所有设置完成后在theme-save.html生成主题;

说明

·所有html页都不是静态页;
·每步操作直接保存到服务器;

附:

a.在一台机子上主题未制作完成,在另一台机子上登录时提示有未完成的项目,说明每步操作都有保存至服务器



b.G_designData结构预览



c.theme-previewxml.html返回内容示例

<?xml version="1.0" encoding="UTF-8"?>
<!-- Series2_240*320_background -->
<!-- Created with Moxiu.com Creator by zozo -->
<mxtpreview type="js" width="240" height="320">
<screen layer="0">
          <image source="mark" mark="qsn_bg_screen" url="http://img.imoxiu.com:88/mxtpreview/defaultElementImage/s60/background/wallpaper240320.png" top="0" left="0" width="240" height="320" path="1-1-1" name_cn="菜单背景图" stat="0"/>
</screen>
<screen layer="1">
        <image source="mark" mark="S60_2_6%qsn_fr_grid" url="http://img.imoxiu.com:88/mxtpreview/defaultElementImage/s60/other/grid highlight_240.png" top="95" left="77" width="75" height="66" path="7-15-68" name_cn="通用光标背景" stat="0"/>
</screen>
<screen layer="2">
          <image source="mark" mark="qgn_indi_signal_strength" url="http://img.imoxiu.com:88/mxtpreview/defaultElementImage/s60/timefaceicon/qgn_indi_signal_strength.png" top="0" left="0" width="16" height="27" path="8-8-3" name_cn="信号图标" stat="0"/>
          <image source="mark" mark="qgn_indi_battery_strength" url="http://img.imoxiu.com:88/mxtpreview/defaultElementImage/s60/timefaceicon/qgn_indi_battery_strength.png" top="0" left="224" width="16" height="27" path="8-8-4" name_cn="电量图标" stat="0"/>

          <image source="mark" mark="qgn_menu_phob_cxt" url="http://img.imoxiu.com:88/mxtpreview/defaultElementImage/s60/appicon/qgn_menu_phob_cxt.png" top="29" left="15" width="49" height="49" path="5-5-26" name_cn="名片夹" stat="0"/>
          <image source="mark" mark="qgn_menu_mce_cxt" url="http://img.imoxiu.com:88/mxtpreview/defaultElementImage/s60/appicon/qgn_menu_mce_cxt.png" top="29" left="90" width="49" height="49" path="5-5-23" name_cn="短信息" stat="0"/>
          <image source="mark" mark="qgn_menu_cale_cxt" url="http://img.imoxiu.com:88/mxtpreview/defaultElementImage/s60/appicon/qgn_menu_cale_cxt.png" top="29" left="165" width="49" height="49" path="5-5-17" name_cn="日历" stat="0"/>
          <image source="mark" mark="qgn_menu_mp" url="http://img.imoxiu.com:88/mxtpreview/defaultElementImage/s60/appicon/qgn_menu_mp.png" top="95" left="15" width="49" height="49" path="5-5-47" name_cn="播放器" stat="0"/>    
          <image source="mark" mark="qgn_menu_mg_cxt" url="http://img.imoxiu.com:88/mxtpreview/defaultElementImage/s60/appicon/qgn_menu_mg_2_cxt.png" top="95" left="90" width="49" height="49" path="5-5-33" name_cn="多媒体" stat="0"/>
          <image source="mark" mark="qgn_menu_group_extras" url="http://img.imoxiu.com:88/mxtpreview/defaultElementImage/s60/appicon/qgn_menu_group_extras.png" top="95" left="165" width="49" height="49" path="5-5-100" name_cn="游戏" stat="0"/>
        <image source="mark" mark="qgn_menu_mslaunch_cxt" url="http://img.imoxiu.com:88/mxtpreview/defaultElementImage/s60/appicon/qgn_menu_mslaunch_cxt.png" top="161" left="15" width="49" height="49" path="5-5-1290" name_cn="搜索" stat="0"/>
        <image source="mark" mark="qgn_menu_wml_cxt" url="http://img.imoxiu.com:88/mxtpreview/defaultElementImage/s60/appicon/qgn_menu_wml_cxt.png" top="161" left="90" width="49" height="49" path="5-5-30" name_cn="网络/服务" stat="0"/>
        <image source="mark" mark="qgn_menu_catalogs_cxt" url="http://img.imoxiu.com:88/mxtpreview/defaultElementImage/s60/appicon/qgn_menu_catalogs_cxt.png" top="161" left="165" width="49" height="49" path="5-5-1291" name_cn="下载" stat="0"/>  
        <image source="mark" mark="qgn_menu_group_tools" url="http://img.imoxiu.com:88/mxtpreview/defaultElementImage/s60/appicon/qgn_menu_group_tools.png" top="227" left="15" width="49" height="49" path="5-5-41" name_cn="工具" stat="0"/>

        <image source="mark" mark="qgn_menu_group_install" url="http://img.imoxiu.com:88/mxtpreview/defaultElementImage/s60/appicon/qgn_menu_group_install.png" top="227" left="90" width="49" height="49" path="5-5-39" name_cn="应用程序" stat="0"/>
        <image source="mark" mark="qgn_menu_group_organiser" url="http://img.imoxiu.com:88/mxtpreview/defaultElementImage/s60/appicon/qgn_menu_group_organiser.png" top="227" left="165" width="49" height="49" path="5-5-40" name_cn="办公工具" stat="0"/>
</screen>
<screen layer="3">
        <image source="mark" mark="qsn_cp_scroll_bg_top" url="http://img.imoxiu.com:88/mxtpreview/defaultElementImage/s60/scroll/bg_top240.png" top="30" left="231" width="8" height="8" path="7-17-63" name_cn="滚动槽上部" stat="0"/>
        <image source="mark" mark="qsn_cp_scroll_bg_middle" url="http://img.imoxiu.com:88/mxtpreview/defaultElementImage/s60/scroll/bg_middle249.png" top="38" left="231" width="8" height="249" path="7-17-82" name_cn="滚动槽中部" stat="0"/>
        <image source="mark" mark="qsn_cp_scroll_bg_bottom" url="http://img.imoxiu.com:88/mxtpreview/defaultElementImage/s60/scroll/bg_bottom240.png" top="287" left="231" width="8" height="8" path="7-17-83" name_cn="滚动槽下部" stat="0"/>
</screen>
<screen layer="4">
        <image source="mark" mark="qsn_cp_scroll_handle_top" url="http://img.imoxiu.com:88/mxtpreview/defaultElementImage/s60/scroll/handle_top.png" top="30" left="231" width="8" height="8" path="7-17-84" name_cn="滚动条上部" stat="0"/>
        <image source="mark" mark="qsn_cp_scroll_handle_middle" url="http://img.imoxiu.com:88/mxtpreview/defaultElementImage/s60/scroll/handle_middle143.png" top="38" left="231" width="8" height="143" path="7-17-85" name_cn="滚动条中部" stat="0"/>

        <image source="mark" mark="qsn_cp_scroll_handle_bottom" url="http://img.imoxiu.com:88/mxtpreview/defaultElementImage/s60/scroll/handle_bottom240.png" top="181" left="231" width="8" height="8" path="7-17-86" name_cn="滚动条下部" stat="0"/>
</screen>
<screen layer="5">
        <zone source="mark" mark="icon5" color="617a96" top="14" left="14" width="7" height="1" path="3-43-1229" name_cn="信号小图标颜色" stat="0"/>
        <zone source="mark" mark="icon5" color="617a96" top="15" left="17" width="1" height="7" path="3-43-1229" name_cn="信号小图标颜色" stat="0"/>
        <zone source="mark" mark="icon5" color="617a96" top="15" left="14" width="1" height="1" path="3-43-1229" name_cn="信号小图标颜色" stat="0"/>
        <zone source="mark" mark="icon5" color="617a96" top="16" left="15" width="1" height="1" path="3-43-1229" name_cn="信号小图标颜色" stat="0"/>
        <zone source="mark" mark="icon5" color="617a96" top="17" left="16" width="1" height="1" path="3-43-1229" name_cn="信号小图标颜色" stat="0"/>
        <zone source="mark" mark="icon5" color="617a96" top="15" left="20" width="1" height="1" path="3-43-1229" name_cn="信号小图标颜色" stat="0"/>
        <zone source="mark" mark="icon5" color="617a96" top="16" left="19" width="1" height="1" path="3-43-1229" name_cn="信号小图标颜色" stat="0"/>

        <zone source="mark" mark="icon5" color="617a96" top="17" left="18" width="1" height="1" path="3-43-1229" name_cn="信号小图标颜色" stat="0"/>
</screen>
<screen layer="6">
        <zone source="mark" mark="icon6" color="617a96" top="14" left="222" width="3" height="1" path="3-43-1230" name_cn="电量小图标颜色" stat="0"/>
        <zone source="mark" mark="icon6" color="617a96" top="15" left="221" width="2" height="1" path="3-43-1230" name_cn="电量小图标颜色" stat="0"/>
        <zone source="mark" mark="icon6" color="617a96" top="15" left="224" width="2" height="1" path="3-43-1230" name_cn="电量小图标颜色" stat="0"/>
        <zone source="mark" mark="icon6" color="617a96" top="16" left="221" width="1" height="5" path="3-43-1230" name_cn="电量小图标颜色" stat="0"/>
        <zone source="mark" mark="icon6" color="617a96" top="16" left="225" width="1" height="5" path="3-43-1230" name_cn="电量小图标颜色" stat="0"/>
        <zone source="mark" mark="icon6" color="617a96" top="21" left="221" width="5" height="1" path="3-43-1230" name_cn="电量小图标颜色" stat="0"/>
</screen>

<screen layer="7">
          <text source="mark" mark="text37" color="617a96" b="1" inner="功能表" size="19" align="left" top="2" left="32" width="167" height="23" path="3-44-1235" name_cn="菜单标题文本" stat="0"/>
          <text source="mark" mark="text9" color="4b5879" inner="名片夹" size="12" align="center" top="77" left="5" width="69" height="16" path="3-44-1236" name_cn="功能表图标文本" stat="0"/>
          <text source="mark" mark="text9" color="4b5879" inner="信息" size="12" align="center" top="77" left="80" width="69" height="16" path="3-44-1236" name_cn="功能表图标文本" stat="0"/>
          <text source="mark" mark="text9" color="4b5879" inner="日历" size="12" align="center" top="77" left="155" width="69" height="16" path="3-44-1236" name_cn="功能表图标文本" stat="0"/>
        <text source="mark" mark="text9" color="4b5879" inner="播放器" size="12" align="center" top="143" left="5" width="69" height="16" path="3-44-1236" name_cn="功能表图标文本" stat="0"/>
          <text source="mark" mark="text11" color="9c3958" inner="多媒体" size="12" align="center" top="143" left="80" width="69" height="16" path="3-44-1237" name_cn="通用光标文本" stat="0"/>
          <text source="mark" mark="text9" color="4b5879" inner="游戏" size="12" align="center" top="143" left="156" width="69" height="16" path="3-44-1236" name_cn="功能表图标文本" stat="0"/>
          <text source="mark" mark="text9" color="4b5879" inner="搜索" size="12" align="center" top="209" left="5" width="69" height="16" path="3-44-1236" name_cn="功能表图标文本" stat="0"/>

          <text source="mark" mark="text9" color="4b5879" inner="网络" size="12" align="center" top="209" left="80" width="69" height="16" path="3-44-1236" name_cn="功能表图标文本" stat="0"/>
          <text source="mark" mark="text9" color="4b5879" inner="下载" size="12" align="center" top="209" left="155" width="69" height="16" path="3-44-1236" name_cn="功能表图标文本" stat="0"/>
          <text source="mark" mark="text9" color="4b5879" inner="工具" size="12" align="center" top="275" left="5" width="69" height="16" path="3-44-1236" name_cn="功能表图标文本" stat="0"/>
          <text source="mark" mark="text9" color="4b5879" inner="应用程序" size="12" align="center" top="275" left="80" width="69" height="16" path="3-44-1236" name_cn="功能表图标文本" stat="0"/>
          <text source="mark" mark="text9" color="4b5879" inner="办公工具" size="12" align="center" top="275" left="155" width="69" height="16" path="3-44-1236" name_cn="功能表图标文本" stat="0"/>
          <text source="mark" mark="text13" color="4b5879" b="1" inner="选项" size="17" align="left" top="297" left="2" width="115" height="21" path="3-44-1238" name_cn="通用左软键文本" stat="0"/>        
    <text source="mark" mark="text14" color="4b5879" b="1" inner="退出" size="17" align="right" top="297" left="124" width="115" height="21" path="3-44-1239" name_cn="通用右软键文本" stat="0"/>
</screen>
</mxtpreview>


评论: 0 | 引用: 0 | 查看次数: 6386
发表评论
登录后再发表评论!