WinRT control to render XAML UIElement

Question

I am porting a WPF app into WinRT. The old app had a part where it would take something like an Image, MediaElement, a Xaml Page, etc; cast it as a UIElement; and then the recieving class would use VisualBrush to render it onto a button.

Unfortunately WinRT has no VisualBrush. I've tried setting content to UIElement etc. I also read about RenderTargetBitmap, however I don't think it would work since I also have video content.

Is there any way to make a control that accepts a UIElement and renders it correctly?

Answer 1

Depending on what you want achieve, you can just set your UIElement in the Button.Content property.

The Button.Content property can accept any UIElement.

For example, you can do the following:

MainPage.xaml

<Page ...>
<StackPanel  ...>
    <Button x:Name="myButton" Width="200" Height="200"
        HorizontalContentAlignment="Stretch"
        VerticalContentAlignment="Stretch" >

        <Button.Content>
            <local:Page2 />
        </Button.Content>
    </Button>
</StackPanel>
</Page>

Page2.xaml

<Page...>
    <Grid ...>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>

        <Grid.RowDefinitions>
            <RowDefinition Height="*"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>

        <Rectangle Fill="Red" />
        <Rectangle Fill="Yellow" Grid.Column="1"/>
        <Rectangle Fill="Blue" Grid.Row="1"/>
        <Button Content="Click Me" Grid.Row="1" Grid.Column="1" HorizontalAlignment="Center"/>
    </Grid>
</Page>

Or from the code behind:

MainPage.xaml.cs

 public sealed partial class MainPage : Page
 {
    public MainPage()
    {
        this.InitializeComponent();
        myButton.Content    = new Page2();
    }
 }