About

<#TEMPLATE_INCLUDE_NINEPAGE_ABOUTME#>
  • Jan

    19

    TiledRowsLayout 类 与 TiledColumnsLayout 类用法和功能相似(我中文称它们为拼贴或拼贴块,也有看到别人称它们为磁砖),一个从左向右显示多行排列容器中的子对象,一个是从上往下排列容器中的子对象。它们都支持水平或垂直分页显示,都支持子对象之间的间距、对齐方式设置。

    useSquareTiles 属性用于设置 Tile 块是否为矩形或正方形。

    padding 属性以像素为单位,设置子对象与容器边缘的间距。

    paddingTop、paddingRight、paddingBottom、paddingLeft 可以特殊处理每一个不同的边距。

    gap 属性以像素为单位,设置 Tile 块之间的间距。

    horizontalGap、verticalGap 属性也能分别设置水平与垂直方向不同的间距。

    horizontalAlign、verticalAlign 属性分别决定对齐方式。

    tileHorizontalAlign、tileVerticalAlign 属性分别决定 Tile 块对齐方式。

    requestedColumnCount 属性决定 TiledRowsLayout 类的指定拼贴块的列数。

    a、如果容器的尺寸过小,布局可能会无法容纳指定的列数;但只要尺寸够大,就会显示指定的列数。举个列子:

    layout.requestedColumnCount = 3;

    如上列数设为 3 列时,如果容器的尺寸可以容纳3列以上,它也只会显示3列;但如果容器的尺寸如果只能容纳1列或2列,那么它会按容器的最大可容纳的列数显示,而不会是 3。

    b、需要注意的是,如果容器的宽度没有手动设定大小,layout 布局将会自动计算容器的宽度以匹配 requestedColumnCount 的设置的值。 

    requestedRowCount 属性决定 TiledColumnsLayout 类的指定拼贴块的行数.

    基本与 requestedColumnCount 属性对 TiledRowsLayout 类的意图类似,只不过一个是针对列的,一个是针对行的。

    manageVisibility 属性,这是一个已经消失的属性。决定视图区域(view port)外的拼贴块是否可见,如果设为 true ,这可以提高渲染性能,特别是在虚拟化布局时(但这样一来,所有拼贴块就无法再单独设置 visible 属性了)默认值为 false。

    PS:Feathers 2.x 中存在,但在 3.x 中不存在了。

    paging 属性可以设置分页功能(分页可以是水平的也可以是垂直的)每个页面会有边缘 paging(缩进/填充)。

    a、TiledRowsLayout 类会自动启用垂直对齐;TiledColumnsLayout  类会自动启用水平对齐。

    b、如果是在滚动容器与列表类(ScrollContainer、List)组件中, snapToPages 属性需要设为true;如果值为 false,可以停留在任何位置。

    c、可以与 PageIndicator 类结合使用,以给用户预显示当前所处的位置,也可以用于快速导航页面。

    最后,与其它布局类一致的提示,需要注意性能问题。如果能够使用虚拟化布局就尽量使用虚拟化布局(LayoutGroup 与 ScrollContainer 是没有虚拟化布局的,在它们的子类中查看 useVirtualLayout 是否存在)。

    Jan

    18

    《山鹰之歌 (原名:El condor pasa)》是一首反抗西班牙殖民者的南美秘鲁一带的印第安民歌,这首旋律已经被列入联合国世界文化遗产。

    《El Condor Pasa》的原版据传是基于秘鲁自由战士Tupac Amaro 的故事。1780 年,他在领导一场反抗西班牙人的起义中被害,死后变成一只山鹰,永远翱翔于安第斯山上。秘鲁人民暨此体现对自由的追求不息,而歌名的直译就是“翱翔的山鹰”。

    More...

    Jan

    18

    Feathers3 ProgressBar 一些备注

    • 0 Comments
    • Flash Platform

    ProgressBar 可以是水平或垂直的。

    var backgroundSkin:Image = new Image( backgroundTexture );
    backgroundSkin.width = 150;
    progress.backgroundSkin = backgroundSkin;

    var fillSkin:Image = new Image( fillTexture );
    fillSkin.width = 20;
    progress.fillSkin = fillSkin;

    上面的代码中,先设置了皮肤文件的宽度值为 150 像素,然后再把它赋给 progress 对象的 backgroundSkin 属性,这种情况下,这样做出来的进度条的初始宽度是至少150像素宽,但可以通过对 progress 的宽度值重新进行更大或更小值的设置。如果不手动设置尺寸, 进度条的尺寸会按 backgroundSkin 自动计算出来。

    对于 fillSkin 属性,我们希望它的宽度最小不要小于 20 像素,比如说是一个圆角矩形,如果小于 10 像素会产生重叠或扭曲,为了避免这种情况出现,我们对 fillSkin 设置宽度为 20 就相当于告知 progress 进度条的最小值对应的就是 20 像素。比如进度条的最小值是 0,那么 20 像素宽度对应的就是 0 值;而当进度条的值到达 100 时,对应的宽度就是 150 像素。

    padding 属性可以设置填充部份与轨道边沿的距离。

    Jan

    18

    SimpleScrollBar ScrollBar,它们之间并没有继承关系,但使用方式和功能类似,意图都是为了滚动容器类或列表类滚动时有一个视觉效果(甚至交互效果)。

    SimpleScrollBar 一般用于移动开发,是沿着一个不可交互、不可见的轨道滑动的;

    ScrollBar 一般用于桌面开发,是带有可见的轨道、可拖动的滑块等。它们都可以放在滚动容器的外部,minimum、maximum、step 、value等属性都可以正常工作(就好像一个 Slider 组件被绑定到了滚动)。

    Slider 组件跟 ScrollBar 基本类似(就好像一个脱离了滚动容器的滚动条)。

    Jan

    18

    Feathers3 WebView 一些备注

    • 0 Comments
    • Flash Platform

    WebView  是 flash.media.StageWebView 的包装类,它的主要功能是将对象的坐标都转换成了本地坐标,不再需要手动去计算坐标了(坐标与尺寸使用的都是像素值,不是屏幕的物理点数)。

    Jan

    18

    Feathers3 Label 一些备注

    • 0 Comments
    • Flash Platform

    Label 可以通过 wordWrap 属性决定是否可换行的、还能有背景纹理之类的、还内置了 padding 样式属性设置。

    默认情况下,Label 通过全局的 FeathersControl.defaultTextRendererFactory() 静态方法创建文本,如果想要一个指定的文本渲染,类似这样:

    label.textRendererFactory = function():ITextRenderer
    {
        return new TextBlockTextRenderer();
    };

    只要 textRendererFactory 属性不为 null,它就会取代 FeathersControl.defaultTextRendererFactory() 静态方法。fontStyles 会对不同的文本引擎一起工作。

    Jan

    18

    Feathers3 TabBar 一些备注

    • 0 Comments
    • Flash Platform

    TabBar 是一组水平或垂直布局的开关按钮组,一次只能选项一个(类似 Flex 中的 LinkBar)。侦听按钮切换 Event.CHANGE 事件:

    tabs.addEventListener( Event.CHANGE, tabs_changeHandler );

    direction 属性决定排列的方向。

    gap 属性决定每个按钮之间的间隙的距离。

    firstGap 和 lastGap 属性分别决定第一个和最后一个间隙的距离。

    distributeTabSizes 属性决定按钮组是否使用一个方向上的全部尺寸。

    Jan

    18

    Feathers3 Header 一些备注

    • 0 Comments
    • Flash Platform

    Header 提供了左中右分组的意图:

    centerItems : Vector.<DisplayObject>
    leftItems : Vector.<DisplayObject>
    rightItems : Vector.<DisplayObject>

    Jan

    18

    Scroller  它通常不会被实例化使用,它更像是一个抽象类(在 Feathers 中实例化它是会报错的),表示提供一个视图区域(view port),允许水平或垂直滚动,通常作为其它可滚动容器的超类(一般是 Scroll 开头的组件,但不包括 ScrollText)。它没有被作为一个推荐的 featerhs 组件放在帮助页面内进行介绍(至少现在没有)。

    ScrollContainer,这个是我们一般情况下通用的滚动容器。它有一些原生的布局功能,如 padding。

    当我们使用 layout 属性对内容子对象进行布局的时候也有 padding,但它们是指子对象的内容里面的;而 ScrollContainer 原生的布局功能的 padding 是指子对象的内容外面的部份(离容器的边缘部份)。

    interactionMode 属性决定根据用户交互模式所作的优化:

    ScrollInteractionMode.TOUCH//为移动开发优化,任意拖动,滚动条变的不能交互
    ScrollInteractionMode.MOUSE//为桌面开发优化,可以使用类似鼠标中键滚动
    ScrollInteractionMode.TOUCH_AND_SCROLL_BARS//既能拖动内容也能拖动滚动条

    scrollBarDisplayMode 属性决定滚动条的显示模式。

    horizontalScrollPolicy verticalScrollPolicy 决定滚动模式。

    snapToPages 决定滚动时是否按“整页”停止并显示、或任意像素可停止并显示。

    一般 ScrollContainer 用于子对象比较少的情况下,如果有大量的子对象,并能使用带有虚拟化布局的列表类组件,那么就推荐使用列表类组件。

    Panel 进一步扩展了 ScrollContainer 类,包含了一个  header 与 一个可选的 footer(用它可以很方便的创建对话框窗口)。

    默认情况下,Panel 的 header 是一个 Header 类的实例,但它也可以是任何 Feathers 组件。唯一的限制是被定义成 header 的部件必须是在 Panel 的顶部,并且占满宽度。比如换成一个按钮作为头部:

    panel.headerFactory = function():Button
    {
        var button:Button = new Button();
        button.addEventListener( Event.TRIGGERED, panelHeaderButton_triggeredHandler );
        return button;
    }
    //同时也需要修改 headerTitleField 为按钮对应的 label,这样就可以动态的给 panel 修改 title 标题了
    panel.headerTitleField = "label";

    默认情况下,Panel 没有 footer 对象,可以是任何 Feathers 组件。唯一的限制是被定义成 footer 的部件必须是在 Panel 的底部,并且占满宽度,如下代码:

    panel.footerFactory = function():LayoutGroup
    {
        var footer:LayoutGroup = new LayoutGroup();
        footer.styleNameList.add( LayoutGroup.ALTERNATE_STYLE_NAME_TOOLBAR );
        return footer;
    }

    Jan

    18

    Screen 扩展了 LayoutGroup 类,基本使用方法类似,但它提供了自动布局功能(layout 属性)。另外它提供了一些方法的用于硬件操作时的回调函数(比较方便于移动开发)。

    比如安卓设备有返回键、菜单键、搜索键等等,Screen 类为它们提供了一些对应的快速开发的回调函数。类似侦听“返回键(硬件)”按下时的使用回调函数:

    this.backButtonHandler = function():void
    {
        trace( "the back button has been pressed." );
    }

    ScrollScreen 扩展了 ScrollContainer,实现这个类的意图基本与 Screen 一样,为了方便页面导航类组件的使用,多了“滚动”相关的功能。

    PanelScreen 扩展了 Panel,实现这个类的意图基本与 Screen 一样,为了方便页面导航类组件的使用,多了“滚动”相关的功能。

    这三个组件涉及其它一些与导航页面有关的资料《Feathers3 ScreenNavigator & StackScreenNavigator 一些备注