Apache flex 如何让剪辑内容在mx TabNavigator上工作？

我有一个TabNavigator，在此之前还有一个带有TabBar的ViewStack，它不会剪辑它的内容。它在边框上方流动，或显示在屏幕下方的其他组件下方。以前有人碰到过这个吗

这是我的密码：

<mx:VDividedBox width="300" height="100%">
    <mx:TabNavigator id="firstViewStack" 
                borderStyle="solid" 
                width="100%"
                height="100%"
                clipContent="true">


        <s:NavigatorContent id="content1" 
                                    label="ITEMS">
            <views:Items height="550" width="100%" />
        </s:NavigatorContent>


        <s:NavigatorContent id="eventsContent" label="ITEMS 2">
            <views:Items height="880" width="100%"/>
        </s:NavigatorContent>
    </mx:TabNavigator>
</mx:VDividedBox>

更新
我已经包括了我调整选项卡内容大小的动画gif。如您所见，遮罩的大小似乎与内容有关，而不是与可用区域有关？？？请注意，调整大小时，选项卡导航器沿大小的边框重叠

我将所有内容的最小高度设置为较低的值，并将所有内容的高度设置为100%，因此它没有那么高，但您可以看到内容仍然没有被剪裁

我还尝试使用VGroup而不是vDivideBox，这并不重要

下面是另一个代码示例：

<s:VGroup top="50" left="50" width="400">
    <mx:TabNavigator width="100%" height="300">
        <s:NavigatorContent label="TAB">
            <s:Group width="100%" height="400">
                <s:Rect width="100%" height="100%">
                    <s:fill>
                        <s:SolidColor color="#ff0000"/>
                    </s:fill>
                </s:Rect>
            </s:Group>
        </s:NavigatorContent>
        <s:NavigatorContent label="TAB">
            <s:Group width="100%" height="400">
                <s:Rect width="100%" height="100%">
                    <s:fill>
                        <s:SolidColor color="#0000ff"/>
                    </s:fill>
                </s:Rect>
            </s:Group>
        </s:NavigatorContent>
    </mx:TabNavigator>
    <s:Button width="100%" label="HELLO WORLD"/>
    <s:Button width="100%" label="HELLO WORLD"/>
</s:VGroup>

---

我已经实现了两种方法——一种是滚动条，另一种是自动调整大小

这是一个

代码如下：

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
           xmlns:s="library://ns.adobe.com/flex/spark" 
           xmlns:mx="library://ns.adobe.com/flex/mx" 
           minWidth="955" minHeight="600">

    <s:HGroup width="100%" height="100%" left="50" top="50">

        <!-- Using Scroller-->
        <s:VGroup width="400">

            <mx:TabNavigator width="100%" height="300">
                <s:NavigatorContent label="TAB" width="100%" height="100%">

                    <s:Scroller width="100%" height="100%">
                        <s:Group>
                            <s:Group width="100%" height="400">
                                <s:Rect width="100%" height="100%">
                                    <s:fill>
                                        <s:SolidColor color="#ff0000"/>
                                    </s:fill>
                                </s:Rect>
                            </s:Group>
                        </s:Group>  
                    </s:Scroller>

                </s:NavigatorContent>
                <s:NavigatorContent label="TAB" width="100%" height="100%">

                    <s:Scroller width="100%" height="100%">
                        <s:Group>
                            <s:Group width="100%" height="600">
                                <s:Rect width="100%" height="100%">
                                    <s:fill>
                                        <s:SolidColor color="#0000ff"/>
                                    </s:fill>
                                </s:Rect>
                            </s:Group>
                        </s:Group>  
                    </s:Scroller>
                </s:NavigatorContent>
            </mx:TabNavigator>

            <s:Button width="100%" label="HELLO WORLD"/>
            <s:Button width="100%" label="HELLO WORLD"/>
        </s:VGroup>

        <s:Spacer width="60"/>
        <!-- Using Autosize-->

        <s:VGroup top="50" left="50" width="400">

            <mx:TabNavigator width="100%" minHeight="300" resizeToContent="true" >
                <s:NavigatorContent label="TAB" width="100%" height="100%">

                    <s:Group width="100%" height="400">
                        <s:Rect width="100%" height="100%">
                            <s:fill>
                                <s:SolidColor color="#ff0000"/>
                            </s:fill>
                        </s:Rect>
                    </s:Group>

                </s:NavigatorContent>
                <s:NavigatorContent label="TAB" width="100%" height="100%">

                    <s:Group width="100%" height="500">
                        <s:Rect width="100%" height="100%">
                            <s:fill>
                                <s:SolidColor color="#0000ff"/>
                            </s:fill>
                        </s:Rect>
                    </s:Group>

                </s:NavigatorContent>
            </mx:TabNavigator>

            <s:Button width="100%" label="HELLO WORLD"/>
            <s:Button width="100%" label="HELLO WORLD"/>
        </s:VGroup>

    </s:HGroup>

</s:Application>

能否显示此问题的屏幕截图？应该做什么还不够清楚。我添加了一些截图。请注意，左图中的内容没有被剪裁，右栏中是。我在它周围有一个VDividedBox。我更新了代码。有时，如果我将底部选项卡向上拉，内容将被剪裁，如右图所示。但是如果内容很长，它可能仍然会出现在页面底部标签组的下方。我将所有内容的最小高度设置为低值，将所有内容的高度设置为100%，因此它没有那么高，但您可以看到内容仍然没有被剪裁。您能提供多一点代码吗？我试着用我来重建你的处境，但它看起来是另一种方式。我想看看所有的基本容器。目前，您的代码只包含VDividedBox的一个子项。ThanksNote：在一些选项卡中，我将最小高度设置为400，但没有设置高度。除非我把高度设置为100%，否则滚动条不会一直剪辑这些内容。我会检查一下，然后给你我的答案。谢谢