如何将wpf的Image Source属性设置为canvas而不是image url？

时间：2014-04-02 05:46:00

标签： c# wpf 

<Canvas x:Key="myCanvas" 
    MinHeight="30" MinWidth="30" Clip="F1 M 0,0L 48,0L 48,48L 0,48L 0,0" >
    <Path Data="F1M1737.61,7339.85C1720.49,7342.44 1709.83,7334.36 1709.83,7334.36  1701.44,7341.47 1682.84,7340.17 1682.84,7340.17 1682.66,7388.31 1709.83,7397.03 1709.83,7397.03 1741.17,7386.37 1737.61,7339.85 1737.61,7339.85 M1709.54,7386.88C1707.5,7386.88 1705.85,7385.23 1705.85,7383.18 1705.85,7381.14 1707.5,7379.49 1709.54,7379.49 1711.58,7379.49 1713.23,7381.14 1713.23,7383.18 1713.23,7385.23 1711.58,7386.88 1709.54,7386.88 M1712.37,7367.58C1712.37,7367.58 1712.28,7370.72 1710.94,7372.06 1710.94,7372.06 1709.33,7373.48 1707.54,7371.61 1707.54,7371.61 1707.09,7370.31 1706.47,7366.75L1705.48,7352.56 1705.48,7348.72C1705.48,7348.72 1705.59,7345.14 1709.61,7344.51 1709.61,7344.51 1713.36,7344.34 1713.53,7348.27 1713.53,7348.27 1713.98,7352.56 1712.37,7367.58" Stretch="Uniform" Fill="#FFF1A603" Width="26" Height="26" Margin="0,0,0,0" RenderTransformOrigin="0.5,0.5">
        <Path.RenderTransform>
            <TransformGroup>
                <TransformGroup.Children>
                    <RotateTransform Angle="0" />
                    <ScaleTransform ScaleX="1" ScaleY="1" />
                </TransformGroup.Children>
             </TransformGroup>
        </Path.RenderTransform>
    </Path>
</Canvas>

如何将wpf的Image Source属性设置为canvas而不是image url？

像这样的东西

<Image Source"{StaticResource MyCanvas}"/>

4 个答案:

答案 0 :(得分：5)

您似乎有点困惑......您在问我们是否可以将Image.Source属性ImageSource设置为Canvas对象。好吧，我很确定你会知道你根本不能这样做，因为Canvas 不是 a ImageSource。

但是，我认为您实际希望了解的是如何在Canvas部分显示Resources。 如果就是你所追求的，那么有一个很多更简单的方法来做到这一点......你可以像ContentControl这样显示它： 

<ContentControl Content="{StaticResource myCanvas}" />

答案 1 :(得分：3)

要使用图像控件显示图形，可以使用DrawingImage作为图像控件的源和要显示的图形。有关详细信息，请访问here 

   <DrawingImage x:Key='Skippy'>
        <DrawingImage.Drawing>
            <GeometryDrawing Brush="#FFF1A603" Geometry="F1M1737.61,7339.85C1720.49,7342.44 1709.83,7334.36 1709.83,7334.36  1701.44,7341.47 1682.84,7340.17 1682.84,7340.17 1682.66,7388.31 1709.83,7397.03 1709.83,7397.03 1741.17,7386.37 1737.61,7339.85 1737.61,7339.85 M1709.54,7386.88C1707.5,7386.88 1705.85,7385.23 1705.85,7383.18 1705.85,7381.14 1707.5,7379.49 1709.54,7379.49 1711.58,7379.49 1713.23,7381.14 1713.23,7383.18 1713.23,7385.23 1711.58,7386.88 1709.54,7386.88 M1712.37,7367.58C1712.37,7367.58 1712.28,7370.72 1710.94,7372.06 1710.94,7372.06 1709.33,7373.48 1707.54,7371.61 1707.54,7371.61 1707.09,7370.31 1706.47,7366.75L1705.48,7352.56 1705.48,7348.72C1705.48,7348.72 1705.59,7345.14 1709.61,7344.51 1709.61,7344.51 1713.36,7344.34 1713.53,7348.27 1713.53,7348.27 1713.98,7352.56 1712.37,7367.58"/>
        </DrawingImage.Drawing>
    </DrawingImage>

 <Image Source="{StaticResource Skippy}"  Height="30" Width="30"/>

并且你的路径必须使用表达式混合来实现，这就是为什么它显示了像我们两个代码的Path.RenderTransform.anyway输出这样的额外内容。

<强>输出 enter image description here

答案 2 :(得分：0)

看一下this文章，我认为它描述了你想要实现的目标。

基本上，你不能将Image源直接绑定到画布上，所以这里的想法是将画布转换为图像并使用该图像而不是画布本身

int Height = (int)myCanvas.ActualHeight;
int Width = (int)myCanvas.ActualWidth;
RenderTargetBitmap bmp = new RenderTargetBitmap(Width, Height, 96, 96, PixelFormats.Pbgra32);
bmp.Render(myCanvas);

string file = filename; //asuming you pass the file as an argument

string Extension = System.IO.Path.GetExtension(file).ToLower();
BitmapEncoder encoder;            

if (Extension == ".gif") 
    encoder = new GifBitmapEncoder();            
else if (Extension == ".png")
    encoder = new PngBitmapEncoder();            
