2012-04-09 5 views
0

를 사용할 때 이미지는 다음과 같은 내가 간단한 ImageButton을 구현하는 UserControl을 생성 한 표시되지 않습니다 :하여 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는 :

+0

이미지와 TextBlock이 모두 사라 집니까? 아니면 그냥 이미지? – shanewwarren

+0

이미지와 텍스트가 모두 사라집니다. 첨부 스크린 샷보기 –

답변

0

제공 한 코드를 복사하여 내가 갖고있는 문제를 재현 할 수 있는지 확인하십시오. 불행하게도 명령이 사용 중지 된 경우 (또는 CanExecutefalse 인 경우) 내가 사용한 이미지가 사라지지 않았습니다. 관련성이 있다고 생각되는 코드 ViewModel에서 더 많은 코드를 제공해 주시겠습니까? 사용할 때

어떻게 그레이 스케일의 영상 쇼를 만들기 위해 :

는 질문의 두 번째 부분에 대답하려면?

내가 아는 한 WPF에서 이미지의 채도를 낮추는 쉬운 방법은 없습니다. 대신, 나는 이미지의 Opacity 속성을 낮추는 것이 @Vova가 제안한 접근 방식을 사용합니다. 당신은 당신과 같이 제공하여 UserControl을 XAML을 수정할 수 있습니다

<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> 

을 코드에서 I 버튼의 IsEnabled 속성 false 동일한 경우 이미지의 투명도를 수정하는 이미지의 Style 속성에 DataTrigger을 추가 위.

희망이 도움이됩니다.

+0

ViewModel 코드는 매우 간단합니다.\t \t 개인 부울 CanSearchAccount() \t \t { \t \t \t 반환 string.IsNullOrWhiteSpace (SearchValue)! \t \t}. 그리고 SearchAccount 메서드는 데이터베이스 호출을 수행하고 searchResults ObservableCollection을 채 웁니다. –

0

내가, 그것을 사용자 정의 컨트롤을 Property =isEnabled value=false에서 그것을위한 트리거를 만들 것 : 여기이 이상한 행동 screenshot의 이미지입니다. 이미지 위에 불투명도가있는 표를 추가하고 해당 트리거로 불투명도 또는 가시성을 제어합니다. 행운을 빕니다. 나는 쉬운 방법이 있다고 생각하지 않는다.

0

앞서 언급했듯이 WPF에는 내장 된 불포화 지원이 없지만 쉽게 구현하려면 shader effect을 사용하면됩니다. 이 링크를 사용하면 XAML만의 방식으로 효과를 사용할 수있는 구현으로 이동합니다.

HLSL로 작성된 셰이더는 컴파일해야하고 컴파일을 위해서는 컴퓨터에 Direct X SDK가 설치되어 있어야합니다. 그런 작은 일을위한 짐승.