Ogre参考手册(七)3.4 表层(overlay),3.5 字体定义

3.4 表层(Overlay)

表层脚本用于通过脚本定义表层。同时,你仍可以在代码中通过SceneManager\Overlay\OverlayElement等类设置表层,不过那么做显的比较笨。作为代替,你可以将表层定义在文本文件中并在需要的时候加载。

表层脚本在初始化时加载,默认为所有公共资源位置(Root::addResourceLocation)下的’.overlay文件。你可以通过OverlayManager::getSingleton().parseAllSources方法加载自定义扩展名的文件类型,或者通过OverlayManager::getSingleton().parseScrip解析单个脚本文件

格式

可以在单个脚本中定义多个表层。采用伪C++格式,各段使用大括号’{}’限定,注释使用’//’(不允许嵌套注释,1.8之前不允许中文注释)。例:

// The name of the overlay comes first

MyOverlays/ANewOverlay

{

    zorder 200

 

    container Panel(MyOverlayElements/TestPanel)

    {

        // Center it horizontally, put it at the top

        left 0.25

        top 0

        width 0.5

        height 0.1

        material MyMaterials/APanelMaterial

 

        // Another panel nested in this one

        container Panel(MyOverlayElements/AnotherPanel)

        {

             left 0

             top 0

             width 0.1

             height 0.1

             material MyMaterials/NestedPanel

        }

    }

}

表层必须有名称,名称必须唯一,名称中可以含路径符’/’,该字符可以用来逻辑划分表层,也有助于避免重复,引擎并不依据此按树结构处理。如果表层名称包含空格,需用双引号括起来

表层仅一个属性’zorder’,大的显示在上面

内嵌元素:

element

2d 元素没有孩子()

container

2d 容器,用于包含容器或元素

container/element块

格式:[container | element] <type_name> ( <instance_name>) [: <template_name>]

typename OverlayElement类型名,类型通过OverlayManager插件接口注册。Ogre预置了Panel(面板)\BorderPanel(带边框面板)和TextArea(文本框)

instance_name 名称,必须全局唯一,可用于获取实例:OverlayManager::getSingleton(). getOverlayElement(name)

template_name 可选的继承模板

模板

用于定义一组抽象的属性,用于创建element,不可添加到表层,仅用于继承。模板通过顶层关键字’template’定义。建议采用单独的文件定义模板,不过这并不必须。模板可以继承模板,例:

template container BorderPanel(MyTemplates/BasicBorderPanel)

{

    left 0

    top 0

    width 1

    height 1

 

// setup the texture UVs for a borderpanel

// do this in a template so it doesn't need to be redone everywhere

    material Core/StatsBlockCenter

    border_size 0.05 0.05 0.06665 0.06665

    border_material Core/StatsBlockBorder

    border_topleft_uv 0.0000 1.0000 0.1914 0.7969

    border_top_uv 0.1914 1.0000 0.8086 0.7969

    border_topright_uv 0.8086 1.0000 1.0000 0.7969

    border_left_uv 0.0000 0.7969 0.1914 0.2148

    border_right_uv 0.8086 0.7969 1.0000 0.2148

    border_bottomleft_uv 0.0000 0.2148 0.1914 0.0000

    border_bottom_uv 0.1914 0.2148 0.8086 0.0000

    border_bottomright_uv 0.8086 0.2148 1.0000 0.0000

}

template container Button(MyTemplates/BasicButton) : MyTemplates/BasicBorderPanel

{

    left 0.82

    top 0.45

    width 0.16

    height 0.13

    material Core/StatsBlockCenter

    border_up_material Core/StatsBlockBorder/Up

    border_down_material Core/StatsBlockBorder/Down

}

template container BorderPanel(SdkTrays/Button)

{

metrics_mode pixels

material SdkTrays/Button/Up

horz_align center

height 32

uv_coords 0.145 0.000 0.855 1.000

border_material SdkTrays/Button/Up

border_size 16 16 0 0

border_left_uv  0.000 0.000 0.125 1.000

border_right_uv 0.875 0.000 1.000 1.000

element TextArea(ButtonCaption)

{

        metrics_mode pixels

        horz_align center

        vert_align center

        alignment center

        font_name SdkTrays/Caption

        char_height 15

        space_width 7

        colour 0 0 0

}

}

 

继承模板:

 

MyOverlays/AnotherOverlay

{

    zorder 490

    container BorderPanel(MyElements/BackPanel) : MyTemplates/BasicBorderPanel

    {

        left 0

        top 0

        width 1

        height 1

 

        container Button(MyElements/HostButton) : MyTemplates/BasicButton

        {

            left 0.82

            top 0.45

            caption MyTemplates/BasicText HOST

        }

 

        container Button(MyElements/JoinButton) : MyTemplates/BasicButton

        {

            left 0.82

            top 0.60

            caption MyTemplates/BasicText JOIN

        }

    }

}

3.4.1 表层元素(OverlayElement)属性

用于container或element元素

