AS3缩放 - 剪切文本并扭曲照片上的对角线

时间:2010-02-11 19:44:23

标签: flash actionscript-3 scaling movieclip moviecliploader

嗨我使用了一些我发现的代码,我想甚至从你们这些人的外部swf加载到背景影片剪辑的比例。除了剪辑一些文字并创建一些有趣的对角线和一些糟糕的图像质量之外,它的效果非常好。 我有一种感觉,这是在沿着线的某些地方确定尺寸的细微差别。 舞台尺寸是2560 x 1440缩小到任何尺寸,但正如我所提到的,我不认为宽屏格式的高度和宽度是完全同步的。请帮助它正在努力。

请看一下,我真的不是AS3的一员。

www.sirwin.co.uk

// perform initial size check

checkStageSize();

// register to re-check when stage size changes
stage.addEventListener( Event.RESIZE, onResize, false, 0, true );

function onResize( e:Event ) {

    checkStageSize();
}

// do the scaling here

function checkStageSize():void {

    var wid:Number = stage.stageWidth;

    var hi:Number = stage.stageHeight;

    var needToScaleDown:Boolean = (wid < 0); // or some other test

    if ( needToScaleDown ) {

        var scale:Number = wid/0;

        backgroundRectangle.scaleX = backgroundRectangle.scaleY = scale;

    } else {

        backgroundRectangle.scaleX = backgroundRectangle.scaleY = 1;
    }
}

stop();
var portRequest:URLRequest = new URLRequest("main.swf");

var portLoader:Loader = new Loader();

 portLoader.load(portRequest);
 backgroundRectangle.addChild(portLoader);

3 个答案:

答案 0 :(得分:0)

您的代码似乎有几个问题。一个是技术,另一个是基础。让我们先看看基本面

