Как добавить полосы прокрутки в UIComponent в Flex

Question

У меня есть следующая ситуация.

<mx:Canvas id="canvas" height="100%" width="100%"> 
<mx:UIComponent id="chart" width="100%" height="100%"/> 
</mx:Canvas> 

Теперь есть один SVGDocument компонент, который будет добавлен в качестве ребенка к выше UIComponent. Это в основном svg-образ. Для этого я реализовал функцию масштабирования. Таким образом, при прокрутке мыши и прокрутке мыши вниз элемент SVGDocument становится увеличенным и уменьшенным соответственно. Я хочу добавить полосы прокрутки в диаграмму UIComponent, чтобы всякий раз, когда SVGDocument становится достаточно большим, появятся полосы прокрутки. В настоящее время я не могу найти способ добавить это. Может кто-нибудь предложить?

Answer 1

Вы должны использовать компоненты Scroller и Group (для искры) или какие-то Box для mx, если вы не хотите управлять полосами прокрутки вручную. Не забудьте ограничить Scroller или Box размер, чтобы запретить им расширение за пределами их родительских границ. Если вы хотите иметь пользовательское поведение прокрутки, вы можете вручную установить Group 's clipAndEnableScrolling собственности для true и иметь дело с его viewport собственности.

Answer 2

Вам необходимо поместить UIComponent в (0,0) на Canvas и размер Canvas в соответствии с шириной и высотой изображения SVG. Оберните Canvas в Box, и при необходимости вы будете иметь полосы прокрутки. Это размер Canvas, который показывает Box или скрывает полосы прокрутки.

<mx:Box width="100%" height="100%"> 
    <mx:Canvas id="canvas"><!-- set width & height to match SVG image --> 
    <mx:UIComponent id="chart" x="0" y="0"/> 
    </mx:Canvas> 
</mx:Box>