标题: BOINC皮肤教程:为BOINC管理器创建皮肤
  本主题由 Youth 于 2007-11-17 21:22 加入精华 
cnchina
资深顾问
Rank: 5Rank: 5
放假了~


UID 12674
精华 3
积分 1113
帖子 950
阅读权限 10
注册 2007-3-10
来自 EY☆汕頭
发表于 2007-11-17 19:49  资料  短消息  加为好友 
BOINC皮肤教程:为BOINC管理器创建皮肤

本文档将描述如何自定义BOINC Manger普通视图的外观。

关键词: BOINC, BOINC Manger, skin, BOINC皮肤, BOINC管理器皮肤, 教程, BOINC皮肤教程

皮肤

皮肤可以使你自定义BOINC Manager的外观。
任何自定义皮肤都需要一个skin.xml文件。本文档将介绍skin.xml文件的结构。
skin.xml应当包含在在'skins'文件夹下自己的目录内。
实例:


+ /BOINC

|

+---+ /Skins

    |

    +---+ /Skin Name

         |

         +---+ skin.xml

              |

              +---+ <skin resources>


本地化

BOINC Manager 会尝试找出并使用本地化的皮肤选项。它将自动选择合适的语言,如果无法找到合适的语言,则回到英文。在‘Advanced GUI’的选项对话框内可以设置忽略语言搜索功能。

如果当前的本地设置为'pt_BR',而所选择的皮肤里无法找到这个本地设置,那么下一个要搜索的语言就是'pt'。如果'pt’也无法找到,那么管理器就会选择'en'。

Skin choice


Example


Locale


pt_BR


Language


pt


English


en


BOINC built-in skin


BOINC built-in skin



结构
skin.xml文件结构如下:

<skin>

  <pt_BR>
   <simple />
   [ <advanced /> ]
   [ <wizards /> ]
  </pt_BR>

  <pt>
   <simple />
   [ <advanced /> ]
   [ <wizards /> ]
  </pt>

  <en>
   <simple />
   [ <advanced /> ]
   [ <wizards /> ]
  </en>

</skin>


以上的advanced和wizard部分都是可选的。

示例

World Community Grid skin

Skin examples


皮肤设计语句

普通

普通设计语句包含组成Simple GUI的所有元素。
普通设计语句内有:

名字
Name


类型
Type


图像宽
Image Width


图像高
Image Height


备注
Notes


background_image


Image


410px


540px


用作Simple GUI背景图像。此元素需要确定一个背景颜色。Used as the Simple GUI background image. A background color should be specified for this element.


spacer_image


Image


2px


11px


用于分隔Simple GUI底部的链接。Used to separate the links on the bottom of the Simple GUI


static_line_color


String






此颜色以':'为标志,用RGB值表示。The color is represented as an RGB value with the token being ':'


state_indicator_background_image


Image


264px


35px




connecting_indicator_image


Image


14px


15px




error_indicator_image


Image


69px


20px




workunit_active_tab


Simple Tab


16px


16px




workunit_suspended_tab


Simple Tab


16px


16px




workunit_tab_area_background_image


Image


343px


24px




workunit_area_background_image


Image


343px


314px




workunit_animation_background_image


Image


294px


146px




workunit_animation_image


Image


290px


126px




workunit_gauge_background_image


Image


258px


18px




workunit_gauge_progress_indicator_image


Image


8px


7px




project_area_background_image


Image


343px


113px




project_image


Image


40px


40px


未设定图片的项目的默认显示图片。Default image to display for a project that does not currently have an image defined.


attach_project_button


Simple Button


81px


18px




right_arrow_button


Simple Button


20px


20px




left_arrow_button


Simple Button


20px


20px




save_button


Simple Button


57px


16px




synchronize_button


Simple Button


81px


18px




cancel_button


Simple Button


57px


16px




close_button


Simple Button


57px


16px




help_button


Simple Button


18px


18px




copy_all_button


Simple Button


85px


18px




copy_button


Simple Button


85px


18px




messages_link_image


Simple Link


