actionscript-3 - Actionscript 3 中的 Flash 搜索栏

Question

我对 Action Scripting 和 FLash 非常陌生。我需要实现搜索栏。我已经嵌入了一个在我的 jsp 页面上运行 videoPlayer 的 swf 。我还在页面上实现了播放和停止按钮。我只需要实现搜索栏。我需要在我的网页上嵌入另一个 swf，它将显示搜索栏、音量控制和计时器。我需要将搜索栏的计时器传递给 swf，以便其相应地移动。并根据我的需要调整播放器的皮肤。我怎样才能做到这一点？有人可以帮我吗？我有 Flash Professional CC 和 FlashDevelop。非常感谢。

更新:

我尝试了以下方法，但不知道如何实现。谁能告诉我一个例子如何实现这一点。我可以使用 Jw-player 来实现此目的吗？

 package 
 {
import flash.display.Sprite;
import flash.events.Event;  
import flash.media.SoundChannel;
import flash.media.Sound;
import flash.utils.Timer;
import flash.events.TimerEvent;
import flash.events.ProgressEvent;
import flash.events.IOErrorEvent;
import flash.net.URLRequest;    
import flash.external.ExternalInterface;
import flash.system.Security;
/**
 * ...
 * @author lisa
 */
public class Main extends Sprite 
{
    private var _channel:SoundChannel;
    private var sound:Sound;
    private var duration:Number;
    private var playerInstance:String;
    private var pausePoint:Number = 0;
    private var playing:Boolean = false;
    private var timer:Timer;

    public function Main():void 
    {
        this.timer = new Timer(250, 0);
        Security.allowDomain("*");
        this.playerInstance = root.loaderInfo.parameters.playerInstance + ".";
        ExternalInterface.addCallback("init", this.init);
        ExternalInterface.addCallback("load", this.load);
        ExternalInterface.addCallback("playPause", this.playPause);
        ExternalInterface.addCallback("pplay", this.play);
        ExternalInterface.addCallback("ppause", this.pause);
        ExternalInterface.addCallback("skipTo", this.skipTo);
        ExternalInterface.call(this.playerInstance + "loadStarted");
        return;
        //if (stage) init();
        //else addEventListener(Event.ADDED_TO_STAGE, init);
    }

    private function init(param1:String):void 
    {
        this.load(param1);
        return;
        //removeEventListener(Event.ADDED_TO_STAGE, init);
        // entry point
    }

    private function get channel() : SoundChannel
    {
        return this._channel;
    }// end function

    private function set channel(param1:SoundChannel) : void
    {
        this._channel = param1;
        this._channel.addEventListener(Event.SOUND_COMPLETE, this.soundEnded);
        return;
    }// end function

    private function updatePlayhead(event:TimerEvent = null) : void
    {
        var _loc_2:* = event ? (this.channel.position) : (this.pausePoint);
        var _loc_3:* = _loc_2 / this.duration;
        if (_loc_3 > 1)
        {
            _loc_3 = 1;
        }
        if (_loc_3 > 0)
        {
            ExternalInterface.call(this.playerInstance + "updatePlayhead", _loc_3);
        }
        return;
    }// end function

    private function loadProgress(event:ProgressEvent) : void
    {
        this.duration = event.bytesTotal / (event.bytesLoaded / this.sound.length);
        var _loc_2:* = event.bytesLoaded / event.bytesTotal;
        if (_loc_2 > 1)
        {
            _loc_2 = 1;
        }
        if (_loc_2 > 0)
        {
            ExternalInterface.call(this.playerInstance + "loadProgress", _loc_2, this.duration / 1000);
        }
        return;
    }// end function

    private function load(param1:String) : void
    {
        if (this.channel)
        {
            this.channel.stop();
        }
        if (this.sound)
        {
            this.sound.removeEventListener(ProgressEvent.PROGRESS, this.loadProgress);
        }
        this.channel = new SoundChannel();
        this.sound = new Sound(new URLRequest(param1));
        this.pausePoint = 0;
        this.sound.addEventListener(IOErrorEvent.IO_ERROR, this.loadError);
        this.sound.addEventListener(ProgressEvent.PROGRESS, this.loadProgress);
        this.timer.addEventListener(TimerEvent.TIMER, this.updatePlayhead);
        this.timer.start();
        return;
    }// end function

    private function loadError(event:IOErrorEvent) : void
    {
        ExternalInterface.call(this.playerInstance + "loadError");
        return;
    }// end function

    private function play() : void
    {
        this.channel = this.sound.play(this.pausePoint);
        this.playing = true;
        this.timer.start();
        return;
    }// end function

    private function pause() : void
    {
        this.pausePoint = this.channel.position;
        this.channel.stop();
        this.playing = false;
        this.timer.stop();
        return;
    }// end function

    private function playPause() : void
    {
        if (this.playing)
        {
            this.pause();
        }
        else
        {
            this.play();
        }
        return;
    }// end function

    private function skipTo(param1:Number) : void
    {
        this.channel.stop();
        this.pausePoint = this.duration * param1;
        if (this.playing)
        {
            this.channel = this.sound.play(this.pausePoint);
        }
        else
        {
            this.updatePlayhead();
        }
        return;
    }// end function

    private function soundEnded(event:Event) : void
    {
        ExternalInterface.call(this.playerInstance + "trackEnded");
        return;
    }// end function

}

}