metrics_mode

格式:metrics_mode <pixels | relative>, 默认relative(相对于屏幕大小比例)

设置大小和文字度量方式

horz_align

设置水平对齐方式

格式:horz_align <left | center | right>, 默认left

实际为设置参照点位置(元素并不会自动对齐),例:像素模式下,希望将一个宽10的元素右对齐,需要设置horz_align right,同时left -10。

vert_align

垂直对齐

格式: vert_align <top|center|bottom>, 默认top

left

左坐标,水平位置。相对于父对象(父为Overlay时相对于屏幕)

top

顶坐标,垂直位置

width/height

宽/高,相对于屏幕(不相对于父)

material

材质,依赖于元素的类型,Panel作为背景,BorderPanel作为中心区。

注:表层的材质自动禁用光照和深度检查。因此不用为表层使用与3D对象相同的材质

caption

标题

rotation

旋转

格式:rotation <angle_in_degrees> <axis_x> <axis_y> <axis_z> 

例: rotation 30 0 0 1 ,一般绕z轴旋转

3.4.2 标准表层元素

Ogre的OverlayElement和OverlayContainer类设计用于开发人员扩展,不过Ogre提供了以下标准的表层元素:

Panel(container)

面板,最基本的容器类,用于包含其它element或container,背景图由材质决定,仅在透明关闭时显示。

包含以下属性:

transparent <true | false>

tiling <layer> <x_tile> <y_tile>

设置背景纹理在x\y方向平铺个数, layer指定纹理层索引,在使用动态纹理时效果很好

uv_coords <topleft_u> <topleft_v> <bottomright_u> <bottomright_v>

设置面板使用的纹理坐标

BorderPanel(container)

带框的面板,被分为9个区域,中心使用主材质,外边8个使用独立的边框材质。

包含属性:

border_size <left> <right> <top> <bottom>

border_material <name>

border_topleft_uv <u1> <v1> <u2> <v2>

四个角纹理坐标[also border_topright_uv, border_bottomleft_uv, border_bottomright_uv]

border_left_uv <u1> <v1> <u2> <v2>

四个边纹理[also border_right_uv, border_top_uv, border_bottom_uv];

TextArea(element)

基本的文本渲染元素。字体通过FontManager和Font类定义,也可通过预定义的.fontdef文件定义。

包含属性:

font_name <name>

      .fontdef中定义的字体名

char_height <height>

      相对于屏幕高度比例

colour <red> <green> <blue>

字体颜色

colour_bottom <red> <green> <blue> / colour_top <red> <green> <blue>

字体颜色渐变

alignment <left | center | right>

文本对齐方式

space_width <width>

间距,相对于屏幕宽

3.4 字体定义 (Font)

Ogre使用基于纹理的字体渲染TextArea。你也可以根据自己的需要使用字体对象。字体的最终形式是依据字体生成的材质对象,以及一组字符(glyph)纹理坐标信息

有两种方式产生字体:

1 通过工具设计字体纹理

2 使用Ogre依据truetype字体生成纹理

第一种可以获得最大的灵活性和性能(加载)。不过第二种比较方便,建议在原型阶段采用,最后再转换到第一种。你还可以通过FontManager在运行时生成新的字体。

字体通过.fontdef文件定义,格式如下:

<font_name>

{

    type <image | truetype>

    source <image file | truetype font file>

    ...

    ... custom attributes depending on type

}

使用已有的字体纹理

Ogre支持利用已有纹理图创建字体,对应参数设置:

type image 设置类型为图片格式

source filename 设置图片文件名

glyph <character> <u1><v1><u2><v2>逐个设置单个字符的纹理坐标(左上/右下)

      字符可以是非扩展的ASCII码字符,或者‘u’开头的十进制数表示的unicode扩展字符,如:

      u0546表示unicode值546对应的字符

推荐使用BitmapFontBuilder(http://www.lmnopc.com/bitmapfontbuilder/)创建纹理,在tools目录下可以找到将二进制输出转换为glyph行文本的工具

生成字体纹理

你可以根据truetype字体生成字体纹理,我不建议严重依赖于这种方式,因为生成纹理可能花费好几秒从而增加启动时间。不过这是一个很快的获取字体的办法。属性设置:

type truetype

source <ttf file>字体文件名,位于公共资源路径或者通过FntManager添加的资源路径

size <size_in_points> 文字大小point

resolution <dpi> 分辨率(dots per inch),正常为72或96

antilias_colour <true | false> 可选,默认false,Ogre默认通过alpha充分反锯齿。但如果你希望在代码中使用color blend方式(add/modulate),可以设置为true。

code_points nn-nn [n-nn].. 指定生成纹理的unicode代码。如果不指定,自动使用33-166,即基本latin1字符。

character_spacer <spacing_in_points>

对非典型宽度的字体很有用,比如美术文字,你可以看到字符重叠的缺陷。默认值为5

原文地址:https://www.cnblogs.com/wiki3d/p/4658255.html