70px


20px




messages_alert_link_image


Simple Link


70px


20px




suspend_link_image


Simple Link


59px


20px




resume_link_image


Simple Link


59px


20px




preferences_link_image


Simple Link


81px


20px




advanced_link_image


Simple Link


101px


20px




dialog_background_image


Image


800px


600px


对话框的高和宽随着计算机的设置而变化,所以图像的中心就是在对话框中所指定的位置。The dialogs height and width change according to the configuration of the computer so the center of the image is what is drawn on to the dialog.



普通设计语句结构如下:


<simple>

<background_image />

<spacer_image />

...

</simple>


高级

高级设计语句包含组成Advanced GUI的所有元素。
高级设计语句内有:

Name


Type


Image Width


Image Height


Notes


application_name


String






显示于标题栏的应用程序名Displayed in title bar.


application_short_name


String






应用程序名的简写Shorter version of the application name


application_icon


Icon


16px


16px


任务栏图标Taskbar icon.


application_disconnected_icon


Icon


16px


16px


无法连接时的任务栏图标Taskbar icon when disconnected.


application_snooze_icon


Icon


16px


16px


休息时的任务栏图标Taskbar icon when snoozing.


application_logo


String


50px


50px


显示在“关于”中的应用程序图标Application logo that appears in the about box.


organization_name


String






发布客户端软件包的组织名称Organization associated with the release of the client software package.


organization_website


String






组织的网站Organization website.


organization_help_url


String






组织的帮助链接Organization's help url.
Parameters:
target = which view launched the help request.
version = the version of boinc that launched the help request.
controlid = which control within the view was the user trying to get help with.
See Manager Help System? for further details.


open_tab


Number






高级GUI默认显示。“0”表示打开上次使用的。Which tab to open by default in the Advanced GUI. A value of '0' means open the last tab used.


exit_message


String






关闭BOINC管理器时显示给用户的信息。What message should be sent to the user when they close BOINC manager.



高级设计语句结构如下:


<advanced>
<application_name />
<application_icon />
...

</advanced>


向导

向导设计语句包含两个元素,分为项目向导附加元素和帐号向导附加元素。
项目向导附加元素结构如下:


<attach_to_project>

<title>Attach to Project</title>

<logo>graphic/logo.png</logo>

</attach_to_project>


其中标题会在向导的标题栏中显示。
图标将在向导的每个页面里显示,图标文件应高280px,宽115px。格式可以为以下任何一种:PNG,JPG,GIF,和BMP。图标文件的放置位置应参照skin.xml描述文件,其中地址分隔符在所有平台下都为'/'。


帐号向导附加元素结构如下:

<attach_to_account_manager>

<title>Attach to Account Manager</title>

<logo>graphic/logo.png</logo>

<account_info_message></account_info_message>

</attach_to_account_manager>


其中标题会在向导的标题栏中显示。
图标将在向导的每个页面里显示,图标文件应高280px,宽115px。格式可以为以下任何一种:PNG,JPG,GIF,和BMP。图标文件的放置位置应参照skin.xml描述文件,其中地址分隔符在所有平台下都为'/'。

account_info_message是当询问用户用户名/电邮地址以及密码信息时,管理器显示的文字。


向导设计语句示例如下:

<wizards>

<attach_to_project />

<attach_to_account_manager />

...

</wizards>


顶部
[广告] NV版FAH客户端已出,附简单教程!
cnchina
资深顾问
Rank: 5Rank: 5
放假了~


UID 12674
精华 3
积分 1113
帖子 950
阅读权限 10
注册 2007-3-10
来自 EY☆汕頭
发表于 2007-11-17 19:50  资料  短消息  加为好友 

皮肤基本元素

图像

图像用于背景和其它视觉元素。
图像语句结构如下:

<image>

<imagesrc>graphics/image.jpg</imagesrc>

[ <background_color>255:0:255</background_color> ]

</image>


