William Melani
William Melani

Reputation: 4268

UserControl Grid get's displayed with Portrait sizing in Landscape mode

I have this XAML for a UserControl:

<UserControl x:Class="SW.Resources.Controls.HistoryProgressBox"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
d:DesignHeight="480" d:DesignWidth="480">

<Grid x:Name="LayoutRoot" Style="{StaticResource AppBackgroundStyle}">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>

    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="223" />
        <ColumnDefinition Width="223" />
        <ColumnDefinition Width="10" />
    </Grid.ColumnDefinitions>

    <TextBlock x:Name="TitleText" Style="{StaticResource TitleListItemStyle}" Text="41xxfd" TextWrapping="Wrap" Grid.ColumnSpan="2"/>
    <TextBlock x:Name="leftValue"  HorizontalAlignment="Right" Style="{StaticResource DetailListItemStyle}" Text="Category: " Grid.Row="1" Grid.Column="0"/>
    <TextBlock x:Name="rightValue" Style="{StaticResource DetailListItemValueStyle}" Text="tv" Grid.Row="1" Grid.Column="1" />
    <TextBlock x:Name="subLeftValue" HorizontalAlignment="Right" Style="{StaticResource DetailListItemStyle}" Text="Size: " Grid.Row="2" Grid.Column="0" />
    <TextBlock x:Name="subRightValue" Style="{StaticResource DetailListItemValueStyle}" Text="400MB" Grid.Row="2" Grid.Column="1"  />
    <Rectangle Fill="Red" x:Name="progressColor" Grid.RowSpan="4" Grid.Column="2"/>
</Grid>

It looks exactly as I want it to in Portrait. But in landscape, the control ends early. Ideally I would have this control stretch to cover the entire screen. Is this possible to do without having to do any extra code to handle the switch to Landscape?

Upvotes: 1

Views: 705

Answers (1)

Steve Chadbourne
Steve Chadbourne

Reputation: 6953

If you put it inside another grid on the page it should resize to fit the page.

You may want to use percentage based column widths so the columns also resize.

e.g.

<Grid.ColumnDefinitions>
    <ColumnDefinition Width="223*" />
    <ColumnDefinition Width="223*" />
    <ColumnDefinition Width="10*" />
</Grid.ColumnDefinitions>

Upvotes: 2

Related Questions