CODEWITHSUNDEEP
c#xamlvisual-studio-2012gridviewwindows-8
Tester
Tester

Reputation: 2967

Scale height Grid in XAML

I have the following data template in my windows 8 desktop app.

<DataTemplate x:Key="Standard250x480ItemTemplate">
        <Grid HorizontalAlignment="Left" Width="250" Height="480" Margin="0 0 0 0">
            <!--<Border Background="{StaticResource ListViewItemPlaceholderBackgroundThemeBrush}">-->
            <Border Background="#ffffff">
                <Image Source="{Binding Image}" Stretch="Uniform" AutomationProperties.Name="{Binding Title}" />
            </Border>

            <StackPanel VerticalAlignment="Bottom" Background="{StaticResource ListViewItemOverlayBackgroundThemeBrush}">
                <TextBlock TextAlignment="Center"  Padding="0 18 0 0" FontSize="25" Text="{Binding Title}" Foreground="{StaticResource ListViewItemOverlayForegroundThemeBrush}" Style="{StaticResource TitleTextStyle}" Height="60" Margin="15,0,15,0" />
                <!--<TextBlock Text="{Binding Subtitle}" Foreground="{StaticResource ListViewItemOverlaySecondaryForegroundThemeBrush}" Style="{StaticResource CaptionTextStyle}" TextWrapping="NoWrap" Margin="15,0,15,10"/>-->
            </StackPanel>
        </Grid>

    </DataTemplate>

The grid height is 480px, and thsi works well on some screens, but content in the grid id cut off in smaller screens.

How do I make the grid height to scale to fit the screen size, so that th enetire grid an all its contents fit in the screen.

The data template resides on a XAML Page with 4 rows defined. The data template resides in the 3rd row, ie, Grid.Row="2".

<Grid Style="{StaticResource LayoutRootStyle}">
        <Grid.RowDefinitions>
            <RowDefinition Height="140"/>
            <RowDefinition Height="130"/>
            <RowDefinition Height="*"/>
            <RowDefinition Height="110"/>
        </Grid.RowDefinitions>
</Grid>

I have tried setting min and max heights but it doesn't seem to work.

How do I fix this?

Upvotes: 0

Views: 771

Answers (1)

Tester
Tester

Reputation: 2967

I figured it out. I wrapped the grid and contents in a ViewBox. Worked Great. Now everything wrapped in the ViewBox scales fine to different screen resolutions.

Upvotes: 1

Related Questions