I'm trying to resize images to fit in a canvas. Works great.
Now I also want the user to be able to zoom/resize the images using a
slider, allowing them to resize to (at least) 100%, but I can't figure
out how to set the image(s) to their original 100% size.

Here's my functions, which get called by user click.

First I switch state, to make the images visible, then I call
switchImage, that get the image url's from the repeaterItem.
Set the source of bigLeft + bigRight
Set the width of the images to half of the canvas. (the images are
pages from a magazine, left and right)

For debugging purpose I put the width into a label.

At the bottom of this post, is the HSlider "zoom" which are used by
the zoomChange function.

How could I make this work, OR, how could I make 2 buttons [Fit to
window] [Real size].

I can't figure out how to set the image back to the real size 100%.

Thanks for any help and pointers.

Mark

click="{this.currentState='spreadView'};switchImage(event.currentTarget.getRepeaterItem())"

public function switchImage(repeaterItem:Object):void {
        // Resize the Div1 Tab
        div1.width = 0;
        thumbbar.height = 0;
        // Get the sources
        bigLeft.source =  repeaterItem.images.imgHigh_left ;
        bigRight.source =  repeaterItem.images.imgHigh_right ;
                                
        // lets try to images to half of canvas size
        //bigLeft.width = (main.width / 2)-25;
        //bigRight.width = (main.width / 2)-25;
        
        leftWidth.text = String( bigLeft.width )
        
        zoom.visible=true;
                                
}

public function init():void {
        div1.width = 250;
        thumbbar.height = 120;
        zoom.visible=false;
}

public function zoomChange():void {
        var stdWidth:uint = .7; //just a value I'm guessing
        bigLeft.width=uint(stdWidth*zoom.value/100);
        bigRight.width=uint(stdWidth*zoom.value/100);
        zoomlevel.text = String( stdWidth*zoom.value/100 );
}

<mx:HSlider id="zoom"   width="300" height="50"
            minimum="10" maximum="100" value="100"
            change="zoomChange()"
            labels="['zoom : 10%','zoom : 100%']"
            styleName="myHSlider"
            allowTrackClick="true"
            liveDragging="true"
            alpha="1" tickLength="10" tickColor="#000000"
            showTrackHighlight="true" trackColors="#ff0000,#ccff33" 
            visible="false"          
            /> 

Reply via email to