Проблема с прокруткой

Question

Я скинул полосу прокрутки в своем приложении flex и получил одну проблему. Этот белый квадрат между полосами прокрутки (просмотреть изображение) разрушает весь мой дизайн, и мне нужно его отключить, сделать его невидимым, изменить цвет фона, альфа или что-то вроде этого.

Я могу вставить сюда код, но я думаю, что в этом нет необходимости. Работа во Flex 3. есть идеи?

альтернативный текст http://img97.imageshack.us/img97/9206/scrollbar.png

Answer 1

Я на самом деле нашел виновника, заглядывающего внутрь платформы Flex. Этот квадрат (называемый whiteBox) создается в Container.as.

От него довольно легко избавиться, вам просто нужно создать класс, расширяющий контейнер, который вы хотите использовать.

Пример для холста:

package
{
    import mx.containers.Canvas;

    public class NoWhiteBoxCanvas extends Canvas
    {

        public function NoWhiteBoxCanvas()
        {
            super();
        }

        override public function validateDisplayList():void
        {
            super.validateDisplayList();
            this.whiteBox.visible = false;
        }

    }
}

Тогда в вашем MXML:

<local:NoWhiteBoxCanvas width="300" height="300" horizontalScrollPolicy="on" verticalScrollPolicy="on"/>

... а потом уже нет белого квадрата;)

Answer 2

У вас уже есть хороший ответ, но другой альтернативой является ручное управление полосами прокрутки. Вы можете поместить полосу прокрутки в любом месте вашего приложения и связать ее, чтобы прокрутить нужный элемент управления. Делая это, вы можете эффективно получить вертикальную полосу прокрутки, чтобы растянуть эти дополнительные 16 пикселей, чтобы покрыть whitebox. Обратите внимание, что я сделал бы это, только если было гарантировано, что всегда нужна полоса прокрутки. В конечном итоге это выглядело бы как мой действительно плохой рисунок текста здесь:

          |  |
          |  |
__________|__|
_______| >|\/|

Answer 3

Один подвох - использовать маску, чтобы скрыть этот квадрат. Примерно так:

<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="creationComplete()">

    <mx:Script>
        <![CDATA[
            import mx.core.UIComponent;

            public function creationComplete():void
            {
                var compMask:UIComponent = new UIComponent;
                compMask.graphics.beginFill( 0xff0000 );
                compMask.graphics.drawRect( 0, 0, comp.width, comp.height - 16 );
                compMask.graphics.drawRect( 0, comp.height - 16, comp.width - 16, 16 );
                compMask.graphics.endFill();
                addChild( compMask );
                comp.mask = compMask;
            }
        ]]>
    </mx:Script>

    <mx:Canvas id="comp" width="300" height="300" horizontalScrollPolicy="on" verticalScrollPolicy="on"/>

</mx:WindowedApplication>

Только что попробовал, все работает. Вам просто нужно будет перерисовывать маску каждый раз, когда размер компонента изменяется. Лучше всего было бы создать собственный класс, который расширяет Canvas, и выполнять всю работу.

РЕДАКТИРОВАТЬ: Конечно, вы хотите изменить "16" на вес ваших пользовательских полос прокрутки, если значение отличается.

Answer 4

Вы пробовали установить

background-alpha: 0.0;

на контейнере, который получает полосы прокрутки? Затем прямоугольник контейнера должен подобрать цвет родительского элемента.