Question

上次编辑：已解决

好吧，我在这里找不到完整的答案，但我终于得到了我想要的。非常感谢你的帮助和耐心。

顺便说一句：我想我可能在使用int和Number类型时遇到了问题，在仔细检查我的解决方案后，我意识到使用的是Number，而不是int。事实证明，Number包含浮点，而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

BONUS CONTENT! as an added bonus (if anyone finds this thread looking for answers..) you could also have the pic s fan out from the center point (but they d still be in order of left to right) by using this code:

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:

我修改后的代码如下所示：

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;

我必须承认我的数学不是很好，所以这部分编码让我无法理解。。

提前感谢任何买家。。

Answer 1

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

//Container Width    
newPicContainer.width;

或者newContainer也是添加的pics的父级：

//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;
    }

Answer 2

试试这个。。。

 //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 ); 
 }

Answer 3

我建议您考虑使用Flex框架（它是一个Flash框架），它将使构建这种视图变得更加容易。

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

有关此处为Flex外观

对于关于flex Layouts的信息

友情链接