else if (Extension == ".jpg")
    encoder = new JpegBitmapEncoder();            
else
    return;

encoder.Frames.Add(BitmapFrame.Create(bmp));

using (Stream stm = File.Create(file))
{
    encoder.Save(stm);
}

答案 3 :(得分：-1)

<Path x:Key="ErrorIcon" 
    Data="F1M874.094,289.369L854.3,254.63C854.028,254.151 853.515,253.856 852.958,253.856 852.403,253.856 851.89,254.151 851.617,254.63L831.824,289.369C831.555,289.84 831.559,290.416 831.835,290.883 832.111,291.348 832.618,291.634 833.165,291.634L872.752,291.634C873.299,291.634 873.805,291.348 874.081,290.883 874.357,290.416 874.361,289.84 874.094,289.369 M855.653,287.189L850.264,287.189 850.264,282.745 855.653,282.745 855.653,287.189z M855.653,279.41L850.264,279.41 850.264,266.077 855.653,266.077 855.653,279.41z"
    Width="22" 
    Height="22" 
    Stretch="Fill" 
    Fill="Red" >
</Path>

<Path x:Key="WarningIcon" 
    Data="F1M1737.61,7339.85C1720.49,7342.44 1709.83,7334.36 1709.83,7334.36 1701.44,7341.47 1682.84,7340.17 1682.84,7340.17 1682.66,7388.31 1709.83,7397.03 1709.83,7397.03 1741.17,7386.37 1737.61,7339.85 1737.61,7339.85 M1709.54,7386.88C1707.5,7386.88 1705.85,7385.23 1705.85,7383.18 1705.85,7381.14 1707.5,7379.49 1709.54,7379.49 1711.58,7379.49 1713.23,7381.14 1713.23,7383.18 1713.23,7385.23 1711.58,7386.88 1709.54,7386.88 M1712.37,7367.58C1712.37,7367.58 1712.28,7370.72 1710.94,7372.06 1710.94,7372.06 1709.33,7373.48 1707.54,7371.61 1707.54,7371.61 1707.09,7370.31 1706.47,7366.75L1705.48,7352.56 1705.48,7348.72C1705.48,7348.72 1705.59,7345.14 1709.61,7344.51 1709.61,7344.51 1713.36,7344.34 1713.53,7348.27 1713.53,7348.27 1713.98,7352.56 1712.37,7367.58"
    Stretch="Uniform" 
    Fill="#FFF1A603" 
    Width="26" 
    Height="26" 
    Margin="0,0,0,0" RenderTransformOrigin="0.5,0.5">
</Path>

<Path x:Key="BlankIcon" 
    Data="F1M1737.61,7339.85C1720.49,7342.44 1709.83,7334.36 1709.83,7334.36 1701.44,7341.47 1682.84,7340.17 1682.84,7340.17 1682.66,7388.31 1709.83,7397.03 1709.83,7397.03 1741.17,7386.37 1737.61,7339.85 1737.61,7339.85 M1709.54,7386.88C1707.5,7386.88 1705.85,7385.23 1705.85,7383.18 1705.85,7381.14 1707.5,7379.49 1709.54,7379.49 1711.58,7379.49 1713.23,7381.14 1713.23,7383.18 1713.23,7385.23 1711.58,7386.88 1709.54,7386.88 M1712.37,7367.58C1712.37,7367.58 1712.28,7370.72 1710.94,7372.06 1710.94,7372.06 1709.33,7373.48 1707.54,7371.61 1707.54,7371.61 1707.09,7370.31 1706.47,7366.75L1705.48,7352.56 1705.48,7348.72C1705.48,7348.72 1705.59,7345.14 1709.61,7344.51 1709.61,7344.51 1713.36,7344.34 1713.53,7348.27 1713.53,7348.27 1713.98,7352.56 1712.37,7367.58"
    Stretch="Uniform" 
    Fill="Wheat" 
    Width="0" 
    Height="0" 
    Margin="0,0,0,0" RenderTransformOrigin="0.5,0.5">
</Path>  

<Canvas MinHeight="30" MinWidth="30" Clip="F1 M 0,0L 48,0L 48,48L 0,48L 0,0">
    <ContentControl>
        <ContentControl.Content>
            <MultiBinding Converter="{StaticResource ErrorToIconConverter}">
                <Binding Path="Name" Mode="OneWay" ></Binding>
            </MultiBinding>
         </ContentControl.Content>
    </ContentControl>
</Canvas>

public class ErrorToIconConverter : IMultiValueConverter
{
    public object Convert(object[] values, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
        string s = values[0].ToString();

        if (values != null && values[0] != null && values[0] != DependencyProperty.UnsetValue)
        {
            if (values[0].ToString().ToLower().Contains("warn"))
            {
                return Application.Current.FindResource("WarningIcon");
            }
            else if(values[0].ToString().ToLower().Contains("fatal"))
            {
                return Application.Current.FindResource("ErrorIcon");
            }
        }

        return Application.Current.FindResource("BlankIcon");
    }

    public object[] ConvertBack(object value, Type[] targetTypes, object parameter, System.Globalization.CultureInfo culture)
    {
        throw new NotImplementedException();
    }
}

使用Image无法实现。因此我创建了一个带有ContentControl的Canvas。现在将Content属性ContentControl设置为转换器返回的相应Path资源。

相关问题
最新问题