AS3 Wrapped-around BitmapData Scrolling？

Question

有没有人有一个很好的解决方案，在AS3中创建一个基于BitmapData的滚动条，可以在向左和向右滚动的同时环绕图像（并且还支持任意速度，而不是每个循环一个像素）？我试图编写一个快速轻量级的滚动条，它只能使用BitmapData.copyPixels（）和BitmapData.scroll（）。

到目前为止，我想出了这个代码：

package 
{ 
    import flash.display.Bitmap; 
    import flash.display.BitmapData; 
    import flash.display.Sprite; 
    import flash.events.KeyboardEvent; 
    import flash.geom.Point; 
    import flash.geom.Rectangle; 
    import flash.ui.Keyboard; 


    [SWF(width="800", height="480", frameRate="60", backgroundColor="#000000")] 
    public class Main extends Sprite 
    { 
     private var _source:BitmapData; 
     private var _sourceWidth:int; 
     private var _buffer:BitmapData; 
     private var _canvas:BitmapData; 
     private var _rect:Rectangle = new Rectangle(); 
     private var _point:Point = new Point(); 
     private var _xOffset:int = 0; 

     public function Main() 
     { 
      _source = new Picture(); 
      _sourceWidth = _source.width; 
      _rect.width = _source.width; 
      _rect.height = _source.height; 
      _canvas = new BitmapData(_source.width, _source.height, false, 0x000000); 
      _canvas.copyPixels(_source, _rect, _point); 
      _buffer = _canvas.clone(); 

      var b:Bitmap = new Bitmap(_canvas); 
      b.x = stage.stageWidth/2 - _canvas.width/2; 
      b.y = 10; 
      addChild(b); 

      stage.addEventListener(KeyboardEvent.KEY_DOWN, function(e:KeyboardEvent):void 
      { 
       if (e.keyCode == Keyboard.RIGHT) scroll(10); 
       else if (e.keyCode == Keyboard.LEFT) scroll(-10); 
      }); 
     } 


     private function scroll(speed:int):void 
     { 
      /* Update offset. */ 
      _xOffset -= speed; 

      /* Reset rect & point. */ 
      _rect.width = _sourceWidth; 
      _rect.x = 0; 
      _point.x = 0; 

      /* Reached the end of the source image width. Copy full source onto buffer. */ 
      if (_xOffset == (speed > -1 ? -(_sourceWidth + speed) : _sourceWidth - speed)) 
      { 
       _xOffset = -speed; 
       _buffer.copyPixels(_source, _rect, _point); 
      } 

      /* Scroll the buffer by <speed> pixels. */ 
      _buffer.scroll(-speed, 0); 

      /* Draw the scroll buffer onto the canvas. */ 
      _canvas.copyPixels(_buffer, _rect, _point); 

      /* Update rect and point for copying scroll-in part. */ 
      _rect.width = Math.abs(_xOffset); 
      /* Scrolls to left. */ 
      if (speed > -1) 
      { 
       _rect.x = 0; 
       _point.x = _sourceWidth + _xOffset; 
      } 
      /* Scrolls to right. */ 
      else 
      { 
       _rect.x = _sourceWidth - _xOffset; 
       _point.x = 0; 
      } 

      trace("rect.x: " + _rect.x + " point.x: " + _point.x); 

      /* Copy the scrolling-in part from source to the canvas. */ 
      _canvas.copyPixels(_source, _rect, _point); 
     } 
    } 
} 

可以滚动左/右光标键。只有图像绕回一次，滚动才能正常工作。如果决定在相反的方向上滚动，它会混淆坐标以从滚动缓冲区复制区域。基本上这个块这里需要工作：

  /* Update rect and point for copying scroll-in part. */ 
      _rect.width = Math.abs(_xOffset); 
      /* Scrolls to left. */ 
      if (speed > -1) 
      { 
       _rect.x = 0; 
       _point.x = _sourceWidth + _xOffset; 
      } 
      /* Scrolls to right. */ 
      else 
      { 
       _rect.x = _sourceWidth - _xOffset; 
       _point.x = 0; 
      } 

...的rect.x和point.x需要在这里进行不同的设置取决于滚动的方向，但我不知道怎么完全没有过于复杂的全循环。任何提示或想法更好的实施将受到欢迎！

Answer 1

前一段时间被问到这个问题，但由于它一直没有答案，我会加我两分钱。

我只是想弄清楚我正在做的一个项目，并提出了以下解决方案。总体思路是将位图绘制到显示对象的图形中，并使用矩阵变换来控制位图数据上的视口的x和y坐标。现在

public class Example extends Sprite 
{ 
    private var vx:Number; 
    private var vy:Number; 
    private var coords:Point; 
    private var shape:Shape; 
    private var bitmap:Bitmap; 
    private var bmd:BitmapData; 

    public function Example() 
    { 
     vx = 1.5; 
     vy = -3.0; 
     coords = new Point(); 
     shape = new Shape(); 
     bitmap = new Image(); // image, in my case is an embedded image 
     bmd = bitmap.bitmapData; 

     addChild(shape); 
     addEventListener(Event.ENTER_FRAME, onEnterFrame); 
    } 

    private function onEnterFrame(event:Event):void 
    { 
     coords.x += vx; 
     coords.y += vy; 

     // this is important! 
     // without it, bitmap size constraints are reached and scrolling stops 
     coords.x %= bitmap.width; 
     coords.y %= bitmap.height; 

     shape.graphics.clear(); 
     shape.graphics.beginBitmapFill(bmd, new Matrix(1, 0, 0, 1, coords.x, coords.y), true, true); 
     shape.graphics.drawRect(0, 0, stage.stageWidth, stage.stageHeight); 
     shape.graphics.endFill(); 
    } 
} 

你可以更新Point对象的x & y值周围的位图滚动。您可以轻松地将速度，加速度和摩擦添加到方程中，使滚动更加动态。