CODEWITHSUNDEEP
c#wpf
ironhide391
ironhide391

Reputation: 595

How can i set wpf's Image Source property to canvas instead of image url?

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

How can i set wpf's Image Source property to canvas instead of image url ?

Something like this 

<Image Source"{StaticResource MyCanvas}"/>

Upvotes: 4

Views: 7468

Answers (4)

Heena
Heena

Reputation: 8644

To display a Drawing with an Image control,you can use a DrawingImage as the Image control's Source and the drawing you want to display.For more details visit 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"/>

and your path is must be implemented using expression blend thats why it is showing extra stuff like Path.RenderTransform.anyway output from our both code is same.

Output enter image description here

Upvotes: 3

Sheridan
Sheridan

Reputation: 69979

You seem to be somewhat confused... you are asking if we can set the Image.Source property, which is of type ImageSource to a Canvas object. Well I'm pretty sure that you would know that you simply can't do that because a Canvas is not a ImageSource.

However, what I think you are actually wanting to find out is how to display your Canvas from your Resources section. If that is what you are after, then there is a much simpler way to do that... you can just display it in a ContentControl like this:

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

Upvotes: 6

Mario Stoilov
Mario Stoilov

Reputation: 3447

Take a look at this article, I think it describes what you are trying to achieve.

Basically, you cannot tie an Image source directly to a canvas, so the idea here is to convert the canvas to an image and use that image instead of the canvas itself

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);
}

Upvotes: 0

ironhide391
ironhide391

Reputation: 595

<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();
    }
}

It cannot be achieved using Image. Therefore i created a Canvas with a ContentControl. Now set the Content property ContentControl to the appropriate Path resource returned by the converter.

Upvotes: -1

Related Questions