Question

将轨迹栏与进度条组合起来是否有一种相当简单的方法？我希望能够完成它，以便在单击按钮时进度条仅上升到轨迹栏。这主要是出于学习目的，但也很高兴知道如何以实用的方式使用它。

提前致谢。

[编辑] 像这样。 http://www.java2s.com/Tutorial/VB/0260__GUI/LinkProgressBarwithaTrackBar.htm

但是在彼此之内，或者合并，而不是彼此相邻。

Answer 1

确切地说，不确定您的意思，但您可以将TrackBar和ProgressBar放入单个自定义UserControl（例如，一个在另一个之上）。

更新：由于您希望它们合并而不是其中之一，您最好的选择就是从头开始编写自己的UserControl。

更新2 ：Click here以查看具有组合TrackBar和ProgressBar概念的简单UserControl的应用程序（移动滑块以更改轨迹栏的值，然后单击“显示” “进度”按钮显示进度条如何从零到轨迹条的拇指所在的位置。 Click here下载源代码。

Answer 2

我有一个解决方案。这会产生一个进度条，指示一个容器的装满程度。滑块拇指叠加在顶部。用户可以在进度条中移动滑块，但只能移动到当前值。

如何使用它的一个例子是录音控制器。进度条指示存储容量和当前录制的音频量。拇指指示比赛位置。

第1步：为Slider定义样式并添加进度条。将它放在与拇指相同的视觉效果（此处为相同的网格单元格）中。将它放在Thumb之前，以便在它下面呈现它：

        List<StockValue> monthlyStocks = new List<StockValue>();
        List<StockValue> MonthlyFirstStock = new List<StockValue>();
        foreach(StockValue st in data)
        {
            if(monthlyStocks.Count > 0)
            {
                if(st.Date.Month != monthlyStocks.Last().Date.Month)
                {
                    MonthlyFirstStock.Add(monthlyStocks.OrderBy(x => x.Date).FirstOrDefault());
                    monthlyStocks = new List<StockValue>();
                }
            }

            monthlyStocks.Add(st);
        }
        MonthlyFirstStock.Add(monthlyStocks.OrderBy(x => x.Date).FirstOrDefault());

第2步：创建可以通过隧道查找ProgressBar的附加属性：

<ControlTemplate x:Key="HorizontalProgressSlider" TargetType="{x:Type Slider}">
    <Grid Margin="5">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" MinHeight="{TemplateBinding MinHeight}"/>
            <RowDefinition Height="Auto"/>
        </Grid.RowDefinitions>
        <TickBar x:Name="TopTick" Visibility="Collapsed" Fill="LightGray" Placement="Top" SnapsToDevicePixels="True"
                 Height="4" Margin="0,0,0,2" />
        <ProgressBar x:Name="TrackProgressBar" Grid.Row="1" HorizontalAlignment="Stretch" Height="10" VerticalAlignment="Center" 
                 Margin="8,0,8,0" Foreground="CadetBlue"></ProgressBar>
        <Track x:Name="PART_Track" Grid.Row="1">
            <Track.DecreaseRepeatButton>
                <RepeatButton Command="{x:Static Slider.DecreaseLarge}"  Style="{StaticResource SliderRepeatButtonStyle}" />
            </Track.DecreaseRepeatButton>
            <Track.IncreaseRepeatButton>
                <RepeatButton Command="{x:Static Slider.IncreaseLarge}" Style="{StaticResource SliderRepeatButtonStyle}"/>
            </Track.IncreaseRepeatButton>
            <Track.Thumb>
                <Thumb x:Name="Thumb" Style="{StaticResource SliderThumbStyle}" />
            </Track.Thumb>
        </Track>
        <TickBar x:Name="BottomTick" Grid.Row="2" Visibility="Collapsed" Fill="LightGray" Placement="Bottom"
             SnapsToDevicePixels="True" Height="4" Margin="0,2,0,0"/>
    </Grid>
<ControlTemplate>

第3步：通过为ValueChanged实现处理程序，防止滑块移动到ProgressBar的值之外：

public class SliderProgressBarAttachedProperty : DependencyObject
{
    public static readonly DependencyProperty ProgressValueProperty =
        DependencyProperty.RegisterAttached("ProgressValue", typeof(int), typeof(SliderProgressBarAttachedProperty), new PropertyMetadata(OnItemsChanged));

    public static int GetProgressValue(DependencyObject obj)
    {
        return (int)obj.GetValue(ProgressValueProperty);
    }
    public static void SetProgressValue(DependencyObject obj, int value)
    {
        obj.SetValue(ProgressValueProperty, value);
    }

    public static readonly DependencyProperty ProgressMaximumProperty =
        DependencyProperty.RegisterAttached("ProgressMaximum", typeof(int), typeof(SliderProgressBarAttachedProperty), new PropertyMetadata(OnItemsChanged));

    public static int GetProgressMaximum(DependencyObject obj)
    {
        return (int)obj.GetValue(ProgressMaximumProperty);
    }

    public static void SetProgressMaximum(DependencyObject obj, int value)
    {
        obj.SetValue(ProgressMaximumProperty, value);
    }

    private static void OnItemsChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
    {
        var slider = d as Slider;

        var progressValue = GetProgressValue(d);
        var progressMaximum = GetProgressMaximum(d);

        if (slider == null) return;

        var progressBar = slider.Template.FindName("TrackProgressBar",slider) as ProgressBar;

        if (progressBar == null) return;

        progressBar.Maximum = progressMaximum;
        progressBar.Value = progressValue;
    }
}

C＃：如何将TrackBar与ProgressBar结合使用

2 个答案: