2010-01-15 55 views
1

我是一個Flex/Flash新手,我正在嘗試創建一個簡單的音樂播放器,其中包含播放/暫停按鈕和一個顯示使用自定義SliderThumbClass播放歌曲位置的HSlider。我希望允許用戶拖放sliderthumb或單擊滑動條以更改當前正在播放的歌曲的位置。Flex使用滑塊軌道拖動HSlider

使用下面的代碼,如果我使用sliderThumb更改當前正在播放的歌曲的位置,它的效果很好。但是如果我直接點擊幻燈片前後跳,當前位置不會移動,當前位置會閃爍一些,但它會跳回到原來的位置並繼續播放歌曲。如果我處於暫停狀態,這可以工作。

正如所料,當用戶點擊sliderTrack時,不會觸發thumbDrag/Press/Release事件 - 我應該訂閱哪些事件來處理這種情況?

感謝

<mx:Canvas> 

<mx:Script> 
<![CDATA[ 
... 
... 

private function onMusicPlay():void 
{ 
    ... 
    this.addEventListener(Event.ENTER_FRAME,onEnterFrame); 
    ... 
} 

private function onMusicPause():void 
{ 
    ... 
    this.removeEventListener(Event.ENTER_FRAME,onEnterFrame); 
    ... 
} 
//Invoked when the user changes the position of the slider using the thumb. It 
// calculates the new position where the song should start playing. 
private function onThumbDrag(event:Event):void 
{ 
    // if a song is loaded and we have the handles to it's sound and channel 
    // objects, allow the scrubber to drag and update state 
    if((_currentSong != null) && (_currentChannel != null)) 
    { 
     _isDragging = true; 
     _currentSongLength = _currentSong.length; 
     _currentChannel.stop(); 
     var playhead:Number = scrubSlider.value *.01; 
     _currentChannel = this.createChannel(_currentSong, (playhead * _currentSongLength)); 

    } 
} 

    //Calculates the time remaining on the current song 
private function onEnterFrame(event:Event):void 
{ 
    // only calculate intervals if the user isn't dragging 
    // the length scrubber of the song, and if the song is playing 
    if(!_isDragging && !_isPaused) 
    { 
     scrubSlider.getThumbAt(0).x = ((_currentChannel.position/_currentSong.length) * scrubSlider.width); 
     var dtPosition : Date = new Date(_currentSong.length - _currentChannel.position); 
     _nSongPosition.text = _timeFormatter.format(dtPosition);  
    } 

]]> 
</mx:Script> 

    <mx:Image id="_pauseIcon" x="0" y="0" visible="true" click="pause()" source="@Embed('../icons/pause.png')"/> 
    <mx:Image id="_playIcon" x="0" y="0" visible="false" click="play(false)" source="@Embed('../icons/play.png')"/> 

    <mx:HSlider x="75" y="10" width="527" id="scrubSlider" 
     sliderThumbClass="components.LargeSliderThumb" 
     minimum="0" maximum="100" 
     liveDragging="true" 
     showDataTip="false" 
     thumbDrag="onThumbDrag(event)"    
     thumbPress="{_isDragging=true}" 
     thumbRelease="{_isDragging=false}" 
     thumbDownSkin="@Embed('../icons/sliderThumbIcon.png')" 
     thumbOverSkin="@Embed('../icons/sliderThumbIcon.png')" 
     thumbUpSkin="@Embed('../icons/sliderThumbIcon.png')" 
     trackSkin="@Embed('../icons/sliderTrack.png')" /> 
    <mx:Text id="_nSongPosition" x="610" y="10" width="69" height="29" text="" color="#000000" fontWeight="bold" fontSize="18"/> 

</mx:Canvas> 
+0

因爲我沒有得到滿意的答案,我通過設置屬性liveDragging =「false」來禁用實時拖動(這在本場景中是可以接受的) – mvm 2010-02-06 03:06:21

回答

-1

你的問題是你可能有一個事件偵聽器正在更新您拖動事件中的歌曲的位置,但你不應用相同的邏輯來click事件。 (不能確定沒有更多的代碼).....但這會導致你拇指跳,因爲它是點擊...然後它會跳回,因爲它更新爲歌曲播放

+0

是 - 更新拇指位置/歌曲時間的事件監聽器在OnEnterFrame(..)中定義在上面的代碼中。問題是,如果我在滑塊上訂閱'click'事件,它不會將slider.value更新到新位置,因此我無法正確計算EnterFrame()上的歌曲時間/滑塊縮略位置。 – mvm 2010-01-15 23:20:00

+0

這並不回答關於哪個事件訂閱的問題,雖然... 是'點擊'事件,即使是正確的訂閱?不是「改變」事件? – psychotik 2010-01-16 04:42:11

+0

對不起physcodick..but但點擊事件也發送,當「跟蹤欄」被直接點擊後,更改事件得到調度......這是什麼問題在這裏..問題與其他事件調度和搞亂了更新當前位置... – Shua 2010-01-17 22:07:37