滚动查看器 WPF XAML 内的网格高度有问题

Question

I am having a problem with Grid height inside scrollviewer. I am binding my grid height with the scrollviewer. And if I give it the fixed height then it just breaks the layout of the grid when I run the application on different devices. Normally, grid height should increase dynamically when I add more content to it but it is just fixed and all of the content is getting shinked.

Below I have attached some part of my code.

Here is the image where the height is binded with the scrollviewer

In this image, I gave a fixed height 400 and it shows what I want

This is the image of application and it just does not have the same design as in the XAML Layout

<ScrollViewer x:Name="scrollviewer" Grid.Column="4" Grid.Row="7" Grid.ColumnSpan="7" Grid.RowSpan="20" HorizontalScrollBarVisibility="Disabled" VerticalScrollBarVisibility="Visible" VerticalContentAlignment="Stretch">

        <Grid x:Name="GridInputs" Height="400" VerticalAlignment="Stretch">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="0.5*"/>
                <ColumnDefinition Width="0.5*"/>
                <ColumnDefinition Width="0.4*"/>
                <ColumnDefinition Width="0.1*"/>
                <ColumnDefinition Width="0.1*"/>
                <ColumnDefinition Width="0.4*"/>
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="0.3*"/>
                <RowDefinition Height="0.1*"/>
                <RowDefinition Height="0.3*"/>
                <RowDefinition Height="0.1*"/>
                <RowDefinition Height="0.3*"/>
                <RowDefinition Height="0.1*"/>
                <RowDefinition Height="0.3*"/>
                <RowDefinition Height="0.1*"/>
                <RowDefinition Height="0.3*"/>
                <RowDefinition Height="0.1*"/>
                <RowDefinition Height="0.3*"/>
                <RowDefinition Height="0.1*"/>
                <RowDefinition Height="0.3*"/>
                <RowDefinition Height="0.1*"/>
                <RowDefinition Height="0.3*"/>
                <RowDefinition Height="0.1*"/>
                <RowDefinition Height="0.3*"/>
                <RowDefinition Height="0.1*"/>
                <RowDefinition Height="0.3*"/>
                <RowDefinition Height="0.1*"/>
                <RowDefinition Height="0.3*"/>
                <RowDefinition Height="0.1*"/>
                <RowDefinition Height="0.3*"/>
                <RowDefinition Height="0.1*"/>
                <RowDefinition Height="0.3*"/>
                <RowDefinition Height="0.1*"/>
                <RowDefinition Height="0.3*"/>
                <RowDefinition Height="0.1*"/>
                <RowDefinition Height="0.3*"/>
                <RowDefinition Height="0.1*"/>
                <RowDefinition Height="0.3*"/>
                <RowDefinition Height="0.1*"/>
                <RowDefinition Height="0.3*"/>
                <RowDefinition Height="0.1*"/>
                <RowDefinition Height="0.3*"/>
            </Grid.RowDefinitions>
            <!-- Row 1 -->
            <Border Grid.Column="0" Grid.Row="0" BorderBrush="Black" Grid.ColumnSpan="7" BorderThickness="1" CornerRadius="5"/>
            <!--<Viewbox Grid.Row="6"  Grid.Column="4" Grid.ColumnSpan="3" x:Name="vbLongest">-->
            <Grid Grid.Row="0"  Grid.Column="0" Grid.ColumnSpan="3">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="0.2*"/>
                    <ColumnDefinition Width="6*"/>
                    <ColumnDefinition Width="1*"/>
                    <ColumnDefinition Width="6*"/>
                </Grid.ColumnDefinitions>
                <Grid.RowDefinitions>
                    <RowDefinition Height="0.1*"/>
                    <RowDefinition Height="2*"/>
                    <RowDefinition Height="0.1*"/>
                </Grid.RowDefinitions>
                <Viewbox Grid.Column="1" Grid.Row="1" StretchDirection="DownOnly" HorizontalAlignment="Left">
                    <!--<TextBlock TextWrapping="Wrap" Text="Ground height to AHP" FontSize="5" Foreground="Black"/>-->
                    <Label Content="Ground Height to AHP Z" FontSize="20" FontWeight="Bold" HorizontalContentAlignment="Left" />
                </Viewbox>
                <Viewbox Grid.Column="3" Grid.Row="1" StretchDirection="DownOnly">
                    <Label x:Name="GroundHeight" HorizontalAlignment="Right" Content="Ground height to AHP" FontSize="20" FontWeight="Bold" Foreground="Gray"/>
                </Viewbox>
            </Grid>
            <!--</Viewbox>-->
            <Viewbox Grid.Row="0" Grid.Column="3" Margin="2">
                <TextBlock HorizontalAlignment="Center" TextWrapping="Wrap" Text="Z" FontSize="20" Foreground="Black"/>
            </Viewbox>
            <Viewbox Grid.Row="0" Grid.Column="4" Margin="2">
                <TextBlock HorizontalAlignment="Center" TextWrapping="Wrap" Text="=" FontSize="20" Foreground="Black"/>
            </Viewbox>
            <TextBox x:Name="tbGroundZ" Grid.Column="5" Grid.Row="0" Margin="2" HorizontalContentAlignment="Center" VerticalContentAlignment="Center" Text="{Binding CurrentPackage[BuckHeightZ].Value, Mode=TwoWay, UpdateSourceTrigger=LostFocus}"
                         FontSize="{Binding Path=ActualHeight, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=Grid}, Converter={StaticResource fontSizeCon}}"/>
</Grid>

Answer 1

Adding viewbox after scrollviewer and moving all of the grid into the viewbox, solved my issue. Now, I can give any fixed height and width to my grid and it does not break the design.

Viewbox stretch and scale the child elements according to the display resolution or dimensions.