Changeset 88 for gssim_ui/branches


Ignore:
Timestamp:
09/15/11 13:59:42 (14 years ago)
Author:
mcichenski
Message:

scalable multiimage container&navigator

Location:
gssim_ui/branches/vine/gssimstudio/src/web/ui/flex/app/gssim/gssimstudio/editor/gssim/components
Files:
2 edited

Legend:

Unmodified
Added
Removed

  • gssim_ui/branches/vine/gssimstudio/src/web/ui/flex/app/gssim/gssimstudio/editor/gssim/components/MultiImageContainer.mxml

    r15 r88  
    2323                        } 
    2424                         
    25                         private const ZOOM_STEP : Number = 5/6; 
    26                         private const MAX_ZOOM : Number = 2; 
    27                         private const MIN_ZOOM : Number = 0.1; 
     25                        private const MAXIMUM_ZOOM_VALUE : Number = 2; 
     26                        private const MINIMUM_ZOOM_VALUE : Number = 0.1; 
    2827                         
    2928                        private function init() : void 
    3029                        { 
    31                                 //this.addEventListener(MouseEvent.MOUSE_WHEEL, mouseWheelEventHandler); 
     30                                this.addEventListener(MouseEvent.MOUSE_WHEEL, mouseWheelEventHandler); 
    3231                                var hScrollbar : HScrollBar = new HScrollBar(); 
    3332                                hScrollbar.viewport = this; 
    … …  
    3635                        } 
    3736                         
    38                         public override function get width() : Number 
     37                        public function get maximumWidth() : Number 
    3938                        { 
    4039                                var max : Number = 0; 
    … …  
    4645                        } 
    4746                         
    48                         public override function get height() : Number 
     47                        public function get maximumHeight() : Number 
    4948                        { 
    5049                                var max : Number = 0; 
    … …  
    7978                        } 
    8079                         
     80                        private function validatePosition() : void 
     81                        { 
     82                                var matrix : Matrix = this.transform.matrix; 
     83                                if (this.x != 0) 
     84                                { 
     85                                        this.x = 0;      
     86                                } 
     87                                if (this.y != 0) 
     88                                { 
     89                                        this.y = 0;      
     90                                } 
     91                                //if (this.x < -(this.width*matrix.a)+parent.width) this.x = -(this.width*matrix.a)+parent.width; 
     92                                //if (this.y < -(this.height*matrix.d)+parent.height) this.y = -(this.height*matrix.d)+parent.height; 
     93                                //dispatchEvent(new Event(CANVAS_MOVED)); 
     94                        } 
     95                         
     96                        private function mouseWheelEventHandler(event : MouseEvent) : void 
     97                        { 
     98                                zoom(event.delta, event.stageX, event.stageY); 
     99                        } 
     100                         
     101                        public function zoom(delta : Number, stageX : Number, stageY : Number) : void 
     102                        { 
     103                                var matrix : Matrix = this.transform.matrix; 
     104                                var sign : Number = 1; 
     105                                if (delta > 0) sign = 6/5; 
     106                                if (delta < 0) sign = 5/6; 
     107                                if (matrix.a * sign < MINIMUM_ZOOM_VALUE) return; 
     108                                if (matrix.a * sign > MAXIMUM_ZOOM_VALUE) return; 
     109                                this.applyZoom(sign, stageX, stageY); 
     110                                this.validatePosition(); 
     111                        } 
     112                         
     113                        public function applyZoom(value : Number, pos_x : Number, pos_y : Number) : void 
     114                        { 
     115                                var matrix : Matrix = this.transform.matrix; 
     116                                matrix.translate(-pos_x, -pos_y); 
     117                                matrix.scale(value, value); 
     118                                matrix.translate(pos_x, pos_y); 
     119                                this.transform.matrix = matrix; 
     120                                dispatchEvent(new Event("scaled")); 
     121                        } 
     122                         
    81123                ]]> 
    82124        </fx:Script> 

  • gssim_ui/branches/vine/gssimstudio/src/web/ui/flex/app/gssim/gssimstudio/editor/gssim/components/MultiImageNavigator.mxml

    r15 r88  
    2626                        { 
    2727                                _container = container; 
     28                                _container.addEventListener("scaled", scaleChanged); 
    2829                                updateDisplay(); 
    2930                                addEventListeners(); 
    … …  
    7677                        private function updateContainerPosition() : void 
    7778                        { 
    78                                 _container.scroll(((visibleRectangleGroup.x) / (this.width - visibleRectangleGroup.width)) * (_container.width - _container.parent.width) 
    79                                         ,((visibleRectangleGroup.y) / (this.height - visibleRectangleGroup.height)) * (_container.height - _container.parent.height)); 
     79                                var matrix : Matrix = _container.transform.matrix; 
     80                                _container.scroll(((visibleRectangleGroup.x) / (this.width - visibleRectangleGroup.width)) * (matrix.a * _container.width - _container.parent.width) 
     81                                        ,((visibleRectangleGroup.y) / (this.height - visibleRectangleGroup.height)) * (matrix.d * _container.height - _container.parent.height)); 
    8082                        } 
    8183                         
    8284                        private function updateDisplay() : void 
    8385                        { 
    84                                 var ratio : Number = _container.width / _container.height; 
     86                                var ratio : Number = _container.maximumWidth / _container.maximumHeight; 
    8587                                if (ratio < 1) 
    8688                                        this.width = this.height * ratio; 
    8789                                else 
    8890                                        this.height = this.width / ratio; 
    89                                 var xScale : Number = _container.width / this.width; 
    90                                 var yScale : Number = _container.height / this.height; 
     91                                var xScale : Number = _container.maximumWidth / this.width; 
     92                                var yScale : Number = _container.maximumHeight / this.height; 
    9193                                for each (var img : Image in _container.gallery) 
    9294                                { 
    … …  
    99101                                        this.addElement(temp); 
    100102                                } 
    101                                 rectangle.width = this.width *  _container.parent.width / _container.width; 
    102                                 rectangle.height = this.height * _container.parent.height / _container.height; 
     103                                rectangle.width = this.width *  _container.parent.width / _container.maximumWidth; 
     104                                rectangle.height = this.height * _container.parent.height / _container.maximumHeight; 
    103105                                this.setElementIndex(visibleRectangleGroup, _container.gallery.length); 
    104106                        } 
    … …  
    113115                        { 
    114116                                var tmp : Container = _container.parent as Container; 
    115                                 visibleRectangleGroup.x = tmp.horizontalScrollPosition * (this.width - visibleRectangleGroup.width) / (_container.width - _container.parent.width); 
    116                                 visibleRectangleGroup.y = tmp.verticalScrollPosition * (this.height - visibleRectangleGroup.height) / (_container.height - _container.parent.height); 
     117                                var matrix : Matrix = _container.transform.matrix; 
     118                                visibleRectangleGroup.x = tmp.horizontalScrollPosition * (this.width - visibleRectangleGroup.width) / (matrix.a * _container.width - _container.parent.width); 
     119                                visibleRectangleGroup.y = tmp.verticalScrollPosition * (this.height - visibleRectangleGroup.height) / (matrix.d * _container.height - _container.parent.height); 
     120                        } 
     121                         
     122                        /** 
     123                         * Handle canvas size change 
     124                         */ 
     125                        public function scaleChanged(event : Event) : void 
     126                        { 
     127                                var matrix : Matrix = _container.transform.matrix; 
     128                                var numberOfScreensHorizontal : Number= (_container.width * matrix.a) / _container.parent.width; 
     129                                var numberOfScreensVertical : Number = (_container.height * matrix.d) / _container.parent.height; 
     130                                var currentMaxWidth : Number = _container.width * matrix.a; 
     131                                var currentMaxHeight : Number = _container.height * matrix.d; 
     132                                rectangle.width = this.width/numberOfScreensHorizontal; 
     133                                rectangle.height = this.height/numberOfScreensVertical; 
    117134                        } 
    118135                         
Note: See TracChangeset for help on using the changeset viewer.