About

<#TEMPLATE_INCLUDE_NINEPAGE_ABOUTME#>
  • Jan

    26

    Feathers3 BitmapFontTextRenderer 一些备注

    • 0 Comments
    • Flash Platform
    • 发布:古树悬叶
    • 引用:0
    • 浏览:

    BitmapFontTextRenderer 是 Feathers3 组件提供的内置文本渲染器(也被称为“文本呈现器”,text renderers)之一,使用位图字体(bitmap fonts)作为文本渲染器的内容。

    优缺点:

    位图字体将每个字符的图形轮廓作为纹理集中的子纹理,如果具有特殊的样式(如渐变、投影等)可以提供最佳性能(不需要运行时动态生成,可以节省性能)。

    位图字体比较适合用于游戏开发,一般只有少量的文字(没有大段大段的文字),比如 HP 值、积分、弹药数量等等,可以快速的切换显示需要的字符轮廓图形纹理,而不需要重复的将纹理提交 GPU。

    位图字体有时候也可以用于大段的文字(比如有统一的字体、字号和样式),因为每个字符对应的是一个单独的子纹理,所以可以重复的使用,以节省 GPU 的显存。但是由于每一个纹理显示时都会对应有一个 Starling 显示列表上的 Image 对象,随着字符数量的增加,所有这些单独的显示对象的变换计算可能最终会很消耗 CPU (如果有可能的话,需要测试以确定一台设备的CPU可以一次处理多少个字符)。

    英语只有 26 个字母(除了一些需要用到的标点或其它特定的字符),一些语言可能需要成百上千,比如说中文……由于 GPU 纹理尺寸限制,除了使用其它文本渲染器外,就别无选择了。

    位图字体是可以被缩放的,但一般中人推荐缩小(因为放大模糊会比缩小模糊的更快)。可能会失去文本的细节,在较小号的字体时使用矢量字体有更好的清晰度,文字清晰了就更易于阅读。对相同字体但不同字号的情况,通常是制作多份字体的纹理集,但这会需要更多的内存。

    在同一个位图文本渲染器中,不支持多种字体样式(即一个字符只对应一个字符的轮廓图形)。

    高级字体样式

    通常,是对一个文本渲染器的父组件使用 starling.text.TextFormat 类设置文本样式,例如设置一个按钮的文本样式:

    button.fontStyles = new TextFormat( "Helvetica", 20, 0xcc0000 );

    直接在按钮上设置了 fontStyles 属性,而不是在文本渲染器上设置。但是 starling.text.TextFormat 并不能设置文本渲染器的所有字体样式。如果想要进行高级的字体样式设置,可以参考下面的资料。以 Button 组件为例,设置 labelFactory 属性值:

    var button:Button = new Button();

    button.label = "Click Me";

    button.labelFactory = function():ITextRenderer
    {
        var textRenderer:TextBlockTextRenderer = new TextBlockTextRenderer();

        //为避免与主题文件中默认设置的样式冲突,先删除 styleProvider 提供的样式
        //labelFactory 会先执行,然后再执行主题文件中的代码,styleProvider 设为null 后,可以避免被覆盖
        textRenderer.styleProvider = null;

        //在这里设置高级字体样式
        //……

        return textRenderer;
    };

    高级字体样式可以通过一个 BitmapFontTextFormat 对象来自定义,然后将这个对象赋值给位图文本渲染器的 textFormat 属性:

    var format:BitmapFontTextFormat = new BitmapFontTextFormat( "FontName" );

    位图字体的名称通过 TextField.registerBitmapFont() 方法注册。位图字体如未注册过,也可以使用 starling.text.BitmapFont 类。

    可以给位图字体设置颜色值,这个颜色值会被预乘(multiplied)到纹理的颜色,效果类似 starling.display.BlendMode.MULTIPLY 混合模式 :

    format.color = 0xc4c4c4;

    为了最大范围的颜色设置,位图字体纹理在导出时最好是纯白色导出的。

    可以使用align属性自定义文本的对齐方式:

    format.align = TextFormatAlign.CENTER;

    位图字体可以设置字号大小,但缩放的时候不会像矢量字体那样“美观”(清晰):

    format.size = 18;

    在大多数情况下不需要设置 size 的值,会自动检测字号的大小。对相同字体但不同字号的情况,通常是制作多份字体的纹理集,位图字体注册不同的名称,但这会需要更多的内存。

    其它更多的高级字体样式功能参考 BitmapFontTextRenderer API BitmapFontTextFormat API

    一个文本渲染器的父组件有多个状态,如何更改它的高级字体样式:

    一些组件类似 Button 和 TextInput,文本渲染器的父对象有多个状态。可以传递多个 BitmapFontTextFormat 对象给 BitmapFontTextRenderer 对象。再次以 Button 组件为例,通过 setElementFormatForState() 方法,给“按下”状态一个不同的字体样式: 

    var defaultFormat:BitmapFontTextFormat = new BitmapFontTextFormat( "FontName", 20, 0xc4c4c4 );
    textRenderer.textFormat = defaultFormat;

    var downFormat:BitmapFontTextFormat = new BitmapFontTextFormat( "FontName", 20, 0x343434 );
    textRenderer.setTextFormatForState( ButtonState.DOWN, downFormat );

    其它的如 HOVER 状态、DISABLED 状态设置方法都一样。

    • Tags:
    • 2017 / 1 / 26
    相关文章:
      Post Comment.

      发表评论