Michael_J
Topic Author
Posts: 20
Joined: 02 Apr 2014, 14:22

Resizing

15 Jan 2015, 02:30

I notice in XAML Player that if you resize the window, whatever XAML you're viewing will resize accordingly based on the windows dimensions. I can't seem to replicate this behavior based on whatever screen size the player has defined.

My assumption was to apply a scaleTransform to the XAML root via SetRenderTransform, but this doesn't seem to work.

Just as an example, what I'm trying to use is...
Noesis::Gui::ScaleTransform* xform_it;
xform_it->SetScaleX(0.5);
xform_it->SetScaleY(0.5);
uiRoot->SetRenderTransform(xform_it);
...with the scale values based on the screen dimensions and the original size of the XAML root. This doesn't seem to work though. I'm fairly certain I'm just noob-ishly overlooking the obvious here. Any help would be appreciated :)

Thanks
 
User avatar
jsantos
Site Admin
Posts: 2906
Joined: 20 Jan 2012, 17:18
Contact:

Re: Resizing

15 Jan 2015, 06:42

Hi!

Do you know about Viewbox?

Viewbox provides an easy mechanism to scale arbitrary content within a given space. By default, Viewbox stretches in both dimensions to fill the shape given to it (like most controls). But it also has a Stretch property to control how its single child gets scaled within its bounds. A second property of Viewbox, StretchDirection, controls whether you only want to use it to shrink content or enlarge content (as opposed to doing either).

Viewbox is the ideal container to make your application Resolution Independent.
<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation">
   <Grid Background="Gray" ShowGridLines="True">
      <Grid.RowDefinitions>
         <RowDefinition Height="*"/>
         <RowDefinition Height="3*"/>
         <RowDefinition Height="*"/>
      </Grid.RowDefinitions>
      <Grid.ColumnDefinitions>
         <ColumnDefinition Width="*"/>
         <ColumnDefinition Width="3*"/>
         <ColumnDefinition Width="*"/>
      </Grid.ColumnDefinitions>

      <Viewbox Grid.Column="0" Grid.Row="0" Stretch="Uniform">
         <Grid>
            <Rectangle Fill="Green" />
            <Label Content="Top left" />
         </Grid>
      </Viewbox>
      <Viewbox Grid.Column="0" Grid.Row="2" Stretch="Uniform">
         <Grid Background="Yellow">
            <Label Content="Bottom left"/>
         </Grid>
      </Viewbox>
      <Viewbox Grid.Column="2" Grid.Row="0" Stretch="Uniform">
         <Grid Background="Red">
            <Label Content="Top right"/>
         </Grid>
      </Viewbox>
      <Viewbox Grid.Column="2" Grid.Row="2" Stretch="Uniform">
         <Grid Background="Blue">
            <Label Content="Bottom right"/>
         </Grid>
      </Viewbox>
      <Viewbox Grid.Column="1" Grid.Row="1" Stretch="Uniform">
         <Grid Background="White">
            <Label Content="Center"/>
         </Grid>
      </Viewbox>
   </Grid>
</Page>
 
Michael_J
Topic Author
Posts: 20
Joined: 02 Apr 2014, 14:22

Re: Resizing

15 Jan 2015, 17:00

Yup, worked great. I put my current root canvas within the Viewbox set to uniform and shrink only and all works as expected now.

Thanks for the quick response.... :)

Who is online

Users browsing this forum: No registered users and 0 guests