代码之家  ›  专栏  ›  技术社区  ›  Partack

操作脚本3:动态添加movieclips约束到容器

  •  3
  • Partack  · 技术社区  · 14 年前

    上次编辑:已解决!

    嗯,我在这里找不到完整的答案,但我终于找到了我想要的。非常感谢您的帮助和耐心。

    另一方面,我想我可能在使用int和number类型时遇到了问题,在仔细检查我的解决方案后,我意识到使用的是数字而不是int。结果发现数字包含浮点,int不包含。每当我尝试修复此问题时,我的数字可能是四舍五入的。据我所知,TDI的答案可能是正确的,使用int填充可能会累积整数。哦,好吧,你每天都会学到一些东西……

    以我所寻找的方式将电影剪辑约束到容器电影剪辑(或sprite或其他)的正确代码是:

    var piccontainer:piccontainer=new piccontainer();
    piccontainer.x=stage.stage width/2-piccontainer.width/2;
    piccontainer.y=stage.stage height/2-piccontainer.height/2;
    addchild(piccontainer);
    
    var totalpics:int=17;
    
    var pic:pic=new pic();//创建一个实例以获取其宽度
    
    var xrange:number=piccontainer.width-pic.width;
    
    //稍微优化一下:只需要计算一次这个数字:
    var yloc:数字=piccontainer.height/2-pic.height/2;
    
    对于(var i:int=0;i<totalpics;i++){
    pic=新pic();
    pic.x=i*间距;
    Y= YLC;
    picContainer.addChild(图片);
    }
    < /代码> 
    
    

    逻辑很简单,我不知道为什么我自己不能得到它,因为我画了一些图表,正好说明这个逻辑。但是,我一定没有把数字放在正确的地方,否则我就不必问了,是吗;p

    奖励内容!< /强> 作为额外的奖励(如果有人发现这个线程正在寻找答案…) 您也可以使用以下代码将“pic”的风扇从中心点移出(但它们仍然按从左到右的顺序排列):。

    var piccontainer:piccontainer=new piccontainer();
    piccontainer.x=stage.stage width/2-piccontainer.width/2;
    piccontainer.y=stage.stage height/2-piccontainer.height/2;
    addchild(piccontainer);
    
    var totalpics:int=5;
    
    var pic:pic=new pic();//创建一个实例以获取其宽度
    
    var padding:number=(piccontainer.width-(pic.width*totalpics))/(totalpics+1);
    
    对于(var i:int=0;i<totalpics;i++){
    pic=新pic();
    pic.x=填充+i*(pic.width+填充);
    pic.y=piccontainer.height/2-pic.height/2;
    picContainer.addChild(图片);
    }
    < /代码> 
    
    

    试试看,这些是很好的缩略图码头引擎!

    第一次编辑:好吧,由于TDI,有一些进展,但不是一个完整的解决方案。

    你看,问题仍然是电影剪辑没有完全挤压到容器中,最后一个或两个都留在外面。

    示例:
    < /代码> 
    
    

    我修改的代码如下:

    var new piccontainer:piccontainer=new piccontainer();
    VaR NePICIC:PIC;
    
    var picwidth:int=100;
    var amountofpics:int=22;
    var i:int;
    
    //添加容器
    addchild(newpiccontainer);
    
    //将容器居中
    newpiccontainer.x=(stage.stagewidth/2)-(newpiccontainer.width/2);
    newpiccontainer.y=(stage.stageheight/2)-(newpiccontainer.height/2);
    
    var totalpicwidth:int=picwidth*amountofpics;
    
    var totalpadding:int=newpicContainer.width-totalpicwidth;
    
    var paddingbetween:int=(totalpadding/amountofpics);
    
    对于(i=0;i<amountofpics;++i)
    {
    //生成一个名为newpic(和i的值)的新mc,例如newpic1
    此['newpic'+i]=new pic();
    此['newpic'+i].宽度=picWidth;
    
    //将我们的图片添加到容器中
    newpiccontainer.addchild(此['newpic'+i]);
    
    //设置新的pics x
    如果(我)!= 0)
    {
    //如果i不是0,则将newpic(i)s x设置为上一张pic加上上上上一张pics的宽度,并添加动态填充
    此['newpic'+i].x=此['newpic'+(i-1)].x+picWidth+paddingBetween;
    }
    其他的
    {
    此['newpic'+i].x=0;
    }
    }
    < /代码> 
    
    

    再次感谢任何人!

    原始帖子:

    你好,第一次在这里发帖。我希望我没有做错什么。我的问题是:

    我有一个非常基本的for循环,它创建了一个“缩略图”,并将其放在包含电影剪辑的前一个(有一点填充)旁边。

    var new piccontainer:piccontainer=new piccontainer();
    VaR NePICIC:PIC;
    var金额:int=9;
    var i:int;
    
    //添加容器
    addchild(newpiccontainer);
    
    //将容器居中
    newpiccontainer.x=(stage.stagewidth/2)-(newpiccontainer.width/2);
    newpiccontainer.y=(stage.stageheight/2)-(newpiccontainer.height/2);
    
    
    对于(i=0;i<amount;+i)
    {
    new pic=新pic();
    newpicContainer.addChild(newpic);
    
    //只是为了让我知道它在添加它们……
    跟踪(newpic.thisone);
    newpic.thisone=i;
    
    //将此值设置为其自身(+5表示padding..)次,即已放置的量。
    newpic.x=(newpic.width+5)*i;
    }
    < /代码> 
    
    

    我想知道是否有一些公式或“神奇的数学”,我可以用来计算容器的长度,并让“缩略图”相对于这个数字被添加。基本上是相互挤压缩略图,使它们都适合内部。

    以下几行的内容:

    newpic.x=(newpic.width*i)-这里的东西使它知道不要超过包含宽度;
    < /代码> 
    
    

    我必须承认我数学不太好,所以这部分编码让我很难理解。

    感谢任何提前接受者..

    作为旁注:我想我可能在使用int和number类型时遇到了问题,在仔细检查我的解决方案后,我意识到使用的是数字而不是int。结果发现数字包含浮点,而int不包含浮点。每当我试图解决这个问题时,我的数字可能是四舍五入的。据我所知,TDI的答案可能是正确的,使用int填充可能会累积整数。哦,好吧,你每天都学到些东西……

    按照我所寻找的方式,将电影剪辑约束到容器电影剪辑(或sprite或其他)的正确代码是:

    var picContainer:PicContainer = new PicContainer();
    picContainer.x = stage.stageWidth / 2 - picContainer.width / 2;
    picContainer.y = stage.stageHeight / 2 - picContainer.height / 2;
    addChild(picContainer);
    
    var totalPics:int = 17;
    
    var pic:Pic = new Pic(); //make an instance just to get its width
    
    var xRange:Number = picContainer.width - pic.width;
    var spacing:Number = xRange / (totalPics - 1);
    
    //A little optimization: only need to calculate this number ONCE:
    var yLoc:Number = picContainer.height / 2 - pic.height / 2;
    
    for(var i:int = 0; i < totalPics; i++) {
        pic = new Pic();
        pic.x = i * spacing;
        pic.y = yLoc;
        picContainer.addChild(pic);
    }
    

    逻辑很简单,我不知道为什么我自己不能得到它,因为我画了一些图表,正好说明这个逻辑。但是,我一定没有把数字放在正确的地方,否则我就不必问了,是吗;p

    奖金内容! 作为额外的奖励(如果有人发现这个线程正在寻找答案…) 您也可以使用以下代码将“pic”的风扇从中心点移出(但它们仍然按从左到右的顺序排列):

    var picContainer:PicContainer = new PicContainer();
    picContainer.x = stage.stageWidth / 2 - picContainer.width / 2;
    picContainer.y = stage.stageHeight / 2 - picContainer.height / 2;
    addChild(picContainer);
    
    var totalPics:int = 5;
    
    var pic:Pic = new Pic(); //make an instance just to get its width
    
    var padding:Number = (picContainer.width - (pic.width * totalPics))  / (totalPics + 1);
    
    for(var i:int = 0; i < totalPics; i++) {
        pic = new Pic();
        pic.x = padding + i * (pic.width + padding);
        pic.y = picContainer.height / 2 - pic.height / 2;
        picContainer.addChild(pic);
    }
    

    试试看,这些是很好的缩略图码头引擎!

    第一次编辑:好吧,有一些进展,多亏了TDI,但不是一个完整的解决方案。

    你看,问题仍然是电影剪辑没有完全挤压到容器中,最后一个或两个是留下来突出。

    example:
    

    alt text

    我修改的代码如下:

    var newPicContainer:picContainer = new picContainer();
    var newPic:pic;
    
    var picwidth:int = 100;
    var amountofpics:int = 22;
    var i:int;
    
    //add a container
    addChild(newPicContainer);
    
    //center our container
    newPicContainer.x = (stage.stageWidth/2)- (newPicContainer.width/2);
    newPicContainer.y = (stage.stageHeight/2)- (newPicContainer.height/2);
    
    var totalpicwidth:int = picwidth*amountofpics;
    
    var totalpadding:int = newPicContainer.width - totalpicwidth;
    
    var paddingbetween:int = (totalpadding / amountofpics);
    
    for (i = 0; i < amountofpics; ++i)
    {
        //make a new mc called newPic(and i's value)  eg. newPic1
        this['newPic' + i] = new pic();
        this['newPic' + i].width = picwidth;
    
        //add our pic to the container
        newPicContainer.addChild(this['newPic' + i]);
    
        //set the new pics X
        if (i != 0)
        {
            // if i is not 0, set newpic(i)s x to the previous pic plus the previous pics width and add our dynamic padding 
            this['newPic' + i].x = this['newPic' + (i-1)].x + picwidth + paddingbetween;
        }
        else
        {
            this['newPic' + i].x = 0;
        }
    }
    

    再次感谢任何人!

    原始职位:

    你好,第一次在这里发帖。我希望我没有做错什么。我的问题是:

    我有一个非常基本的for循环,它创建了一个“缩略图”,并将其放在包含电影剪辑的前一个(有一点填充)旁边。

    var newPicContainer:picContainer = new picContainer();
    var newPic:pic;
    var amount:int = 9;
    var i:int;
    
    //Add our container
    addChild(newPicContainer);
    
    //center our container
    newPicContainer.x = (stage.stageWidth/2)- (newPicContainer.width/2);
    newPicContainer.y = (stage.stageHeight/2)- (newPicContainer.height/2);
    
    
    for (i = 0; i < amount; ++i)
    {
     newPic = new pic();
     newPicContainer.addChild(newPic);
    
        //just so i know it's adding them..
        trace(newPic.thisOne);
     newPic.thisOne = i;
    
        // set this one to its self (+5 for padding..) Times, the amount already placed. 
     newPic.x = (newPic.width+5) *i;
    }
    

    我想知道是否有一些公式或“神奇的数学”,我可以用来计算容器的长度,并让“缩略图”相对于这个数字被添加。基本上是相互挤压缩略图,使它们都适合内部。

    沿着这条线的东西:

    newPic.x = (newPic.width *i) - stuff here to make it know not to go past the containing width;
    

    我必须承认我数学不太好,所以这部分编码让我很难理解。

    感谢任何提前接受者。

    3 回复  |  直到 8 年前
        1
  •  2
  •   Chunky Chunk    14 年前

    您可以通过显式调用容器的width属性来获取容器的长度:

    //Container Width    
    newPicContainer.width;
    

    或者NewContainer也是添加图片的父项:

    //Container Width    
    newPic.parent.width;
    

    然后,您需要获取图片占用的总长度:

    var arrayOfPics:array = [pic1, pic2, pic3, pic4, pic5];
    var picsWidth:Number;
    
    for each (var element:pic in arrayOfPics)
             picsWidth =+ element.width;
    

    之后,您可以从容器中减去总图片的长度,以了解可用的分隔填充:

    var totalPadding:Number = newPicContainer.width - picsWidth;
    

    现在,您可以通过将totalpadding除以pics的数目来确定在pics和容器两侧之间可以承受的填充量,并为结尾添加额外的填充。

    var padding:Number = totalPadding / arrayOfPics.length + 1;
    

    现在您只需添加图片,包括填充

    for (var i:int = 0; i < arrayOfPics.length; i++)
        {
        newPicContainer.addChild(arrayOfPics[i]);
        (i == 0) ? arrayOfPics[i].x = padding : arrayOfPics[i].x = arrayOfPics[i - 1].x + arrayOfPics[i - 1].width + padding;
        }
    
        2
  •  1
  •   PatrickS    14 年前

    试试这个…

     //maximum available length
     var maxLength:int; 
    
     // a single thumbnail width
     var picWidth:int = 100;
    
     // total number of pics in a container
     var maxNumPics:int;
    
     // as long as the maximum available length
     // is inferior to the container length 
     // add a new thumbnail
     while( maxLength < newPicContainer.length - 100 )
     { 
        maxLength += 100;
        maxNumPics += 1;
     } 
    
     // calculate the amount of available padding.
     var padding:Number =  ( newPicContainer.length - maxLength )/ maxNumPics; 
    
     //add your thumbs
     var picX:int;
    
     for( var i:int ; i < maxNumPics ; ++i )
     {
         var newPic:Pic = new Pic();
         newPic.x = picX;
    
         picX += padding + picWidth;
         newPicContainer.addChild( newPic ); 
     }
    
        3
  •  0
  •   ocodo    14 年前

    我建议您考虑使用flex框架(这是一个flash框架),它将使构建这种视图变得更加容易。

    您可以设置容器的布局属性,以便将项目放置在水平、垂直或平铺的布局中,然后只向容器添加项目。

    有关更多信息 Flex look here

    为了 info on Flex Layouts