Apache flex Flex 4中的自定义视频搜索栏控件

我正在Flex4中创建一个自定义视频播放器

我需要创建一个自定义搜索栏，使其具有三层，与youtube视频播放器相同。第一层是背景，第二层是下载进度，第三层是经过的视频。搜索栏也可以点击

---

如何在Flex4中创建这样的组件

不幸的是，我不相信内置的scrubar类具有此功能，因此您最好自己构建它（而不是将其添加到该类中）

为此，我将基于组创建一个新的MXML组件。在该组件中，您需要四件东西：三个矩形用于条形图/背景，一个椭圆（或另一个矩形或任何您想要的）用于playhead。把它们叠在一起。将背景矩形设置为100%高度和宽度，其他两个设置为100%高度

现在，您要做的是创建一个节并编写一些AS3来处理更改。请注意，我个人会这样做，但不一定是你必须这样做。例如，我知道大多数人会反对使用getters-setter，但我认为这是一个完美的机会

private var _progress:Number; //0-1
private var _download:Number; //0-1

public function set progress(value:Number):void{
    this._progress = value;
    this.progressBar.percentWidth = value * 100;
    this.playhead.x = value * this.width - this.playhead.width / 2;
    this.dispatchEvent(new Event(Event.PROGRESS)); //this line is optional and you would be better suited creating your own VideoEvent class to handle events across the entire player rather than using the built in events.
}

public function get progress():Number{
    return this._progress;
}

public function set download(value:Number):void{
    this._download = value;
    this.downloadBar.percentWidth = value * 100;
}

public function get download():Number{
    return this._download;
}

显然，这只是最基本的。您可以更深入地了解它并添加更多功能。例如，没有用于擦洗播放头或单击进度条进行搜索的功能。两者都相对容易实现，但是，只要确保分派事件，以便可以从其他类知道这些事件何时发生

现在，从视频控件类中，您需要将scrubbar类的

进度

和

下载

属性与VideoDisplay或NetStream事件联系起来。要做到这一点，您只需将eventListeners添加到用于侦听进度和缓冲区更改的对象中（不确定您将用于VideoDisplay的内容，但对于NetStream，您必须侦听NetStatus.STATUS以获取缓冲区和其他好处，不幸的是，您必须创建一个计时器来侦听进度）。在每个函数中，只需将适当的属性设置为VideoDisplay或NetStream对象提供的值（在NetStream中，ns.time表示当前时间，ns.bytesload表示下载）

---

我只是略略介绍了您需要做的事情，但希望这能给您提供足够的想法来开始这方面的工作。

谢谢，使用Group是个好主意