WPF：处理图像

发布于 2024-11-03 08:16:22 字数 1559 浏览 0 评论 0原文

我想创建以下功能：我希望能够在窗口上显示图像（如果提供）或线性渐变画笔（如果图像不存在）。我想出了两种方法：

创建 Border 并将 ImageBrush 应用于边框 Background 属性，如果提供了图像Uri，如果没有提供LinearGradientBrush。这很容易实现：视图模型将通过图像提供边框背景属性画笔或线性渐变画笔。但有一个大问题：如果图像尺寸不适合边框尺寸，图像变形，这是我希望避免的。是有一种方法可以设置 ImageBrush 并保留图像尺寸比率，即应用类似 Stretch = Stretch.Uniform?

创建一个边框和一个图像在里面。然后，创建数据触发器边框，如果图像 Uri（视图模型中的属性）为 null，则设置边框的 Background 为 LinearGradientBrush 并将其留空，如果否则。我尝试创建这个，但数据触发器从未理解 null 案件。 Image 也存在问题，因为如果提供了 null ImageSource 属性，抛出异常。代码如下所示：

<边框宽度=“130”高度=“170”>
  <边框.样式>
    <样式TargetType =“边框”>
      <样式.触发器>
        
          
            <设置器.值>
              
                
                
              
            
          
        
      
    
  
  <图像名称=“图像”拉伸=“统一”>
    <图像.来源>
      <位图图像 
          DecodePixelWidth =“{绑定元素名称=图像，路径=宽度}” 
          UriSource="{绑定路径=图像}" />

实现此类功能的最佳和最简单的方法是什么？谢谢。

原文

I want to create the following functionality: I want to be able to show an image on a window, if it is provided, or a linear gradient brush if the image is not present. I came up with two approaches:

To create a Border and to apply ImageBrush to the border Background property if
the image Uri is provided, or LinearGradientBrush if not. This is easy to
implement: The view model would supply the border background property either with image
brush or linear gradient brush. But there's one big problem: if the image dimensions
don't fit the border size, the image is deformed which is something I wish to avoid. Is
there a way to set ImageBrush and to preserve the image dimensions ratio, i.e. to
apply something like Stretch = Stretch.Uniform?

To create a Border and an Image inside of it. Then, to create a data trigger for
the border, and if the image Uri (a property from the view model) is null, to set
the Background of the border to LinearGradientBrush and to leave it blank if
otherwise. I tried creating this, but the data trigger never understood the null
case. There is also a problem with the Image because if null is provided for
ImageSource property, an exception is thrown. The code looks like this:

<Border Width="130" Height="170">
  <Border.Style>
    <Style TargetType="Border">
      <Style.Triggers>
        <DataTrigger Binding="{Binding Image}" Value="{x:Null}">
          <Setter Property="Background">
            <Setter.Value>
              <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                <GradientStop Color="#696969" Offset="0.0" />
                <GradientStop Color="#2E2E2E" Offset="1.0" />
              </LinearGradientBrush>
            </Setter.Value>
          </Setter>
        </DataTrigger>
      </Style.Triggers>
    </Style>
  </Border.Style>
  <Image Name="image" Stretch="Uniform">
    <Image.Source>
      <BitmapImage 
          DecodePixelWidth="{Binding ElementName=image, Path=Width}" 
          UriSource="{Binding Path=Image}" />
    </Image.Source>
  </Image>
</Border>

What is the best and the easiest way to implement such functionality? Thanks.

分享到QQ

分享到微博