1

我对 WPF 有点陌生，我正在尝试为我的滑块添加一种样式，但是有太多的选项让我感到困惑。

有人可以制作，或者让我开始如何使滑块看起来像这样： 滑块 绿色=通过，其余轨道灰色

而且我正在尝试在播放歌曲时使用它来显示，所以灰色=剩余，当您拖动它时，最简单的实现方法是跳到歌曲的那部分。

我正在使用 NAudio，当歌曲正在播放时，我让轨迹栏滑动（按剩余时间）：

private void dispatcherTimer_Tick(object sender, EventArgs e) {
   LabelCurrentTime.Content = _musicManager.getPlayTime();
   double totalseconds = _musicManager.totalSeconds();
   double currentseconds = _musicManager.currentSeconds();
   if (totalseconds > 0 && currentseconds > 0)
      Trackbar.Value = ((((Trackbar.Width / totalseconds) * currentseconds)) / totalseconds) * 10;
}

在 xaml 中：

<Slider x:Name="Trackbar" Height="25" Canvas.Left="50" Canvas.Top="10" Width="408" Maximum="10"/>
4

2 回答 2

2

干得好：

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
    }

    private void Border_MouseDown(object sender, MouseButtonEventArgs e)
    {
        var mainborder = sender as Border;
        double x = e.GetPosition(mainborder).X;
        double val = 1 - (mainborder.ActualWidth - x) / mainborder.ActualWidth;
        slider.Value = val * (slider.Maximum - slider.Minimum) + slider.Minimum;
    }
}

public class SliderValueConverter : IMultiValueConverter
{
    public object Convert(object[] values, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
        double val = (double)values[0];
        double min = (double)values[1];
        double max = (double)values[2];
        double sliderWidth = (double)values[3];
        return sliderWidth * (val - min) / (max - min);
    }

    public object[] ConvertBack(object value, Type[] targetTypes, object parameter, System.Globalization.CultureInfo culture)
    {
        throw new NotImplementedException();
    }
}

<Window x:Class="WpfTest.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:WpfTest"
    Title="MainWindow" Height="650" Width="825">
<Window.Resources>
    <local:SliderValueConverter x:Key="sliderValueConverter"/>
</Window.Resources>
<StackPanel>
    <Slider Maximum="200" Minimum="100" Name="slider">
        <Slider.Template>
            <ControlTemplate TargetType="{x:Type Slider}">
                <Border Background="Silver" Height="30" MouseDown="Border_MouseDown">
                    <Border Background="Green" HorizontalAlignment="Left">
                        <Border.Width>
                            <MultiBinding Converter="{StaticResource sliderValueConverter}">
                                <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="Value"/>
                                <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="Minimum"/>
                                <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="Maximum"/>
                                <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="ActualWidth"/>
                            </MultiBinding>
                        </Border.Width>
                    </Border>
                </Border>
            </ControlTemplate>
        </Slider.Template>
    </Slider>
</StackPanel>

于 2012-11-01T20:28:39.063 回答
0

这不是一个完整的解决方案，但可以帮助您入门。

WPF 中的所有控件都有一个 ControlTemplate，用于定义它们的外观和行为方式。\

Slider 控件的 ControlTemplate 出奇的复杂（起初），网上有很多例子。

看看MSDN 示例。

于 2012-11-01T20:29:53.750 回答