imagesrc语句描述所使用的图像的名字和位置。图像文件格式可以为以下任何一种:PNG,JPG,GIF,和BMP。其位置应参照skin.xml描述文件,其中地址分隔符在所有平台下都为'/'。
注意:我们收到过JPG格式文件在backgroud_image,project_area_backgroud_image,dialog_backgroud_image和workunit_area_backgroud_image语句里无效的报告。如果你也遇到了这样的情况,请把图像文件转为PNG格式。我们会在5.10.x版本里修正这个问题。
background_color语句是可选的,它描述的是在描绘出图像以前在对话框里要显示的颜色(译:就是对话框的背景色)。此颜色以':'为标志,用RGB值表示。


图标

这些元素用于描述多种场合下任务栏的图标。
图标语句结构如下:


<image>

<imagesrc>graphics/image.jpg</imagesrc>

<transparency_mask>255:0:255</transparency_mask>

</image>


imagesrc描述所使用图像文件的名字和位置。文件格式可以为以下任何一种:PNG,JPG,GIF,和BMP。而位置应参照skin.xml描述文件,其中地址分隔符在所有平台下都为'/'。
transparency_mask描述应作为透明蒙版的背景色。此颜色以':'为标志,用RGB值表示。


普通选项卡

普通选项卡的各种类型就表示活动任务可以显示的各种状态。
选项卡语句结构如下:

<tab>

<imagesrc>graphic/icon.png</imagesrc>

<border_color>51:102:102</border_color>

<gradient_from_color>51:102:102</gradient_from_color>

<gradient_to_color>134:179:176</gradient_to_color>

</tab>


imagesrc描述所使用图像文件的名字和位置。文件格式可以为以下任何一种:PNG,JPG,GIF,和BMP。而位置应参照skin.xml描述文件,其中地址分隔符在所有平台下都为'/'。
border_color描述标识外圈的颜色。此颜色以':'为标志,用RGB值表示。
gradient_from_color描述开始渐变效果的颜色。此颜色以':'为标志,用RGB值表示。
gradient_to_color描述结束渐变效果的颜色。此颜色以':'为标志,用RGB值表示。


普通链接

版式

使用以下3种版式将是皮肤制作变得更加容易(以下版式为透明GIF)。

* 要使用模板,就要有能支持多层对象的图像处理程序,如Photoimpact,这样你就能把模板移到合适图像(背景图像)上所想要放置的位置。
* 模板颜色说明:绿色线/边缘线表示模板在相应图像(背景图像)上的位置。红色线条标示的区域对应于剪切/粘贴依次图像的位置。

创建一个皮肤所需要的是一个现有的完整的背景图像,大小410×540像素。

* 从template_1开始(通过移动,放置,复制到背景图像中),我们开始创建workunit_area_backgroud_image和project_area_backgroud_image。

* 现在,如果需要,workunit_area_backgroud_image和project_area_backgroud_image可以分别按照需要的效果进行设计(比如透明效果)。

* 然后,template_2(通过复制,移动和放置)可以用于background_image,workunit_backgroud_image和project_background_image,以达到需要的效果(比如透明效果),最终创建以后需要的图像(如workunit_tab_area_background_image, workunit_gauge_background_image等)。


顶部
cnchina
资深顾问
Rank: 5Rank: 5
放假了~


UID 12674
精华 3
积分 1113
帖子 950
阅读权限 10
注册 2007-3-10
来自 EY☆汕頭
发表于 2007-11-17 19:55  资料  短消息  加为好友 
本教程由中国分布式论坛(Equn.com)组织翻译、编写;
翻译:Nye
整理:Cnchina

英文版见这页

欢迎大家回帖提出修改意见:)

update 08/06/17

英文版页面已转移至:http://boinc.berkeley.edu/trac/wiki/ProjectSkin  

顶部
caosimin7532
论坛会员
Rank: 2


UID 6465
精华 0
积分 116
帖子 116
阅读权限 10
注册 2005-7-31
来自 佛山
发表于 2007-11-18 08:13  资料  短消息  加为好友  QQ
复杂 不是很懂~~~~~ 不过 楼主好!!!





