WPF中的滚动条

Question

我试图在WPF中设计一个需要滚动条的页面，因为此特定页面上有很多竞争。由于需要输入不同类型的信息，因此我将不同的部分放在了不同的网格中。然后，我已经设置了ScrollViewer并将所有网格放在其中，但是当我运行它时它不起作用。这是我的代码：

<Page x:Class="uniFirstGo.AddStudent"
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
      xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
      xmlns:local="clr-namespace:mosque"
      mc:Ignorable="d" 
      d:DesignHeight="450" d:DesignWidth="800"
      Title="AddStudent">
    <ScrollViewer HorizontalScrollBarVisibility="Auto">
        <Grid Margin="0,0,0,-751">
                <Grid.RowDefinitions>
                    <RowDefinition Height="593*"/>
                    <RowDefinition Height="154*"/>
                    <RowDefinition Height="46*"/>
                    <RowDefinition Height="44*"/>
                </Grid.RowDefinitions>
                <Label Name="ChildsDetails" Content="Childs Details" HorizontalAlignment="Left" Height="24" Margin="350,10,0,0" VerticalAlignment="Top" Width="91"/>
                <Grid HorizontalAlignment="Left" Height="178" Margin="20,54,0,0" VerticalAlignment="Top" Width="770">

                    <Label x:Name="ChildsSurname" Content="Childs Surname" HorizontalAlignment="Left" Height="24" Margin="10,14,0,0" VerticalAlignment="Top" Width="97"/>
                    <TextBox x:Name="childsSurname" HorizontalAlignment="Left" Height="24" Margin="107,14,0,0" VerticalAlignment="Top" Width="145" SpellCheck.IsEnabled="True"/>
                    <Label x:Name="ChildsFirstName" Content="Childs First Name" HorizontalAlignment="Left" Height="24" Margin="276,14,0,0" VerticalAlignment="Top" Width="105"/>
                    <TextBox x:Name="childsFirstName" HorizontalAlignment="Left" Height="24" Margin="386,14,0,0" VerticalAlignment="Top" Width="155"/>
                    <Label Content="Address" HorizontalAlignment="Left" Margin="10,54,0,0" VerticalAlignment="Top" RenderTransformOrigin="-0.605,0.288" Width="97"/>
                    <TextBox HorizontalAlignment="Left" Height="23" Margin="107,54,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="468" Grid.ColumnSpan="2"/>
                    <Label Content="Date of Birth&#xD;&#xA;" HorizontalAlignment="Left" Margin="10,92,0,0" VerticalAlignment="Top" Height="25" Width="83"/>
                    <DatePicker HorizontalAlignment="Left" Margin="107,93,0,0" VerticalAlignment="Top" Width="130"/>
                    <Label Content="Postcode" HorizontalAlignment="Left" Margin="600,54,0,0" VerticalAlignment="Top" RenderTransformOrigin="0.368,-0.154"/>
                    <TextBox x:Name="childsGender_Copy" HorizontalAlignment="Left" Height="24" Margin="663,54,0,0" VerticalAlignment="Top" Width="97"/>
                    <Label Content="Age" HorizontalAlignment="Left" Margin="10,132,0,0" VerticalAlignment="Top"/>
                    <TextBox HorizontalAlignment="Left" Height="23" Margin="107,132,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="130"/>
                    <Label Content="Gender&#xD;&#xA;" HorizontalAlignment="Left" Margin="578,10,0,0" VerticalAlignment="Top" Height="26"/>
                    <CheckBox Content="Male&#xD;&#xA;" HorizontalAlignment="Left" Margin="651,16,0,0" VerticalAlignment="Top"/>
                    <CheckBox Content="Female" HorizontalAlignment="Left" Margin="702,16,0,0" VerticalAlignment="Top"/>
                </Grid>
                <Label Content="Parents Details" HorizontalAlignment="Left" Margin="350,249,0,0" VerticalAlignment="Top"/>
                <Grid HorizontalAlignment="Left" Height="201" Margin="10,280,0,0" VerticalAlignment="Top" Width="780">
                    <Label Content="Fathers Full Name&#xD;&#xA;" HorizontalAlignment="Left" Margin="10,10,0,0" VerticalAlignment="Top" Width="134" Height="28" RenderTransformOrigin="0.5,0.5"></Label>
                    <Label Content="Mothers Full Name" HorizontalAlignment="Left" Margin="10,46,0,0" VerticalAlignment="Top" Width="120" Height="29"/>
                    <TextBox HorizontalAlignment="Left" Height="23" Margin="130,15,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="138"/>
                    <TextBox HorizontalAlignment="Left" Height="23" Margin="130,52,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="138"/>
                    <Label Content="Fathers Address&#xD;&#xA;" HorizontalAlignment="Left" Margin="10,80,0,0" VerticalAlignment="Top" Width="107" Height="28"/>
                    <Label Content="Mothers Address&#xD;&#xA;" HorizontalAlignment="Left" Margin="10,113,0,0" VerticalAlignment="Top" RenderTransformOrigin="0.132,-0.154" Width="107" Height="28"/>
                    <TextBox HorizontalAlignment="Left" Height="23" Margin="130,85,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="640"/>
                    <TextBox HorizontalAlignment="Left" Height="23" Margin="130,118,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="640"/>
                    <Label Content="Fathers Phone Number&#xD;&#xA;" HorizontalAlignment="Left" Margin="283,12,0,0" VerticalAlignment="Top" Height="26"/>
                    <Label Content="Mothers Phone Number&#xA;" HorizontalAlignment="Left" Margin="283,46,0,0" VerticalAlignment="Top" Height="26"/>
                    <TextBox HorizontalAlignment="Left" Height="23" Margin="426,16,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="120"/>
                    <TextBox HorizontalAlignment="Left" Height="23" Margin="426,49,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="120"/>
                    <Label Content="Mothers Date of Birth" HorizontalAlignment="Left" Margin="554,48,0,0" VerticalAlignment="Top" RenderTransformOrigin="0.48,0.077"/>
                    <DatePicker HorizontalAlignment="Left" Margin="679,15,0,0" VerticalAlignment="Top" Width="101"/>
                    <DatePicker HorizontalAlignment="Left" Margin="679,48,0,0" VerticalAlignment="Top" Width="101"/>
                    <Label Content="Father Date of Birth&#xD;&#xA;" HorizontalAlignment="Left" Margin="554,16,0,0" VerticalAlignment="Top" Height="25"/>
                    <TextBox HorizontalAlignment="Left" Height="23" Margin="130,153,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="253"/>
                    <Label Content="Fathers Email" HorizontalAlignment="Left" Margin="10,150,0,0" VerticalAlignment="Top" Width="107"/>
                    <Label Content="Mothers Email" HorizontalAlignment="Left" Margin="405,150,0,0" VerticalAlignment="Top" Width="107"/>
                    <TextBox HorizontalAlignment="Left" Height="23" Margin="517,153,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="253"/>
                </Grid>
                <Label Content="Emergency Contact Details&#xD;&#xA;" HorizontalAlignment="Left" Margin="328,486,0,0" VerticalAlignment="Top" RenderTransformOrigin="0.895,-2.308" Height="29"/>
                <Grid HorizontalAlignment="Left" Height="82" Margin="10,520,0,0" VerticalAlignment="Top" Width="780" Grid.RowSpan="2">
                    <Label Content="Surname&#xD;&#xA;" HorizontalAlignment="Left" Margin="10,10,0,0" VerticalAlignment="Top" Width="88" Height="29"/>
                    <Label Content="Surname&#xA;" HorizontalAlignment="Left" Margin="10,44,0,0" VerticalAlignment="Top" Width="88" Height="29"/>
                    <Label Content="First Name&#xA;" HorizontalAlignment="Left" Margin="258,44,0,0" VerticalAlignment="Top" Width="88" Height="29" RenderTransformOrigin="0.114,0.448"/>
                    <Label Content="First Name&#xA;" HorizontalAlignment="Left" Margin="258,10,0,0" VerticalAlignment="Top" Width="88" Height="29"/>
                    <Label Content="Contact Number&#xD;&#xA;&#xA;" HorizontalAlignment="Left" Margin="513,44,0,0" VerticalAlignment="Top" Width="98" Height="29"/>
                    <Label Content="Contact Number&#xA;" HorizontalAlignment="Left" Margin="513,10,0,0" VerticalAlignment="Top" Width="98" Height="29"/>
                    <TextBox HorizontalAlignment="Left" Height="23" Margin="618,10,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="152"/>
                    <TextBox HorizontalAlignment="Left" Height="23" Margin="74,50,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="152"/>
                    <TextBox HorizontalAlignment="Left" Height="23" Margin="336,14,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="152"/>
                    <TextBox HorizontalAlignment="Left" Height="23" Margin="74,16,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="152"/>
                    <TextBox HorizontalAlignment="Left" Height="23" Margin="618,44,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="152"/>
                    <TextBox HorizontalAlignment="Left" Height="23" Margin="336,50,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="152"/>
                </Grid>
                <Label Content="Medical, Disability and Special Needs&#xD;&#xA;" HorizontalAlignment="Left" Margin="298,617,0,0" VerticalAlignment="Top" Height="26"/>
                <Grid HorizontalAlignment="Left" Height="145" Margin="10,648,0,0" VerticalAlignment="Top" Width="780">
                    <Label Content="Name of Surgery&#xD;&#xA;&#xD;&#xA;" HorizontalAlignment="Left" Margin="10,10,0,0" VerticalAlignment="Top" Height="34"/>
                    <TextBox HorizontalAlignment="Left" Height="23" Margin="116,12,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="175"/>
                    <Label Content="Surgery Telephone Number&#xD;&#xA;&#xD;&#xA;" HorizontalAlignment="Left" Margin="337,10,0,0" VerticalAlignment="Top" Height="34"/>
                    <TextBox HorizontalAlignment="Left" Height="23" Margin="512,12,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="258"/>
                    <Label Content="Surgery Address" HorizontalAlignment="Left" Margin="10,44,0,0" VerticalAlignment="Top" RenderTransformOrigin="0.289,-0.038" Width="100" Height="31"/>
                <TextBox HorizontalAlignment="Left" Height="23" Margin="116,49,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="654"/>
            </Grid>
        </Grid>
    </ScrollViewer>
