【问题标题】:How to bind ProgressBar Maximum minus Value to textblock in WPF如何将 ProgressBar 最大值减值绑定到 WPF 中的文本块
【发布时间】:2019-11-12 22:04:31
【问题描述】:

在 Expression blend 中,我有一个进度条和两个文本块。我将第一个文本块绑定到 Value 属性。我需要将第二个文本块绑定到最大值属性以读取剩余的数量以填充进度条。我怎样才能在 XAML 中做到这一点?

因为我想在修改progressBar值时看到设计器视图的变化

这是视图: https://i.imgur.com/yTF1rRl.png

代码:

<Window
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    x:Class="mobSizing.MainWindow"
    x:Name="Window"
    Title="MainWindow"
    Width="640" Height="480">

    <Grid x:Name="LayoutRoot">
        <ProgressBar x:Name="progressBar" Height="41" Margin="84,77,125,0" VerticalAlignment="Top" Value="66"/>
        <TextBlock x:Name="Value" HorizontalAlignment="Left" Height="40" Margin="106,142,0,0" TextWrapping="Wrap" Text="{Binding Value, ElementName=progressBar}" VerticalAlignment="Top" Width="182" Foreground="#FF40B617"/>
        <TextBlock x:Name="Left" HorizontalAlignment="Right" Height="40" Margin="0,145,53,0" TextWrapping="Wrap" Text="{Binding Value, ElementName=progressBar}" VerticalAlignment="Top" Width="182" Foreground="#FF8F8F8F"/>
    </Grid>
</Window>

【问题讨论】:

  • 请说明哪个值用于什么。进度条继承自 rangebase docs.microsoft.com/en-us/dotnet/api/…,因此它具有最小值、最大值和值属性。 “剩余”数量是最大值 - 值。如果这就是您所需要的,那么您需要一个多转换器和多绑定或 ViewModel 来进行计算。
  • 是的,我想将剩余数量(最大值)绑定到“left”文本块。
  • 不是您要的,但是您进行布局的方式是个坏主意。不要在设计器周围拖放控件。编辑代码中的值并使用堆栈面板、行和列来排列控件。永远不要使用固定的大边距,因为它们不能流动,而且您的布局只能在与您自己的设置相同的显示器上工作。当您分发产品时,这有点问题。
  • 这不是布局,只是用来说明我的问题的屏幕截图。
  • 在视图模型中为进度条和要绑定的文本块设置属性,而不是让控件尝试相互绑定不是更好吗?

标签: wpf data-binding expression-blend-4


【解决方案1】:

这是一种基于多转换器的方法。

标记:

<Grid x:Name="LayoutRoot">
    <Grid.RowDefinitions>
        <RowDefinition Height="60"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>
    <ProgressBar x:Name="progressBar" Height="41"  
                 Grid.ColumnSpan="3"
                 Value="66"/>
    <TextBlock x:Name="Value"
               Grid.Column="0" 
               Grid.Row="1"
               Text="{Binding Value, ElementName=progressBar}" VerticalAlignment="Top"  
               TextAlignment="Center"
               Foreground="#FF40B617"/>
    <TextBlock x:Name="Left" 
               Grid.Column="2" 
               Grid.Row="1"
               TextAlignment="Center"
               VerticalAlignment="Top" 
               Foreground="#FF8F8F8F">
        <TextBlock.Text>
            <MultiBinding Converter="{local:AmountLeftMultiConverter}" StringFormat="{}{0:n0}">
                <Binding Path="Maximum" ElementName="progressBar"/>
                <Binding Path="Value"  ElementName="progressBar"/>
            </MultiBinding>
        </TextBlock.Text>
    </TextBlock>
</Grid>

转换器将从第一个绑定中减去第二个绑定提供的任何内容。这些值以数组的形式传递给多转换器。

转换器。我的是在一个临时应用程序中,所以你的命名空间会有所不同:

    using System;
    using System.Globalization;
    using System.Windows.Data;
    using System.Windows.Markup;

    namespace wpf_99
    {
        public class AmountLeftMultiConverter : MarkupExtension, IMultiValueConverter
        {
            public double Multiplier { get; set; }

            public object Convert(object[] values, Type targetType, object parameter, CultureInfo culture)
            {
                double toAdd = System.Convert.ToDouble(values[0]);
                double toSubtract = System.Convert.ToDouble(values[1]);

                return toAdd - toSubtract;
            }

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

            public override object ProvideValue(IServiceProvider serviceProvider)
            {
                return this;
            }
        }
    }

因为这也是一个markupextension,所以使用前不需要在任何资源中声明。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2013-09-16
    • 2012-01-08
    • 1970-01-01
    • 2010-10-23
    • 1970-01-01
    • 1970-01-01
    • 2021-05-07
    相关资源
    最近更新 更多