Answer 1

如果您对 ActionScript 非常陌生，也许这个 tutorial will be helpful为你。

我为您创建了一个小示例:SimpleSeekBar。完成此组件将是您的作业:在用户交互后通知其他组件更改的进度，例如使用 AS3Signals等

//Usage example
var seekBar:SimpleSeekBar = new SimpleSeekBar();
addChild(seekBar);
seekBar.initiate(220, 8);
//progress = currentTime / totalDuration;
seekBar.changeProgress(0.5); //Half

//pretty position
seekBar.x = seekBar.y = 20;

SimpleSeekBar 定义:

import flash.display.Shape;
import flash.display.Sprite;
import flash.events.MouseEvent;
import flash.geom.Rectangle;

public class SimpleSeekBar extends Sprite {
    private var _bar:Sprite;
    private var _seekIndicator:Shape;
    private var _pip:Sprite;
    private var _seekZone:int;
    private var _dragZone:Rectangle;

    public function initiate(width:int, height:int):void {
        _bar = new Sprite();
        _seekIndicator = new Shape();
        _pip = new Sprite();
        _seekZone = width - height;
        _dragZone = new Rectangle(0, height * 0.5, _seekZone, 0);

        _bar.addEventListener(MouseEvent.CLICK, onClickBar);
        _pip.addEventListener(MouseEvent.MOUSE_DOWN, onDownPip);

        addChild(_bar);
        addChild(_seekIndicator);
        addChild(_pip);

        _bar.graphics.beginFill(0x777777);
        _bar.graphics.drawRect(0, 0, width, height);

        _seekIndicator.graphics.beginFill(0x990000);
        _seekIndicator.graphics.drawRect(0, 0, 100, height);

        _pip.graphics.beginFill(0xF0F0F0);
        _pip.graphics.drawCircle(height * 0.5, 0, height * 0.5);
        _pip.graphics.beginFill(0x565656);
        _pip.graphics.drawCircle(height * 0.5, 0, height * 0.25);
        _pip.y = height * 0.5;

        updateSeek();
    }

    public function changeProgress(progress:Number):void {
        _pip.x = _seekZone * progress;
        updateSeek();
    }

    private function getProgressFromPosition(localX:Number):Number {
        var progress: Number = localX / _seekZone;
        if(progress > 1){
            progress = 1;
        }
        return progress;
    }

    private function onClickBar(e:MouseEvent):void {
        //Move progress to the new position
        changeProgress(getProgressFromPosition(e.localX));
    }

    private function onDownPip(e:MouseEvent):void {
        //Start drag, also it's a good place to set flag, that we are dragging, and
        //changeProgress don't affect our pip
        stage.addEventListener(MouseEvent.MOUSE_UP, onUp);
        stage.addEventListener(MouseEvent.MOUSE_MOVE, onMove);
        _pip.startDrag(false, _dragZone);
    }

    private function onMove(e:MouseEvent):void {
        updateSeek();
    }

    private function onUp(e:MouseEvent):void {
        stage.removeEventListener(MouseEvent.MOUSE_UP, onUp);
        stage.removeEventListener(MouseEvent.MOUSE_MOVE, onMove);
        _pip.stopDrag();
    }

    private function updateSeek():void {
        _seekIndicator.width = _pip.x;
    }
}

结果会是这样的: