1. 程式人生 > >uwp開發:Slider控制元件和MediaElement繫結,實現拖動播放.

uwp開發:Slider控制元件和MediaElement繫結,實現拖動播放.

1、實現原理:

Slider拖動時,Value值改變,MediaElement播放時,Position值改變。所以,只需將Slider的Value屬性和MediaElement的Position屬性進行繫結即可。

2、實現方法:

Slider的Value屬性是double型別的,而MediaElement的Position屬性是Timespan型別的,要繫結這兩種不同型別的的話,就要用到Converter了,即值轉換器。關於值轉換器,可以百度,或者看IT追夢圓我寫的這篇文章:資料繫結——值轉換器 的簡單使用

3、實現過程:

寫一個值轉換器類:

 class MusicConverter : IValueConverter
    {
        public object Convert(object value, Type targetType, object parameter, string language)
        {
            return ((TimeSpan)value).TotalSeconds;
        }

        public object ConvertBack(object value, Type targetType, object parameter, string language)
        {
            return TimeSpan.FromSeconds((double)value);
        }
    }

這裡注意的是,我是在Slider的Value屬性上繫結Position的,這樣的話,這個Value就是TimeSpan型別的,我們將它轉為double型別,所以直接返回它的TotalSeconds,即總秒數即可。
下來,回到View介面:實現如下繫結。


到這裡,還沒完,因為我們需要將Slider的Value值和MediaElement播放的總秒數對應起來,這樣才能實現百分比進度。所以,需要獲取媒體播放的總時長,要注意的是,播放時長需要在MediaElement的MediaOpened事件中獲取,因為在這個事件觸發之前,系統是獲取不到播放時長的。在該事件中將Slider的Maximum和播放總時間對應起來即可。

 private void me_MediaOpened(object sender, RoutedEventArgs e)
        {
          sld.Maximum = me.NaturalDuration.TimeSpan.TotalSeconds;
        }

這樣繫結就完成了。拖動Slider,實現播放相應進度。喜歡uwp開發的同學可加群:193148992 共同學習交流。