文档章节

Flash游戏背景的循环滚动实现

童年伊梦
 童年伊梦
发布于 2012/09/25 12:44
字数 579
阅读 766
收藏 0

Flash游戏背景的循环滚动实现    by:童年

我们在做flash游戏的时候有时候要用到背景滚屏技术,今天在天地会看到一个兄弟问这方面的问题,咱们就来探讨下怎么循环滚动背景图片吧。

  • 首先我们需要一张宽度比舞台Stage宽的一张位图,在这里,我在FlashIDE里面做了个元件,没有用位图。导出链接为Background,如下图所示。

设置文档类:BgLoop

package
{
    import flash.display.Sprite;
    import flash.events.Event;
                                                                                                                                                                                                                                                            
    /**
     * ...
     * @author  Childhood
     */
    public class BgLoop extends Sprite
    {
        private var bg:Sprite;
        private var bgClone:Sprite;
        private var speed:Number;
        private var offSet:Number;
        public function BgLoop():void {
            speed = -5.0;
            bg = new Background();
            bgClone = new Background();
            offSet = bg.width - stage.stageWidth;
            addChild(bg);
            addChild(bgClone);
            initPos();
            addEventListener(Event.ENTER_FRAME, loopBg);
        }
                                                                                                                                                                                                                                                                
        private function initPos(dist:Number = 0):void
        {
            bg.x = 0 - dist;
            bgClone.x = bg.width - dist;
            bg.y = bgClone.y = 120;
        }
                                                                                                                                                                                                                                                                
                                                                                                                                                                                                                                                                
        private function loopBg(e:Event):void
        {
            bg.x += speed;
            bgClone.x += speed;
            if (bgClone.x + bgClone.width <= stage.stageWidth) {
                initPos(offSet);
            }
        }
    }
}

  • 关键代码在29、30、39、40行,为方便说明,我用3幅图来解释下。

  • 图1:bg和bgClone的初始位置,他们的y坐标我是随便给的。但x坐标可不是随意的哦。

图1

  • 图2:当bg和bgClone往左运动到bgClone的右边界在舞台右边界这个临界时,我们需要将bg和bgClone的位置重置为图3画面的中第二行图形,他们的舞台显示是一样的。

图2

  • 图3:我们在舞台范围内看到的图形在图2中是属于bgClone的,但为了循环,现在需要将舞台上的图形重置为bg的,条件就是bg在舞台上的显示需要和bgClone的显示位置一摸一样,不能有偏差。可以看到图2的舞台显示和图3的第二行图形的舞台显示是一样的,其实就是图1的bg和bgClone整体往左移动offSet距离。(或者可以认为是图2的2张图整体往右移动bg.width长度)

图3

当然我们也可以把2个图合成一个图,当这个合成图的右边界往左运动到达舞台的右边界这个界限时,需要把此时大图的x坐标设置为(x+大图.width/2)。

源码文件:http://115.com/file/benapik7#背景循环滚动.rar,里有效果预览。

© 著作权归作者所有

童年伊梦
粉丝 1
博文 29
码字总数 21736
作品 0
浦东
私信 提问
[Unity3D插件]2dtoolkit系列二 动画精灵的创建以及背景图的无限滚动

经过昨天2dtoolkit系列教程一的推出,感觉对新手还有有一定的启发作用,引导学习使用unity 2dToolKit插件的使用过程,今天继续系列二——动画精灵的创建,以及背景图的无限循环滚动,在群里总...

蓬莱仙羽
2014/03/05
0
0
疯狂ios讲义之疯狂打飞机(2)

4玩家飞机飞行效果 下面添加游戏背景图片和玩家操控的飞机。打开HelloWorldLayer.m文件,首先定义4个变量,实现代码如下。 程序清单:codes/13/13.14/AirfightGame/AirfightGame/HelloWorld...

fkJava李刚
2018/06/26
0
0
疯狂ios讲义之疯狂打飞机(2)

4 玩家飞机飞行效果 下面添加游戏背景图片和玩家操控的飞机。打开HelloWorldLayer.m文件,首先定义4个变量,实现代码如下。 程序清单:codes/13/13.14/AirfightGame/AirfightGame/HelloWorld...

博文视点
2014/04/22
815
1
[Unity3D插件]2dtoolkit系列二 动画精灵的创建以及背景图的无限滚动

经过昨天2dtoolkit系列教程一的推出,感觉对新手还有有一定的启发作用,引导学习使用unity 2dToolKit插件的使用过程,今天继续系列二——动画精灵的创建,以及背景图的无限循环滚动,在群里总...

丁小未
2014/03/05
0
1
Cocos2d-x3.0游戏实例之《别救我》第三篇——循环滚动背景(上)

好,这篇我们来讲解无限循环滚动背景,这个知识已经被讲到烂了,我以前的文章也介绍过,所以就不那么详细地说明了。 笨木头花心贡献,啥?花心?不呢,是用心~ 转载请注明,原文地址:http:...

musicvs
2014/05/09
0
0

没有更多内容

加载失败,请刷新页面

加载更多

好程序员分享placeholder属性详解

  好程序员分享placeholder属性详解,HTML5里新引入很多有趣的新特征;有些体现在HTML里,有些是JavaScript API,全部非常的有用。其中我最喜欢的一个特征就是文本框(INPUT)里的placehold...

好程序员IT
5分钟前
0
0
[学]ngin反向代理搭建与配置

Nginx安装地址:https://www.cnblogs.com/wyd168/p/6636529.html (linux) 必须安装的4个包: nginx-1.1.10.tar.gz openssl-1.0.1t.tar.gz pcre-8.39.tar.gz zlib-1.2.11.tar.gz 启动Nginx......

覃光林
8分钟前
0
0
互联网商城的上云改造之旅

在中国,经过十年的发展,云计算产业已走过概念普及的1.0时期,进入“上云”和落地的2. 0阶段,企业上云意识不断增强,越来越多的企业选择部署多云和混合IT。 如今,云计算生态一片繁荣,看似...

zhaowei121
10分钟前
0
0
fastJson 一些小例子

package com.*;import com.alibaba.fastjson.annotation.JSONField;public class VO { @JSONField(name="ID") private int id; public int getId() { ......

qimh
23分钟前
0
0
十年后,程序员的工资还能达到现在的水平吗?

一方面,程序员的门槛正在逐渐消失,因为计算机相关专业毕业生一年比一年多; IT 培训班出来的学生一年比一年多;网络上各种编程课程,也正在帮助无数人零基础转型软件开发…… 另一方面,程...

爱编程的浪子
31分钟前
0
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部