WPF - Comment appliquer un effet à une image recadrée?

Question

J'ai un Image clipsage comme ceci:

<Image Width="45" Grid.Column="0" Source="{Binding Photo}"> 
    <Image.Clip> 
     <RectangleGeometry Rect="0,0,45,55" RadiusX="8" RadiusY="8" /> 
    </Image.Clip> 
</Image> 

Comment puis-je appliquer un effet d'ombre portée à elle?

MISE À JOUR:
Comme l'a souligné Ray, la meilleure solution est celle proposée par Anderson - ayant une frontière d'emballage. Merci Anderson.

Answer 1

Cela devrait fonctionner

<Image Width="45" Grid.Column="0" Source="{Binding Photo}" 
    <Image.Clip> 
     <RectangleGeometry Rect="0,0,45,55" RadiusX="8" RadiusY="8" /> 
    </Image.Clip> 
    <Image.Effect> 
     <DropShadowEffect Color="Black" BlurRadius="20" /> 
    </Image.Effect> 
</Image> 

Je n'ai pas essayé en combinaison avec clip, cependant.

Mise à jour: Cela ne fonctionne pas (semble comme un bug?)

Je venais de le faire:

<Border Grid.Column="0" > 
    <Border.Effect> 
      <DropShadowEffect /> 
    </Border.Effect> 
    <Image Width="45" Source="{Binding Photo}" 
     <Image.Clip> 
      <RectangleGeometry Rect="0,0,45,55" RadiusX="8" RadiusY="8" /> 
     </Image.Clip> 
    </Image> 
</Border> 

Bit boiteux et vous pourriez avoir à modifier quelques-unes des largeurs pour faire Bien sûr, ils correspondent exactement, mais vous avez l'idée.

Answer 2

Je suppose que la réponse est que je dois utiliser CroppedBitmap au lieu de Image.Clip:

<Image Width="45"> 
    <Image.Source> 
     <CroppedBitmap Source="{Binding Photo}" SourceRect="0 0 45 55"/> 
    </Image.Source> 
    <Image.Effect> 
     <DropShadowEffect/> 
    </Image.Effect> 
</Image> 

et si je besoin des coins arrondis je peux entourer l'image extérieure avec une bordure et d'utiliser un ImageBrush:

<Border Width="45" Height="55" CornerRadius="10" > 
    <Border.Background> 
     <ImageBrush> 
      <ImageBrush.ImageSource> 
       <CroppedBitmap Source="profile.jpg" SourceRect="0 0 45 55"/> 
      </ImageBrush.ImageSource> 
     </ImageBrush>  
    </Border.Background> 
</Border> 

Corrigez-moi si je me trompe ou si vous pouvez le faire d'une manière plus simple. Merci!

MISE À JOUR: Apparemment, vous ne pouvez pas vous lier à la propriété Source de CroppedBitmap!

Answer 3

Cela fera l'affaire pour vous:

<Border> 
    <Border.Effect> 
    <DropShadowEffect /> 
    </Border.Effect> 
    <Image Stretch="None" Source="{Binding Photo}" > 
    <Image.Clip> 
     <RectangleGeometry Rect="0,0,45,55" RadiusX="8" RadiusY="8"/> 
    </Image.Clip> 
    </Image> 
</Border> 

Ce qui bien sûr est votre idée originale, seulement avec le DropShadowEffect appliqué à une frontière d'emballage. En raison de la façon dont les effets bitmap fonctionnent, ils s'appliquent uniquement à la partie visible de ce qui est contenu.