找回密码
 新注册用户
搜索
查看: 13792|回复: 10

BOINC皮肤教程:为BOINC管理器创建皮肤

[复制链接]
发表于 2007-11-17 19:49:14 | 显示全部楼层 |阅读模式
本文档将描述如何自定义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部分都是可选的。
示例

皮肤设计语句
普通
普通设计语句包含组成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>
回复

使用道具 举报

 楼主| 发表于 2007-11-17 19:50:09 | 显示全部楼层
皮肤基本元素
图像
图像用于背景和其它视觉元素。
图像语句结构如下:
<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等)。
回复

使用道具 举报

 楼主| 发表于 2007-11-17 19:55:14 | 显示全部楼层
本教程由中国分布式论坛(Equn.com)组织翻译、编写;
翻译:Nye
整理:Cnchina

英文版见这页

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

update 08/06/17

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

使用道具 举报

发表于 2007-11-18 08:13:22 | 显示全部楼层
复杂 不是很懂~~~~~ 不过 楼主好!!!
回复

使用道具 举报

发表于 2007-11-18 09:47:06 | 显示全部楼层
原帖由 caosimin7532 于 2007-11-18 08:13 发表
复杂 不是很懂~~~~~ 不过 楼主好!!!

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

使用道具 举报

 楼主| 发表于 2007-11-18 12:57:59 | 显示全部楼层
我也只不过希望能在某位朋友制作皮肤时有个中文方面的资料罢了

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

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

使用道具 举报

 楼主| 发表于 2007-11-25 06:46:20 | 显示全部楼层
这个教程是我们论坛组织编写的成果,是否可以以GNU Free Documentation License(GFDL)释出?
回复

使用道具 举报

发表于 2007-11-25 09:08:19 | 显示全部楼层
谁有能力的话,做个Team China的皮肤吧!
回复

使用道具 举报

发表于 2007-11-25 16:27:23 | 显示全部楼层
原帖由 Tynox 于 2007-11-25 09:08 发表
谁有能力的话,做个Team China的皮肤吧!



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

使用道具 举报

发表于 2008-6-17 20:49:49 | 显示全部楼层
原帖由 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)
回复

使用道具 举报

发表于 2008-8-7 13:34:36 | 显示全部楼层

不用GFDL是不可以的

原帖由 cnchina 于 2007-11-25 06:46 发表
这个教程是我们论坛组织编写的成果,是否可以以GNU Free Documentation License(GFDL)释出?


1.虽然还没有具体实施在BOINC的项目,不过好期待有一款为EQUN创作的皮肤。

2.The BOINC Manager simple view
现在已经成功链接到http://boinc.berkeley.edu/wiki/Simple_view

3.EQUN的翻译工作理应遵守相应的版权协议。
EQUN 版权信息
http://www.equn.com/wiki/Template:Copyright
相关讨论
http://www.equn.com/forum/thread-9292-4-7.html

引用
wikipedia版权信息
繁体版权信息
http://zh.wikipedia.org/wiki/Wik ... 3%E4%BF%A1%E6%81%AF
简体版权信息
http://zh.wikipedia.org/wiki/Wik ... 3%E4%BF%A1%E6%81%AF
Wikipedia:版权信息
http://zh.wikipedia.org/w/index. ... F&variant=zh-cn
Wikipedia:GNU自由文档许可证文本
http://zh.wikipedia.org/w/index. ... C&variant=zh-cn

GNU 通用公共授權 第三版
http://wiki.debian.org.hk/w/GPLv3
GNU 自由文本授权 (简体中文翻译版)
http://www.thebigfly.com/gnu/FDLv1.2/
GNU Free Documentation License
http://www.gnu.org/copyleft/fdl.html
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 新注册用户

本版积分规则

论坛官方淘宝店开业啦~
欢迎大家多多支持基金会~

Archiver|手机版|小黑屋|中国分布式计算总站 ( 沪ICP备05042587号 )

GMT+8, 2024-3-29 17:03

Powered by Discuz! X3.5

© 2001-2024 Discuz! Team.

快速回复 返回顶部 返回列表