WPF同じ場所で2つのコントロールを切り替えます

Question

私がしたいことは、その中にProgressBarを含むボタンと、アイコンバーがいっぱいです、私はチェックボックス/トグルボタンのようなアイコンを持っているボタンに切り替えたい、それは複数の状態を持っています、私はそれを変更すると、コントロールを変更します。コントロールの

画像例：

OBS：コントロールはMahApps
OBS2を使用して、タイトルバーコントロールにあります。私は素晴らしいMVVM

用材料設計XAML、およびCaliburn.Microを使用しています

XAML例：

<Button FontSize="15" 
       FontWeight="Bold" 
       cal:Message.Attach="UpdateStatus" 
       ToolTip="Click here to show the update status." 
       Visibility="Visible"> 

      <ProgressBar Style="{StaticResource MaterialDesignCircularProgressBar}"      
         Value="0" 
         IsIndeterminate="True" 
         VerticalAlignment="Center" 
         HorizontalAlignment="Center" 
         Height="22" 
         Width="22" Foreground="White"/> 
     </Button> 
     <Button FontSize="15" 
       FontWeight="Bold" 
       cal:Message.Attach="Restart" 
       ToolTip="A update is scheduled, click here to restart the loader and apply the update." 
       Visibility="{Binding Path=RestartButtonVisibility, Mode=TwoWay}"> 

      <materialDesign:PackIcon Height="22" 
            Width="22" 
            Kind="Cached" 
            FontWeight="Bold"/> 
     </Button> 

をすることが可能ですそれをコンパイルする？それを達成するためのスパゲッティではない良い方法がありますか？

Answer 1

同じ場所に2つのUI要素を配置するには、Gridの中に配置することができます。同じ行/列に設定するだけです（まったく何も設定しないでください）。それで、あなたはおそらく新しいことを実装する必要がありますIValueConverterトリックを行う。

まず、どこかにあなたのローカル名前空間内のクラス：

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

. 
. 
. 

public class MyValueConverter : IValueConverter 
{ 
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture) 
    { 
     double v = (double)value; 
     if (v == 100) return Visibility.Visible; 
     return Visibility.Collapsed; 
    } 

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture) 
    { 
     //Not really necesary... 
     return 0.0; 
    } 
} 

これは、値コンバータです。これは、あなたがやりたいことのような、プロパティバインディングで使われます。

そして今、あなたのXAML：私たちは、プログレスバーの値が100の場合、Visibilityプロパティに指定された値がされる、ように、第2ボタンの可視性をバインドする値コンバータを使用

<!-- This should be atop... --> 
<Window.Resources> 
    <local:MyValueConverter x:Key="ValueConverter1"/> 
</Window.Resources> 

. 
. 
. 

<Grid> 
    <Button x:Name="Button1"> 
     <ProgressBar x:Name="ProgressBar1" Value="50" Width="100" Height="8"/> 
    </Button> 
    <Button x:Name="Button2" Visibility="{Binding Value, ElementName=ProgressBar1, Converter={StaticResource ValueConverter1}}"> 
     <StackPanel Orientation="Horizontal"> 
      <Image Source="yourIcon"/> 
      <TextBlock Text="Label for your button"/> 
     </StackPanel> 
    </Button> 
</Grid> 

Visibility.Visible、およびその逆。

Answer 2

VMのプロパティの最初のボタンの可視性を2番目のようにバインドし、それらを相互に排他的にすることができます。進行状況バーの終了時にonpropertychangedをトリガーし、あなたは良いことをする必要があります。