Adobe Flex: прокручиваемые окна

Question

Если поле динамического размера (то есть width100%) недостаточно велико для того, чтобы в нем содержалось, как сделать так, чтобы этот блок кодировался с возможностью прокрутки, вместо того, чтобы передавать эту ответственность на родителя. Я только хочу, чтобы коробка стала настолько большой, насколько есть место для нее.

т.е. в следующем примере, если вы измените размер окна вашего браузера так, чтобы текстовые поля не умещались (по высоте), как мне заставить box1 отображать полосы прокрутки, а не все приложение?

<?xml version="1.0"?>
<mx:Application
    xmlns:mx="http://www.adobe.com/2006/mxml" width="100%" height="100%">

    <mx:HDividedBox width="100%" height="100%">

        <mx:VBox id="box1" backgroundColor="green" height="100%" verticalScrollPolicy="on" clipContent="true">


            <mx:TextInput width="200"/>

            <mx:TextInput width="200"/>

            <mx:TextInput width="200"/>

            <mx:TextInput width="200"/>

            <mx:TextInput width="200"/>

            <mx:TextInput width="200"/>

        </mx:VBox>

        <mx:Box backgroundColor="red" width="100%" height="100%">

        </mx:Box>

    </mx:HDividedBox>

</mx:Application>

Я пробовал с автоматическим включением verticalScrollbarPolicy, но это не сработало.

Answer 1

Таким образом, вам нужно обернуть vbox в холст и установить vbox, чтобы относительная высота его содержимого (не устанавливая свойство height). По какой-то причине это должен быть холст, а не другая производная от Box. Таким образом вы получите эффект, которого пытаетесь достичь.

<mx:Application
    xmlns:mx="http://www.adobe.com/2006/mxml" width="100%" height="100%" verticalScrollPolicy="off">

   <mx:HDividedBox width="100%" height="100%">

        <mx:Canvas id="box1" backgroundColor="green" height="100%" >

            <mx:VBox >
                <mx:Button width="200" />

                <mx:Button width="200"/>

                <mx:Button width="200"/>

                <mx:Button width="200"/>

                <mx:Button width="200"/>

                <mx:Button width="200"/>
            </mx:VBox>

        </mx:Canvas>

        <mx:Box backgroundColor="red" width="100%" height="100%" />
    </mx:HDividedBox>

</mx:Application>

Постараюсь найти причину, по которой это должен быть холст. Я чувствую себя хорошо в моей голове, но мне трудно сформулировать. Будем надеяться, что скоро получим объяснение.

Answer 2

Полоса прокрутки не срабатывает, потому что на ней достаточно места для всех дочерних элементов. Полосы прокрутки контейнера появляются, когда его высота / ширина слишком мала для всей совокупной высоты / ширины всех его дочерних элементов. Вот краткий пример:

<mx:Application
    xmlns:mx="http://www.adobe.com/2006/mxml" width="100%" height="100%" 
        verticalScrollPolicy="off">

    <mx:HDividedBox width="100%" height="600" verticalScrollPolicy="off">


        <mx:VBox id="box1" backgroundColor="green" height="100" 
                    verticalScrollPolicy="auto" clipContent="true">


            <mx:TextInput width="100%"/>

            <mx:TextInput width="100%"/>

            <mx:TextInput width="100%"/>

            <mx:TextInput width="100%"/>

            <mx:TextInput width="100%"/>

            <mx:TextInput width="100%"/>

        </mx:VBox>

        <mx:Box backgroundColor="red" width="100%" height="100%">

        </mx:Box>

    </mx:HDividedBox>

</mx:Application>