Page 1 of 1

UserControl ignores Height set by container (but Width is OK)

Posted: Wed Jul 31, 2019 5:36 pm
by Rourke
I have a UserControl containing a ScrollViewer. The parent container should set the Height & Width of the UserControl to limit the scrollbars. However, only the Width seems to be respected while the Height is unbounded. Sample XAML here, with result attached as an image. This behaviour is the same in the latest v1.2 beta, and version 2 beta, and in the simulator & browser. A workaround would be appreciated!

UserControl:

Code: Select all

<UserControl
    x:Class="BugTester.ScrollControl"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:BugTester">
    <UserControl.Resources>
        <Style x:Key="textStyle" TargetType="TextBlock">
            <Setter Property="FontSize" Value="24"/>
            <Setter Property="TextAlignment" Value="Center"/>
        </Style>
    </UserControl.Resources>
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="100"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="50"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <TextBlock Grid.Column="0" Grid.Row="0" Style="{StaticResource textStyle}" Background="Yellow" Text="Top Left"/>
        <TextBlock Grid.Column="1" Grid.Row="0" Style="{StaticResource textStyle}" Background="LightGreen" Text="Upper Headers"/>
        <TextBlock Grid.Column="0" Grid.Row="1" Style="{StaticResource textStyle}" Background="SkyBlue" Text="Headers"/>
        <ScrollViewer Grid.Column="1" Grid.Row="1" VerticalScrollBarVisibility="Visible" HorizontalScrollBarVisibility="Visible" Background="Beige"> <!--MaxWidth="250" MaxHeight="180"-->
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="70"/>
                    <ColumnDefinition Width="70"/>
                    <ColumnDefinition Width="70"/>
                    <ColumnDefinition Width="70"/>
                    <ColumnDefinition Width="70"/>
                    <ColumnDefinition Width="70"/>
                </Grid.ColumnDefinitions>
                <Grid.RowDefinitions>
                    <RowDefinition Height="40"/>
                    <RowDefinition Height="40"/>
                    <RowDefinition Height="40"/>
                    <RowDefinition Height="40"/>
                    <RowDefinition Height="40"/>
                    <RowDefinition Height="40"/>
                </Grid.RowDefinitions>
                <TextBlock Grid.Row="0" Grid.Column="0" Text="Diagonal 0"/>
                <TextBlock Grid.Row="1" Grid.Column="1" Text="Diagonal 1"/>
                <TextBlock Grid.Row="2" Grid.Column="2" Text="Diagonal 2"/>
                <TextBlock Grid.Row="3" Grid.Column="3" Text="Diagonal 3"/>
                <TextBlock Grid.Row="4" Grid.Column="4" Text="Diagonal 4"/>
                <TextBlock Grid.Row="5" Grid.Column="5" Text="Diagonal 5"/>
            </Grid>
        </ScrollViewer>
    </Grid>
</UserControl>


MainPage:

Code: Select all

<Page
    x:Class="BugTester.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:BugTester"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="30"/>
            <RowDefinition Height="150"/>
            <RowDefinition Height="50"/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="60"/>
            <ColumnDefinition Width="300"/>
            <ColumnDefinition Width="60"/>
        </Grid.ColumnDefinitions>
        <TextBlock Text="Hello World!" x:Name="TextBlock1" />
        <TextBlock Grid.Row="2" Grid.ColumnSpan="2" Text="This is the footer" x:Name="FooterTextBlock" Background="Lavender" />
        <Rectangle Fill="Blue" Grid.RowSpan="3" Grid.Column="2"/>
        <local:ScrollControl Grid.Row="1" Grid.Column="1" Height="150" Width="300"/>
    </Grid>
</Page>