플래시에서 이미지 반복하기

Question

5000 픽셀 높이의 이미지가 프레임 새로 고침마다 5 픽셀 위로 이동하는 장면을 만들고 싶습니다. 이미지가 다 올라 갔을 때, 나는 이미지의 상단이 이미지의 바닥에 연결되어있는 것을보고 싶다. 이것은 레벨이 '완료'될 때까지 완료되어야합니다. 어떻게 이러한 이미지를 '루프'할 수 있습니까?

Answer 1

당신은 당신이/위의 숨겨진 계속 그 이미지의 사본을 만들 수 있으며, 트릭 하나 개의 이미지가 화면 노호 갈 때 그래서 상단과 반복에 돌아갑니다 위치와 그에 따라 루프를 업데이트하는 것입니다.

다음은 DisplayObject 클래스와 scrollRect 속성을 사용하여 아이디어를 설명하는 기본 코드 조각입니다 :

//ignore this, you have your content already 
var dummyContent:BitmapData = new BitmapData(100,100,false); 
dummyContent.perlinNoise(10,10,8,12,true,true); 

//important stuff starts here 
var container:Sprite = addChild(new Sprite()) as Sprite;//make a container 
container.scrollRect = new Rectangle(0,0,dummyContent.width,dummyContent.height);//set a scrollRect/'mask' 
var part1:DisplayObject = container.addChild(new Bitmap(dummyContent));//add two copies 
var part2:DisplayObject = container.addChild(new Bitmap(dummyContent));//of the same content 
part2.y -= part2.height;//set the 2nd at the top of the 1st 

addEventListener(Event.ENTER_FRAME,update); 
function update(e:Event):void{ 
    //move both 
    part1.y += 5; 
    part2.y += 5; 
    //check if any reach the bottom so they can be moved back up 
    if(part1.y >= part1.height) part1.y = -part1.height; 
    if(part2.y >= part2.height) part2.y = -part2.height; 
    //the above can also be nicely placed in a loop if you plan on using more seamless looping clips/images 
} 

는 분명히 서로 다른 내용이있을 것이다,하지만 원칙은 동일합니다.

var s:int = 5;//scroll speed 
//make some content 
var w:int = 100; 
var h:int = 100; 
var dummyContent:BitmapData = new BitmapData(w,h,false); 
dummyContent.perlinNoise(10,10,8,12,true,true); 

//prepare for stiching 
var renderPos:Point = new Point();//position to render the current image to 
var prenderPos:Point = new Point();//position to render the previous image (the 'hidden' copy above) 
var render:BitmapData = new BitmapData(w,h,false);//create a bitmap data instance to render updated pixels int 
addChild(new Bitmap(render));//and add it to the stage 

addEventListener(Event.ENTER_FRAME,update); 
function update(e:Event):void{ 
    renderPos.y = (renderPos.y+s)%h;//update the scroll position for the 1st part, % is used to loop back to 0 when the position gets to the content height 
    prenderPos.y = renderPos.y - h;//update the scroll position for the 2nd part (above) 
    render.lock();//freeze pixel updates 
    render.copyPixels(dummyContent,dummyContent.rect,renderPos);//copy pixels from the scroll position to the bottom 
    render.copyPixels(dummyContent,dummyContent.rect,prenderPos);//copy pixels from the top to the scroll position 
    render.unlock();//unfreeze/update ALL THE PIXELS 
} 

당신은 높이 (높이 Parameters는 scrollPosition)를 변경하는 Rectangle 객체를 사용하려고 할 수 있습니다 그래서 당신은 잠재적으로 적은 픽셀 각 액세스 : 당신은 이미지로 작업하는 경우

, 당신은 단순히의 BitmapData의 copyPixels 방법을 사용할 수 있습니다 시간 또는 수동으로 비트 맵 데이터의 getVector 메서드를 사용하여 단일 루프를 해결할 수 있지만 그 성능은 실제로 간단한 작업에 대한 문제가 있는지 및 무엇 빠른 검사 할 가치가 있는지 조사 할 수 있습니다 (복사 전체 비트 맵 rect 대 복사 부분 비트 맵 rect vs 수동 벡터를 사용하여 값 복사)

Answer 2

경고 : Flash cannot load an image greater than 16,769,025 픽셀 (또는 4095x4095). 높이가 5000 픽셀이면 너비가 3353보다 크지 않을 때만 작동합니다.

즉, 무대 위의 이미지 사본 두 장을 유지하면서 이미지를 반복하고 부모 개체와 동시에 이동합니다. 루프 포인트가 충족되면 원점으로 리셋됩니다.

이

Stage ¬ 
    0: MainTimeline:MovieClip ¬ 
     0: Container:MovieClip ¬ 
      0: img1:Bitmap 
      1: img2:Bitmap 

이제 컨테이너 최대 이동, 당신은 루프 두 번째 이미지는 첫 번째 이미지의 원점에 도달 확인해야합니다 단지 것 :

는 다음 단계의 설정을 고려하십시오.

function onEnterFrame(e:Event):void { 
    Container.y = Container.y - 5; 

    if (Container.y < -5000) { 
     Container.y = -5; 
    } 
}