我不得不反编译你的文件,看看你的代码到底是什么样的(在这种情况下 - http://www.sirwin.co.uk/two.swf)这个文件是1.9 MB,对于包含一些照片的flash文件来说,这个文件非常大。更好的方法是将这些图像放在外部文件夹中,并根据需要动态加载它们。这有很多好处:

  • 易于更新 - 无需重新编译Flash文件
  • xml或php驱动(对于那些不喜欢使用xml的人,你甚至可以使用php生成基于目录中文件夹结构的结构)
  • 当您在代码/ oop部门获得更多冒险时,您甚至可以查看hydrotiks队列加载器类以便在zip文件夹中加载 - http://blog.hydrotik.com/2008/10/29/queueloader-rev-31-major-update-usage/
  • 您甚至可以使用flickr flash api从您的flickr帐户请求设置并动态加载(我喜欢这种方法,因为它允许您使用flickr作为各种内容管理系统)

我不确定你的技能水平,所以我们先解决技术问题。 忽略您的图像太大 - 您需要确保通过库或某些代码打开平滑。最简单但劳动密集的方法是对库中的图像加倍clikc并检查“允许平滑”是否打开。虽然有了这么大的图像,但即使打开它也可能会有些锯齿状。

第二种方法涉及编写脚本以在动画片段中更改帧时提取位图数据,删除其内容,并将平滑属性设置为true将其绘制回容器中。

至于执行此操作的代码,对于用于为每个部分生成照片数组的方法,它会有很大差异 - 但代码的核心可以在这里找到:

http://www.kaourantin.net/2005/12/dynamically-loading-bitmaps-with.html

但实际上,如果你走这条路,你也可以走9码。

换一分钱,换一磅 希望这有帮助!

答案 1 :(得分:0)

感谢Beans我会进一步研究更好的画廊方式,我想要SWF中的图像的主要原因是当我完成设计并改变任何问题,而不是我可以锁定和密码保护,所以有更少的机会盗窃图像。

然而,我对图像有了更大的改进,尽管文本上的剪辑(主要是按钮)比以往任何时候都更让我感到烦恼。

我改变的代码是:

stage.addEventListener(Event.RESIZE, resizeListener);
stage.scaleMode=StageScaleMode.SHOW_ALL;
stage.align=StageAlign.TOP_LEFT;

function resizeListener(e:Event):void {
    trace("stageWidth: " + stage.stageWidth + " stageHeight: " + stage.stageHeight);


    // do the scaling here

    var wid:Number=100/this.stage.stageWidth;
    var hi:Number=100/this.stage.stageHeight;
    this.stage.scaleX=this.stage.scaleY;
    this.stage.scaleX=this.stage.scaleY;

    this.stage.x = (100 - this.stage.width) * 0;
    this.stage.x = (100 - this.stage.height) * 0;
}

答案 2 :(得分:0)

使用.SWF打包文件并不是很理想的原因,但我没有想过安全方面。虽然当然 - 如果它在网上,它不安全......

我今天早上为你准备了一个小演示,可以在这里找到:

演示:http://www.digital.leskiwis.com/sirwin/

下载:http://www.digital.leskiwis.com/sirwin/sirwin.zip

让我解释几个特点:

  • 它使用了hydrotik的queueLoader类。它使装载和监控变得轻而易举
  • 所有资产都在已编译的SWF中。队列加载的一个重要特性是将SWF的帧绘制为位图数据(非常适合平滑)
  • 它使用调整大小事件来确保图像调整为按比例调整大小
  • swf中的所有图像都是720p大小(1024 x 720),因此您可以很好地了解大图像如何缩小(在24 - 27英寸屏幕上更大)

调整侦听器的大小:

            stage.scaleMode = StageScaleMode.NO_SCALE;      // the standard top left align, add some no scaling and throw in the event listener
            stage.align = StageAlign.TOP_LEFT;
            stage.addEventListener(Event.RESIZE, resizePhoto, false, 0, true);   

调整大小功能:(我们在加载图片时存储一次photoWidth和photoHeight变量,这样我们就不用检查每一帧了)

        function resizePhoto(e:Event){

            var targetWidth = stage.stageWidth - buffer - photo.x       
            // this gives us the target width we want the photo. we can figure out what percent the image would need to be to make this, and use that as a scale mutiplication..

            var targetHeight = stage.stageHeight - buffer - photo.y     
            // this gives us the target height we want the photo. we can figure out what percent the image would need to be to make this, and use that as a scale mutiplication..               

            //note: add in some smart sizing on this - this means the photo resize stops when it hits a height or width limit..                             
            var wMult:Number = (targetWidth / photoWidth)   
            var hMult:Number = (targetHeight / photoHeight)

            if(wMult < hMult){
                photo.width =  photoWidth * wMult   
                photo.height = photoHeight * wMult
            }else{
                photo.width =  photoWidth * hMult   
                photo.height = photoHeight * hMult
            }
        }

虽然其中一些远非最佳做法,但它有足够的改进供您使用 - 同时根据我在您的文件中看到的代码让您处于舒适区。如果你需要任何澄清只是大喊大叫。以下是完整代码 - 您可以在此处下载所有内容:http://www.digital.leskiwis.com/sirwin/sirwin.zip

享受!

package{

    import flash.ui.*;
    import flash.display.*;
    import flash.events.*;  
    import flash.text.*;
    import flash.geom.*;
    import flash.net.*; 
    import flash.utils.*;
    import flash.media.*

    import fl.controls.Button;

    import com.hydrotik.queueloader.QueueLoader;
    import com.hydrotik.queueloader.QueueLoaderEvent;
    import com.hydrotik.queueloader.QLManager;  


    public class Sirwin extends MovieClip { 

        var sec_PERSONAL:Array = ['Animals', 'Macro'];  // all of the topic sections... Note, the swf files need to match these names!          
        var sec_LENGTH:uint = 0;    // the length of the loaded array
        var sec_CUR:uint = 0;       // the length of the loaded array
        var bmp_ARRAY:Array = [];   // the container for the loaded section
        var buffer:uint = 10;       // buffer in pixels for button placement

        var _oLoader:QueueLoader = new QueueLoader();
        var photo:Sprite = new Sprite();        // holder for the photo to load into

        var nextBut:Button = new Button();      // attach the next button from the library
        var prevBut:Button = new Button();      // attach the prev button from the library

        var photoWidth:Number   // we store these as variables to improve performance, check once - not each time
        var photoHeight:Number  // we store these as variables to improve performance, check once - not each time


        public function Sirwin(){
            trace("initialising Document...");
            addEventListener(Event.ADDED_TO_STAGE, popStageVars);   // once the movie has been added to the stage, we can set up some more vars 
        }

        private function popStageVars(e:Event){
            trace("popping stage vars...")  
            removeEventListener(Event.ADDED_TO_STAGE, popStageVars);

            stage.scaleMode = StageScaleMode.NO_SCALE;      // the standard top left align, add some no scaling and throw in the event listener
            stage.align = StageAlign.TOP_LEFT;
            stage.addEventListener(Event.RESIZE, resizePhoto, false, 0, true);   

            _oLoader.addEventListener(QueueLoaderEvent.ITEM_COMPLETE, onItemComplete,false, 0, true);
            _oLoader.addEventListener(QueueLoaderEvent.ITEM_PROGRESS, onQueueProgress, false, 0, true);
            _oLoader.addEventListener(QueueLoaderEvent.QUEUE_COMPLETE, onQueueComplete,false, 0, true);                 

            photo.x = 180
            photo.y = buffer
            addChild(photo)

            setSections();
            setNav();
            toggleNav();                
        }


        function resizePhoto(e:Event){

            // set photo dimensions to match stage;
            photo.width = stage.stageWidth - buffer;
            photo.height = stage.stageHeight - buffer;

            // choose the larger scale property and match the other to it;
            ( photo.scaleX < photo.scaleY ) ? photo.scaleY = photo.scaleX : photo.scaleX = photo.scaleY;




        }


        public function setSections(){  // this function places the section buttons on the stage... not so neccesary if you make your own buttons

            for(var i:uint = 0; i < sec_PERSONAL.length; i++){  
                var but:Button = new Button();  // attach the button from the library
                but.label = sec_PERSONAL[i]     // give the button a label from the array of names
                but.x = buffer
                but.y = buffer*5 + (i * (buffer + but.height));                 
                but.addEventListener(MouseEvent.CLICK, loadSection, false, 0, true);    // weak handler for better garbage collection
                addChild(but)
            }
        }

        public function setNav(){   // this function places the nav buttons on the stage... better practice would be having their own class and dispatching mouse events to be listened for. Baby steps..
            nextBut.label = "Next >"
            nextBut.x = buffer
            nextBut.y = 350
            nextBut.addEventListener(MouseEvent.CLICK, navForward, false, 0, true);
            addChild(nextBut)               

            prevBut.label = "Previous <"
            prevBut.x = buffer
            prevBut.y = 400
            prevBut.addEventListener(MouseEvent.CLICK, navBack, false, 0, true);
            addChild(prevBut)
        }


        public function loadSection(e:MouseEvent){
            bmp_ARRAY = []; // reset the array to nothing
            var swf:String = convertFolderName(e.target.label, '_') + ".swf";   
            _oLoader.addItem("assets/"+swf, null, {title:"SWF Images", drawFrames:true});
            _oLoader.execute();                         
        }       

        public function loadPhoto(){
            while(photo.numChildren){
                    photo.removeChildAt(0);     // get rid of any existing photo
            }

            var bmp:Bitmap = new Bitmap(bmp_ARRAY[sec_CUR]);        // this gets the bitmap data from the array that has been loaded from the zip file
            bmp.smoothing = true;   // this should solve your smoothing issues
            photo.addChild(bmp);

            photoWidth = photo.width;   // update the photos height and width for easy ref              
            photoHeight = photo.height;
            resizePhoto(null);      // pass through a null event to avoid any compiler errors
        }


        public function convertFolderName(s:String, replacement:String):String{ // this function returns an underscore instead of a space                           
            var trimmedValue:String = s.replace(" ", replacement)
            return trimmedValue;
        }   


        public function updateCur(n:Number){                        
            sec_CUR += n;       // add a +1, or -1 to the current pointer
            displaying.text = "Displaying: " + (sec_CUR + 1) + "/" + sec_LENGTH;        // this updates the 'number of/how many' text. you need plus one to adjust for arrays starting at 0
        }

        public function navForward(e:MouseEvent){
            updateCur(1)
            toggleNav();
            loadPhoto();
        }

        public function navBack(e:MouseEvent){
            updateCur(-1)
            toggleNav();
            loadPhoto() 
        }


        public function toggleNav():void{   //this function decides if the next or back should be shown
            trace(sec_CUR + " - " + sec_LENGTH)
            nextBut.visible = (sec_CUR >= sec_LENGTH-1) ? false : true
            prevBut.visible = (sec_CUR <= 0) ? false : true

            if(sec_CUR < 0){
                sec_CUR = 0;    
            }

            if(sec_CUR >= sec_LENGTH-1){
                sec_CUR = sec_LENGTH-1; 
            }
        }

        // ----------------------------------------------------- queue loading event handlers


        public function onQueueProgress(event:QueueLoaderEvent):void {  // cheap preloading...
            trace("\t>>onQueueProgress: "+event.queuepercentage);
            displaying.text = "Loading: " + event.queuepercentage + "%";
        }

        public function onItemComplete(event:QueueLoaderEvent):void {
            trace("\t>> "+event.type, "item title: "+event.title + " type: " + event.fileType);
            if (event.title == "SWF Images") {
                bmp_ARRAY = [];
                for (var i:int = 0; i<event.bmArray.length; i++) {
                    var bm:BitmapData = event.bmArray[i]                
                    bmp_ARRAY.push(bm)
                }
            }
        }

        public function onQueueComplete(event:QueueLoaderEvent):void {
            trace("** "+event.type);

            sec_LENGTH = bmp_ARRAY.length
            sec_CUR = 0;

            updateCur(0)
            toggleNav();
            loadPhoto();                                            
        }               


    }       
}