のImageButton：ボタンが

Question

を無効にして、私は、次のような単純なImageButtonを実装するために、ユーザーコントロールを作成した際に画像が表示されていません。

<UserControl x:Class="MyApp.Common.Controls.ImageButton" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     Name="UC"> 
<Grid> 
    <Button Command="{Binding ElementName=UC, Path=Command}" CommandParameter="{Binding ElementName=UC, Path=CommandParameter}"> 
     <StackPanel Orientation="Horizontal"> 
      <Image Source="{Binding ElementName=UC, Path=Image}" 
        Width="{Binding ElementName=UC, Path=ImageWidth}" 
        Height="{Binding ElementName=UC, Path=ImageHeight}"/> 
      <TextBlock Text="{Binding ElementName=UC, Path=Text}" /> 
     </StackPanel> 
    </Button> 
</Grid> 

をここでは、私のコントロールのコードビハインドである：

using System.Windows; 
using System.Windows.Controls; 
using System.Windows.Input; 
using System.Windows.Media; 

namespace MyApp.Common.Controls 
{ 
    public partial class ImageButton : UserControl 
    { 
     public ImageButton() 
     { 
      InitializeComponent(); 
     } 

     public ImageSource Image 
     { 
      get { return (ImageSource)GetValue(ImageProperty); } 
      set { SetValue(ImageProperty, value); } 
     } 

     public static readonly DependencyProperty ImageProperty = 
      DependencyProperty.Register("Image", typeof(ImageSource), typeof(ImageButton), new UIPropertyMetadata(null)); 

     public double ImageWidth 
     { 
      get { return (double)GetValue(ImageWidthProperty); } 
      set { SetValue(ImageWidthProperty, value); } 
     } 

     public static readonly DependencyProperty ImageWidthProperty = 
      DependencyProperty.Register("ImageWidth", typeof(double), typeof(ImageButton), new UIPropertyMetadata(16d)); 


     public double ImageHeight 
     { 
      get { return (double)GetValue(ImageHeightProperty); } 
      set { SetValue(ImageHeightProperty, value); } 
     } 

     public static readonly DependencyProperty ImageHeightProperty = 
      DependencyProperty.Register("ImageHeight", typeof(double), typeof(ImageButton), new UIPropertyMetadata(16d)); 


     public string Text 
     { 
      get { return (string)GetValue(TextProperty); } 
      set { SetValue(TextProperty, value); } 
     } 

     public static readonly DependencyProperty TextProperty = 
      DependencyProperty.Register("Text", typeof(string), typeof(ImageButton), new UIPropertyMetadata("")); 

     public ICommand Command 
     { 
      get { return (ICommand)GetValue(CommandProperty); } 
      set { SetValue(CommandProperty, value); } 
     } 

     public static readonly DependencyProperty CommandProperty = 
      DependencyProperty.Register("Command", typeof(ICommand), typeof(ImageButton)); 



     public object CommandParameter 
     { 
      get { return GetValue(CommandParameterProperty); } 
      set { SetValue(CommandParameterProperty, value); } 
     } 

     public static readonly DependencyProperty CommandParameterProperty = 
      DependencyProperty.Register("CommandParameter", typeof(object), typeof(ImageButton)); 
    } 
} 

使い方は簡単です：

  <cc:ImageButton Command="{Binding SearchCommand}" 
       Image="/MyApp;component/Images/magnifier.png"  
       ImageWidth="16" ImageHeight="16"   
         /> 

ボタン（私のViewModelのDelegateCommandにバインドされている）が無効になると、画像は消えます。それ以外の場合は、すべて正常に動作します。 何が問題になりますか？ 無効にした場合に画像をグレースケールで表示する方法は？

UPDATEは：

Answer 1

提供していたコードをコピーして、問題が再現できるかどうか確認しました。残念ながら、コマンドが無効になったとき（またはCanExecuteが返されたときはfalse）、私が使用したイメージは消えませんでした。関連性があると思われるコードをViewModelから提供してください。無効になったときにグレースケールで映像ショーを作るためにどのよう

：あなたの質問の後半部分に答えるために

？

私が知る限り、WPFで画像を彩度を下げる簡単な方法はありません。代わりに、私は@Vovaが画像のOpacityプロパティを下げることを提案しているアプローチに行きます。私は、ボタンのIsEnabledプロパティがfalseと等しい場合は、画像の不透明度を変更する画像のStyleプロパティにDataTriggerを追加上記のコードでは

<UserControl x:Class="MyApp.Common.Controls.ImageButton" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     Name="UC"> 
    <Grid> 
     <Button Command="{Binding ElementName=UC, Path=Command}" CommandParameter="{Binding ElementName=UC, Path=CommandParameter}"> 

      <StackPanel Orientation="Horizontal"> 
       <Image Source="{Binding ElementName=UC, Path=Image}" 
        Width="{Binding ElementName=UC, Path=ImageWidth}" 
        Height="{Binding ElementName=UC, Path=ImageHeight}"> 
        <Image.Style> 
         <Style TargetType="{x:Type Image}"> 
          <Style.Triggers> 
           <DataTrigger Binding="{Binding Path=IsEnabled, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Button}} }" Value="false" > 
            <Setter Property="Opacity" Value="0.3" /> 
           </DataTrigger> 
          </Style.Triggers> 
         </Style> 
        </Image.Style> 
       </Image> 
       <TextBlock Text="{Binding ElementName=UC, Path=Text}" /> 
      </StackPanel> 
     </Button> 
    </Grid> 
</UserControl> 

を：あなたはとても似て、あなたのUserControlのXAMLを変更することができます。

希望すると便利です。

Answer 2

は、私は、それカスタムコントロールを作るProperty =isEnabled value=falseでそれのためのトリガーになるだろう。ここでは、この奇妙な行動の画像です。画像の上に、ある不透明度のグリッドを追加し、そのトリガーで不透明度または可視性を制御します。がんばろう。私はもっ​​と簡単な方法はないと思う。

Answer 3

前述のとおり、WPFには彩度のサポートが組み込まれていませんが、shader effectを使用すると簡単に実装できます。このリンクをクリックすると、エフェクトをXAMLのみで使用できるようになります。

HLSLで書かれたシェーダをコンパイルする必要があり、コンパイルするにはDirect X SDKが必要です。そのような小さい仕事のためのかなりの獣、認められた。