</Page>

有人可以告诉我这里出了什么问题以及为什么滚动条不起作用？

谢谢。

Answer 1

我将您的页面设置为Content主窗口的WPF，其尺寸为300x400。这就是我得到的：

如您所见，水平滚动条可见并且工作正常，但垂直滚动条却没有。

但是请注意，由于某种原因，您已将Grid.Margin设置为异常的-751。

<Grid Margin="0,0,0,-751">

Margin中的四个数字定义如下：

<Grid Margin="left, top, right, bottom">

所以让我们举一个简单的例子。我在主窗口中有以下两个Grid控件，一个在另一个内，

<Window x:Class="StackOverflowWPF.MainWindow"
        ...
        Title="MainWindow" Height="300" Width="400">
    <Grid Margin="20" Background="LightSeaGreen">
        <Grid Margin="5, 10, 15, 20" Background="LightGoldenrodYellow"/>
    </Grid>
</Window>

设计师如下：

因此，内部网格距其容器网格的位置是5像素，顶部网格是其容器的位置10，依此类推。您得到了漂移。但是，看看将bottom设置为负数会发生什么情况。

<Grid Margin="20" Background="LightSeaGreen">
    <Grid Margin="5, 10, 15, -20" Background="LightGoldenrodYellow"/>
</Grid>

设计师：

您实际上是在告诉XAML，内部Grid可以是外部网格的外部，这违反了开始使用边距的目的。

现在让我们回到您的问题上。如果内容大于容器，则可以使用滚动条滚动内容。但是，通过说出负的边距，您是说您的网格可以在底部{em>下方处751像素，从而实质上使滚动条无用。

相反，看看将边距设置为合理的0会发生什么情况。

<Grid>
    <ScrollViewer HorizontalScrollBarVisibility="Auto">
        <Grid Margin="0,0,0,0">

输出：

Answer 2

只需在主网格中删除Margin =“ 0,0,0，-751”。

<Page x:Class="uniFirstGo.AddStudent"
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
  xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
  xmlns:local="clr-namespace:mosque"
  mc:Ignorable="d" 
  d:DesignHeight="450" d:DesignWidth="800"
  Title="AddStudent">
<ScrollViewer HorizontalScrollBarVisibility="Auto">
    <Grid>
            <Grid.RowDefinitions>....