不要积分统计,不是因为我不懂,是我不想,不想为一个数字而做一件本来就很有意义的事,我喜欢默默的………
顶部
Tynox
论坛担当
Rank: 4
Viva La Vida


UID 15420
精华 0
积分 888
帖子 879
阅读权限 10
注册 2007-11-3
来自 上海
发表于 2007-11-18 09:47  资料  主页 短消息  加为好友  添加 Tynox 为MSN好友 通过MSN和 Tynox 交谈 QQ


QUOTE:
原帖由 caosimin7532 于 2007-11-18 08:13 发表
复杂 不是很懂~~~~~ 不过 楼主好!!!

同感.对这些不是很了解,所以不改了.而且不常用简易视图.





顶部
cnchina
资深顾问
Rank: 5Rank: 5
放假了~


UID 12674
精华 3
积分 1113
帖子 950
阅读权限 10
注册 2007-3-10
来自 EY☆汕頭
发表于 2007-11-18 12:57  资料  短消息  加为好友 
我也只不过希望能在某位朋友制作皮肤时有个中文方面的资料罢了

如果连资料都没有,就算有心为Team China做一套皮肤都没办法呀。。

(如果需要其它现成的模版,这一页不错:http://www.altes-beckhaus.com/cf/dlc/index.php





顶部
cnchina
资深顾问
Rank: 5Rank: 5
放假了~


UID 12674
精华 3
积分 1113
帖子 950
阅读权限 10
注册 2007-3-10
来自 EY☆汕頭
发表于 2007-11-25 06:46  资料  短消息  加为好友 
这个教程是我们论坛组织编写的成果,是否可以以GNU Free Documentation License(GFDL)释出?





顶部
Tynox
论坛担当
Rank: 4
Viva La Vida


UID 15420
精华 0
积分 888
帖子 879
阅读权限 10
注册 2007-11-3
来自 上海
发表于 2007-11-25 09:08  资料  主页 短消息  加为好友  添加 Tynox 为MSN好友 通过MSN和 Tynox 交谈 QQ
谁有能力的话,做个Team China的皮肤吧!





顶部
6233lele
论坛会员
Rank: 2


UID 12635
精华 0
积分 79
帖子 72
阅读权限 10
注册 2007-3-2
来自 沈阳
发表于 2007-11-25 16:27  资料  短消息  加为好友  添加 6233lele 为MSN好友 通过MSN和 6233lele 交谈 QQ


QUOTE:
原帖由 Tynox 于 2007-11-25 09:08 发表
谁有能力的话,做个Team China的皮肤吧!



有做美工的玩BOINC么?搞一搞吧





公司限制上Internet,寝室刚刚开通Internet,虽然很慢,hoho...
7*24h computing, and update everyday...... I wish, hoho

顶部
duligavin
论坛知事
Rank: 3Rank: 3



UID 11501
精华 0
积分 258
帖子 192
阅读权限 10
注册 2006-7-4
发表于 2008-6-17 20:49  资料  短消息  加为好友 


QUOTE:
原帖由 cnchina 于 2007-11-17 19:55 发表
本教程由中国分布式论坛(Equn.com)组织翻译、编写;
翻译:Nye
整理:Cnchina

英文版见这页。

欢迎大家回帖提出修改意见:)

链接无效!官方WIKI更新了

错误连接到这里:http://boinc.berkeley.edu/trac/wiki/TracGuide

新的SKIN配置连接在这里:http://boinc.berkeley.edu/trac/wiki/ProjectSkin

但是官方WIKI也还不完善。置顶的连接simple view?  也是无效连接,返回404 Not Found 。
通过add it to the wiki to-do list. 返回500 Internal Server Error (Page not modified)

顶部
 



当前时区 GMT+8, 现在时间是 2008-7-7 08:54
沪ICP备05042587号

本论坛支付平台由支付宝提供
携手打造安全诚信的交易社区 Powered by Discuz! 5.5.0 © 2001-2007 Comsenz Inc.
清除 Cookies - 联系我们 - 中国分布式计算总站 - Archiver - WAP