flash制作实例：图片翘转缩放拖动

 

作前准备

    准备一张规格为550*400的照片或图片，经过制图软件（ps、fw）处理后，放在桌面或我的文档待用。

    1.启动FLASH8 软件。

    2.确立文档属性 设置动画尺寸为550*400，背景颜色黑绿，其它默认,点击确定，进入场景1。如图1所示：

（是为便于观看我把场景设置成25%）

图1

    3.首先将准备好的素材图片导入到库中，待用。

    4.创建影片剪辑

    选择“插入－新建元件-高级”，如图2所示：

图2

打开元件属性、链接面板，建立一个名为“ball”的影片剪辑元件（链接标识符同名称），属性链接参数，如图3所示：

ball影片剪辑属性链接中的URL（u）,可随便输入一个网页的地址。

我用的是我网页地址：http://ycyx88888.blog.163.com/

图3

点击确定，进入元件编辑区。就一个图层。

    选择图层1第一帧，从库中拖出照片到舞台，把规格修改成110*80（宽、高是原图的20%），上对齐－左对齐。如图4所示：

图4

    5.编辑制作场景

    返回场景1，添加两个图层，共三个图层。自下而上命名为照片、文本、as。 

    （1）选择照片图层第一帧，从库中拖出照片位图到舞台，规格550*400，全居中，选中该实例将其转换为图形元件，在属性面板设置其Apha为30-40％。上锁。如图5所示：

图5

    （2）选择文本图层第一帧，用文本工具在舞台下方输入：“按住每张图片放大 按住最后一张图片可拖动”，水平中齐。上锁。如图6所示：

图6

    （3）选择as图层第一帧,按f9，打开动作面板，在as编辑区输入，帧语.

帧语句：

function start_func()
{
    var i = 0;
    while (i <= 9)
    {
        container.attachMovie("ball", "ball" + i, i);
        container["ball" + i]._x = 225 + r * Math.abs(4.500000E+000 - i) * Math.cos((135 - Math.floor(i / 5) * 180) * 3.141593E+000 / 180);
        container["ball" + i]._y = 225 + r * Math.abs(4.500000E+000 - i) * Math.sin((135 - Math.floor(i / 5) * 180) * 3.141593E+000 / 180);
        container["ball" + i].i = i;
        container["ball" + i].onEnterFrame = function ()
        {
            var _loc2 = new Color(this._mc);
            _loc2.setRGB(Math.random() * 16777215);
            this._x = 225 + r * Math.abs(4.500000E+000 - this.i) * Math.cos((135 - Math.floor(this.i / 5) * 180 + p) * 3.141593E+000 / 180);
            this._y = 225 + r * Math.abs(4.500000E+000 - this.i) * Math.sin((135 - Math.floor(this.i / 5) * 180 + p) * 3.141593E+000 / 180);
            p = p + 5.000000E-001;
        };
        container["ball" + i].onPress = function ()
        {
            var _loc2 = new mx.transitions.Tween(this, "_xscale", mx.transitions.easing.Elastic.easeOut, 100, 200, 1, true);
            _loc2 = new mx.transitions.Tween(this, "_yscale", mx.transitions.easing.Elastic.easeOut, 100, 200, 1, true);
        };
        container["ball" + i].onRelease = function ()
        {
            var _loc2 = new mx.transitions.Tween(this, "_xscale", mx.transitions.easing.Elastic.easeOut, 200, 100, 1, true);
            _loc2 = new mx.transitions.Tween(this, "_yscale", mx.transitions.easing.Elastic.easeOut, 200, 100, 1, true);
        };
        ++i;
    }
}
var r = 45;
var p = 0;
var drag = false;
var num = 0;
this.createEmptyMovieClip("container", this.getNextHighestDepth());
start_func();
var mouseListener = new Object();
mouseListener.onMouseDown = function ()
{
    if (container.ball0.hitTest(_root._xmouse, _root._ymouse))
    {
        drag = true;
    }
};
mouseListener.onMouseMove = function ()
{
    if (drag)
    {
        num = 1;
        delete container.ball0.onEnterFrame;
        container.ball0._x = _root._xmouse;
        container.ball0._y = _root._ymouse;
        for (var _loc2 = 1; _loc2 <= 9; ++_loc2)
        {
            delete container["ball" + _loc2].onEnterFrame;
            container["ball" + _loc2]._x = container["ball" + _loc2]._x + (container["ball" + (_loc2 - 1)]._x - container["ball" + _loc2]._x) / 3;
            container["ball" + _loc2]._y = container["ball" + _loc2]._y + (container["ball" + (_loc2 - 1)]._y - container["ball" + _loc2]._y) / 3;
        }
    }
};
mouseListener.onMouseUp = function ()
{
    drag = false;
    if (num == 1)
    {
        start_func();
        num = 0;
    };
};
Mouse.addListener(mouseListener);

锁定该图层。

    6.该作业完成后的时间轴如图7所示：

图7

    7.测试存盘

 

 

博技交流 八宝小箱 P.S选篇 U.5知识 综合艺术 靓丽欣赏 综合导航 模块设置 迷人音画 F.S题材 相关收藏 兴趣客栈 博技点滴 迎春博客日志陈列版  在线制作