Place (Control Grid with data in it) on the original image and display it all as an image in SIlverlight:

Question

I have an image and I want to visualize the control (datgrid or any ui element with its contents) on this image and display it all as an image. Please, help.

I found some similar link, therefore, just looking at his answer, but didn't help. Silverlight: create an image from silverlight controls

Thanks in advance.:)

Answer 1

, -, framework ( , , , ,...

, , ImageSource, , - .

: - , , , .

, , GridCombiner , DataGridMyData ImageBackground .

, , , , .

public ImageSource ToImageSource(FrameworkElement obj) // FOR WPF
    {
        // Save current canvas transform
        Transform transform = obj.LayoutTransform;
        obj.LayoutTransform = null;

        // Get the size of canvas
        Size size = new Size(obj.Width, obj.Height);

        // force control to Update
        obj.Measure(size);
        obj.Arrange(new Rect(size));

        RenderTargetBitmap bmp = new RenderTargetBitmap(
            (int)obj.Width, (int)obj.Height, 96, 96, PixelFormats.Pbgra32);

        bmp.Render(obj);

        // return values as they were before
        obj.LayoutTransform = transform;
        return bmp;
    }


public ImageSource ToImageSource(FrameworkElement obj) // FOR SILVERLIGHT
    {
        // Save current canvas transform
        Transform transform = obj.RenderTransform;
        obj.RenderTransform = null;

        // Get the size of canvas
        Size size = new Size(obj.Width, obj.Height);

        // force control to Update
        obj.Measure(size);
        obj.Arrange(new Rect(new Point(), size));

        WriteableBitmap bmp = new WriteableBitmap(obj, transform);

        bmp.Render(obj, transform);

        // return values as they were before
        obj.RenderTransform = transform;
        return bmp;
    }

xaml :

<Grid x:Name="GridCombiner" Width="300" Height="150">
<Image x:Name="ImageBackground" Source="c:/myimg.jpg" Width="300" Height="150" />
<DataGrid x:Name="DataGridMyData" ItemsSource="{Binding}" Width="300" Height="150" />
</Grid>