Flex 4.6 TabbedViewNavigator - TabBar,显示更多项目

时间:2013-11-12 21:00:36

标签: actionscript-3 flex flex4 tabbar flex4.6

我希望我的TabBar能够显示左侧或右侧是否有更多菜单项。否则,用户可能不知道存在更多选项。像箭头一样指示更多项目,甚至是最后一个可见标签项目上的某种斜面效果,这样它就会显示更多选项在屏幕外。 这就是我的TabBar看起来像一个箭头,显示其他项目是如何被切断的: enter image description here

以下是TabBarSkin的代码:

public class ScollingTabBarSkin extends TabbedViewNavigatorTabBarSkin
{
    public var scroller:Scroller;

    /**
     *  Override createChildren() to create a Scroller and add the DataGroup
     *  as its viewport.
     */
    override protected function createChildren():void
    {
        super.createChildren();

        // use a standard HorizontalLayout instead of a specialized layout
        var tabLayout:HorizontalLayout = new HorizontalLayout();
        tabLayout.useVirtualLayout = false;
        tabLayout.gap = 0;
        tabLayout.variableColumnWidth = false;
        tabLayout.columnWidth = 400;

        dataGroup.layout = tabLayout;

        scroller = new Scroller();
        scroller.setStyle('interactionMode', InteractionMode.TOUCH);
        scroller.viewport = dataGroup;
        addChild(scroller);
    }

    /** 
     * Size and position the Scroller
     */
    override protected function layoutContents(unscaledWidth:Number, unscaledHeight:Number):void
    {
        setElementPosition(scroller, 0, 0);
        setElementSize(scroller, unscaledWidth, unscaledHeight);
    }
}

取自:http://flexponential.com/2011/10/23/enable-scrolling-in-the-tab-bar-of-a-tabbedviewnavigator/comment-page-1/#comment-78685

0 个答案:

没有答案