Actionscript 3 AS3环绕位图数据滚动?
有没有人有一个好的解决方案,可以在AS3中创建一个基于BitmapData的滚动程序,它可以在左右滚动的同时环绕图像(还支持任意速度,而不仅仅是每个循环一个像素)?我正在尝试编写一个快速轻量级的滚动程序,它可能只使用BitmapData.copyPixels()和BitmapData.scroll() 到目前为止,我提出了以下代码:Actionscript 3 AS3环绕位图数据滚动?,actionscript-3,bitmap,scroll,Actionscript 3,Bitmap,Scroll,有没有人有一个好的解决方案,可以在AS3中创建一个基于BitmapData的滚动程序,它可以在左右滚动的同时环绕图像(还支持任意速度,而不仅仅是每个循环一个像素)?我正在尝试编写一个快速轻量级的滚动程序,它可能只使用BitmapData.copyPixels()和BitmapData.scroll() 到目前为止,我提出了以下代码: package { import flash.display.Bitmap; import flash.display.BitmapData;
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);
}
}
}
。。。根据滚动方向的不同,rect.x和point.x需要在这里进行不同的设置,但我不知道如何才能使整个循环完全复杂化。欢迎提供任何关于更好实施的提示或想法 这个问题不久前就被问到了,但由于一直没有得到回答,我再加上我的两分钱 我只是为了一个我正在从事的项目而想出来,并提出了以下解决方案。总体思路是将位图绘制到显示对象的图形中,并使用矩阵变换控制位图数据上视口的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();
}
}
现在,您只需更新点对象的x&y值即可在位图中滚动。你可以很容易地将速度、加速度和摩擦力添加到方程式中,使滚动更加动态。@Amy Blankenship这是一个类似的问题,但这里发布的解决方案没有考虑到任意方向的滚动。那里的代码只能向左滚动,不能向右滚动。哇!这是什么评论!如果我的问题惹恼了你,就忽略它吧,你似乎也不知道答案!我的错。我认为这个问题的答案与我在哪里画了一幅如何思考这个问题的图画有关。看看这篇博文,看看是否有帮助。编辑:事实上,博客帖子在评论中链接到了,但是如果你不展开它们,你可能会错过它。不,我没有错过,但是你的演示只会单向滚动(向左),每帧仅滚动一个像素。现在添加一个任意的滚动速度(比如说10个像素),并使向左和向右滚动成为可能。这就是我所做的(通过按键控制滚动),这就是我的问题所在。对不起,我问你了!
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();
}
}