xaml – ScrollViewer中是否可以有非滚动行？

发布时间：2020-12-14 05:41:45 所属栏目：Windows 来源：网络整理

导读：因为我需要在Scroll Viewer中拥有我的页面的一部分(但不是全部),所以我有一个winrt-xaml布局,如下所示： Page StackPanel Grid /Grid ScrollViewer Grid /Grid /ScrollViewer /StackPanel/Page 我有第二个网格的列标题,它位于滚动查看器中.如果我将列标题放

因为我需要在Scroll Viewer中拥有我的页面的一部分(但不是全部),所以我有一个winrt-xaml布局,如下所示：

<Page>
    <StackPanel>
        <Grid>
        </Grid>

        <ScrollViewer>
            <Grid>
            </Grid>
        </ScrollViewer>
    </StackPanel>
</Page>

我有第二个网格的列标题,它位于滚动查看器中.如果我将列标题放在网格之外(将它们放在外部网格的最后一行),则很难使它们与内部网格中的列对齐.但是,如果我将它们留在内部网格中(在ScrollViewer中),它们可以滚动到视线之外.

那么：是否可以将第一行冻结到位？或者,OTOH,毕竟是否可以让“Grid1”(外部网格)中的列宽与“Grid2”(内部网格)中的列宽无缝对齐？

UPDATE

我不明白为什么,但是在Juan的答案中使用选项#2并不是很有效.唯一的问题是“经度”和“颜色”标签都显示在它们应该的位置 – 所有其他标签完美对齐,并且它们的水平对齐属性设置为“左”,所以我不知道看看为什么这两个不合作.这是xaml：

????
????????
????????????
????????????
????????????
????????????
????????????
????????????
????????
????
????????
????????
????????
????????
????
????
????
????????
????
????团队名字
????

<TextBlock Foreground="Yellow" Grid.Row="2" Grid.Column="0" Grid.ColumnSpan="1" FontSize="28" VerticalAlignment="Center" HorizontalAlignment="Center">Title</TextBlock>
<TextBlock Foreground="Yellow" Grid.Row="2" Grid.Column="1" FontSize="28" VerticalAlignment="Center">Address</TextBlock>
<TextBlock Foreground="Yellow" Grid.Row="2" Grid.Column="3" FontSize="28" VerticalAlignment="Center" HorizontalAlignment="Left" >Latitude</TextBlock>
<TextBlock Foreground="Yellow" Grid.Row="2" Grid.Column="5" FontSize="28" VerticalAlignment="Center" HorizontalAlignment="Left">Longitude</TextBlock>
<TextBlock Foreground="Yellow" Grid.Row="2" Grid.Column="6" Grid.ColumnSpan="2" FontSize="28" VerticalAlignment="Center">Color</TextBlock>
</Grid>

????????
????????????
????????????????
????????????????
????????????????
????????????????
????????????????
????????????????
????????????????
????????????
????????????
????????????
????????????
????????????
????????????
????????????
????????????
????????????
????????????
????????????

<StackPanel Orientation="Horizontal" Grid.Row="0">
            <TextBlock x:Name="textBlockLocation1" FontSize="20" Margin="4" HorizontalAlignment="Right">Location 1</TextBlock>
            <TextBox x:Name="textBoxTitle1" Margin="4" MinWidth="200"></TextBox>
        </StackPanel>
        <StackPanel Orientation="Horizontal" Grid.Row="1">
            <TextBlock x:Name="textBlockLocation2" FontSize="20" Margin="4" HorizontalAlignment="Right">Location 2</TextBlock>
            <TextBox x:Name="textBoxTitle2" Margin="4" Width="200"></TextBox>
        </StackPanel>
        <StackPanel Orientation="Horizontal" Grid.Row="2">
            <TextBlock x:Name="textBlockLocation3" FontSize="20" Margin="4" HorizontalAlignment="Right">Location 3</TextBlock>
            <TextBox x:Name="textBoxTitle3" Margin="4" Width="200"></TextBox>
        </StackPanel>

        <StackPanel Orientation="Horizontal" Grid.Row="3">
            <TextBlock x:Name="textBlockLocation4" FontSize="20" Margin="4" HorizontalAlignment="Right">Location 4</TextBlock>
            <TextBox x:Name="textBoxTitle4" Margin="4" Width="200"></TextBox>
        </StackPanel>

        <StackPanel Orientation="Horizontal" Grid.Row="4">
            <TextBlock x:Name="textBlockLocation5" FontSize="20" Margin="4" HorizontalAlignment="Right">Location 5</TextBlock>
            <TextBox x:Name="textBoxTitle5" Margin="4" Width="200"></TextBox>
        </StackPanel>

        <StackPanel Orientation="Horizontal" Grid.Row="5">
            <TextBlock x:Name="textBlockLocation6" FontSize="20" Margin="4" HorizontalAlignment="Right">Location 6</TextBlock>
            <TextBox x:Name="textBoxTitle6" Margin="4" Width="200"></TextBox>
        </StackPanel>

        <StackPanel Orientation="Horizontal" Grid.Row="6">
            <TextBlock x:Name="textBlockLocation7" FontSize="20" Margin="4" HorizontalAlignment="Right">Location 7</TextBlock>
            <TextBox x:Name="textBoxTitle7" Margin="4" Width="200"></TextBox>
        </StackPanel>

        <StackPanel Orientation="Horizontal" Grid.Row="7">
            <TextBlock x:Name="textBlockLocation8" FontSize="20" Margin="4" HorizontalAlignment="Right">Location 8</TextBlock>
            <TextBox x:Name="textBoxTitle8" Margin="4" Width="200" LostFocus="CheckForAllRecordsValid" ></TextBox>
        </StackPanel>

        <TextBox x:Name="textBoxAddress1" Grid.Row="0" Grid.Column="1" MinWidth="240" Margin="4"></TextBox>
        <TextBox x:Name="textBoxAddress2" Grid.Row="1" Grid.Column="1" Margin="4"></TextBox>
        <TextBox x:Name="textBoxAddress3" Grid.Row="2" Grid.Column="1" Margin="4"></TextBox>
        <TextBox x:Name="textBoxAddress4" Grid.Row="3" Grid.Column="1" Margin="4"></TextBox>
        <TextBox x:Name="textBoxAddress5" Grid.Row="4" Grid.Column="1" Margin="4"></TextBox>
        <TextBox x:Name="textBoxAddress6" Grid.Row="5" Grid.Column="1" Margin="4"></TextBox>
        <TextBox x:Name="textBoxAddress7" Grid.Row="6" Grid.Column="1" Margin="4"></TextBox>
        <TextBox x:Name="textBoxAddress8" Grid.Row="7" Grid.Column="1" Margin="4" LostFocus="CheckForAllRecordsValid" ></TextBox>

        <TextBox x:Name="textBoxLatitude1" Grid.Row="0" Grid.Column="3" Margin="4" MinWidth="120"></TextBox>
        <TextBox x:Name="textBoxLatitude2" Grid.Row="1" Grid.Column="3" Margin="4" ></TextBox>
        <TextBox x:Name="textBoxLatitude3" Grid.Row="2" Grid.Column="3" Margin="4" ></TextBox>
        <TextBox x:Name="textBoxLatitude4" Grid.Row="3" Grid.Column="3" Margin="4" ></TextBox>
        <TextBox x:Name="textBoxLatitude5" Grid.Row="4" Grid.Column="3" Margin="4" ></TextBox>
        <TextBox x:Name="textBoxLatitude6" Grid.Row="5" Grid.Column="3" Margin="4" ></TextBox>
        <TextBox x:Name="textBoxLatitude7" Grid.Row="6" Grid.Column="3" Margin="4" ></TextBox>
        <TextBox x:Name="textBoxLatitude8" Grid.Row="7" Grid.Column="3" Margin="4" LostFocus="CheckForAllRecordsValid" ></TextBox>

        <TextBox x:Name="textBoxLongitude1" Grid.Row="0" Grid.Column="5" Margin="4" MinWidth="120"></TextBox>
        <TextBox x:Name="textBoxLongitude2" Grid.Row="1" Grid.Column="5" Margin="4"></TextBox>
        <TextBox x:Name="textBoxLongitude3" Grid.Row="2" Grid.Column="5" Margin="4"></TextBox>
        <TextBox x:Name="textBoxLongitude4" Grid.Row="3" Grid.Column="5" Margin="4"></TextBox>
        <TextBox x:Name="textBoxLongitude5" Grid.Row="4" Grid.Column="5" Margin="4"></TextBox>
        <TextBox x:Name="textBoxLongitude6" Grid.Row="5" Grid.Column="5" Margin="4"></TextBox>
        <TextBox x:Name="textBoxLongitude7" Grid.Row="6" Grid.Column="5" Margin="4"></TextBox>
        <TextBox x:Name="textBoxLongitude8" Grid.Row="7" Grid.Column="5" Margin="4" LostFocus="CheckForAllRecordsValid"></TextBox>

        <ComboBox x:Name="cmbxColor1" Grid.Row="0" Grid.Column="6" Margin="4,4,4" MinWidth="200" Height="36" HorizontalAlignment="Left" SelectionChanged="CmbxColor1_OnSelectionChanged"/>
        <ComboBox x:Name="cmbxColor2" Grid.Row="1" Grid.Column="6" Margin="4,4" MinWidth="200" Height="36" HorizontalAlignment="Left"/>
        <ComboBox x:Name="cmbxColor3" Grid.Row="2" Grid.Column="6" Margin="4,4" MinWidth="200" Height="36" HorizontalAlignment="Left"/>
        <ComboBox x:Name="cmbxColor4" Grid.Row="3" Grid.Column="6" Margin="4,4" MinWidth="200" Height="36" HorizontalAlignment="Left"/>
        <ComboBox x:Name="cmbxColor5" Grid.Row="4" Grid.Column="6" Margin="4,4" MinWidth="200" Height="36" HorizontalAlignment="Left"/>
        <ComboBox x:Name="cmbxColor6" Grid.Row="5" Grid.Column="6" Margin="4,4" MinWidth="200" Height="36" HorizontalAlignment="Left"/>
        <ComboBox x:Name="cmbxColor7" Grid.Row="6" Grid.Column="6" Margin="4,4" MinWidth="200" Height="36" HorizontalAlignment="Left"/>
        <ComboBox x:Name="cmbxColor8" Grid.Row="7" Grid.Column="6" Margin="4,4" MinWidth="200" Height="36" HorizontalAlignment="Left" LostFocus="CheckForAllRecordsValid" />

        <TextBlock Grid.Row="0" Grid.Column="2" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="20" Margin="7,10,6,10" >or</TextBlock>
        <TextBlock Grid.Row="1" Grid.Column="2" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="20" Margin="7,10">or</TextBlock>
        <TextBlock Grid.Row="2" Grid.Column="2" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="20" Margin="7,10">or</TextBlock>
        <TextBlock Grid.Row="3" Grid.Column="2" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="20" Margin="7,10">or</TextBlock>
        <TextBlock Grid.Row="4" Grid.Column="2" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="20" Margin="7,10">or</TextBlock>
        <TextBlock Grid.Row="5" Grid.Column="2" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="20" Margin="7,10">or</TextBlock>
        <TextBlock Grid.Row="6" Grid.Column="2" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="20" Margin="7,10">or</TextBlock>
        <TextBlock Grid.Row="7" Grid.Column="2" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="20" Margin="7,10">or</TextBlock>

        <TextBlock Grid.Row="0" Grid.Column="4" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="20" Margin="6,10">and</TextBlock>
        <TextBlock Grid.Row="1" Grid.Column="4" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="20" Margin="6,10">and</TextBlock>
        <TextBlock Grid.Row="2" Grid.Column="4" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="20" Margin="6,10">and</TextBlock>
        <TextBlock Grid.Row="3" Grid.Column="4" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="20" Margin="6,10">and</TextBlock>
        <TextBlock Grid.Row="4" Grid.Column="4" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="20" Margin="6,10">and</TextBlock>
        <TextBlock Grid.Row="5" Grid.Column="4" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="20" Margin="6,10">and</TextBlock>
        <TextBlock Grid.Row="6" Grid.Column="4" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="20" Margin="6,10">and</TextBlock>
        <TextBlock Grid.Row="7" Grid.Column="4" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="20" Margin="6,10">and</TextBlock>
    </Grid>
</ScrollViewer>

更新2

由于我仍然存在对齐问题(上面的网格列并不总是在宽度方面与下面的网格列对齐),我在这里按照要求发布我的网格XAML.首先,顶部网格：

<Grid.ColumnDefinitions>
    <ColumnDefinition Width="320"></ColumnDefinition>
        <ColumnDefinition Width="{Binding ElementName=Col1Grid2,Path=ActualWidth}"></ColumnDefinition>
        <ColumnDefinition Width="{Binding ElementName=Col2Grid2,Path=ActualWidth}"></ColumnDefinition>
        <ColumnDefinition Width="{Binding ElementName=Col3Grid2,Path=ActualWidth}"></ColumnDefinition>
        <ColumnDefinition Width="{Binding ElementName=Col4Grid2,Path=ActualWidth}"></ColumnDefinition>
        <ColumnDefinition Width="{Binding ElementName=Col5Grid2,Path=ActualWidth}"></ColumnDefinition>
        <ColumnDefinition Width="{Binding ElementName=Col6Grid2,Path=ActualWidth}"></ColumnDefinition>
    </Grid.ColumnDefinitions>
<Grid.RowDefinitions>
    <RowDefinition Height="120"></RowDefinition>
    <RowDefinition Height="Auto"></RowDefinition>
    <RowDefinition Height="Auto"></RowDefinition>
    <RowDefinition Height="Auto"></RowDefinition>
</Grid.RowDefinitions>

……现在,第二个(内部)网格：

<Grid x:Name="gridDynamicRowsParent">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="320"></ColumnDefinition>
        <ColumnDefinition x:Name="Col1Grid2" Width="Auto"></ColumnDefinition>
        <ColumnDefinition x:Name="Col2Grid2" Width="Auto" />
        <ColumnDefinition x:Name="Col3Grid2" Width="Auto"></ColumnDefinition>
        <ColumnDefinition x:Name="Col4Grid2" Width="Auto"></ColumnDefinition>
        <ColumnDefinition x:Name="Col5Grid2" Width="Auto"></ColumnDefinition>
        <ColumnDefinition x:Name="Col6Grid2" Width="*"></ColumnDefinition>
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
    <RowDefinition Height="*"></RowDefinition>
    <RowDefinition Height="*"></RowDefinition>
    <RowDefinition Height="*"></RowDefinition>
    <RowDefinition Height="*"></RowDefinition>
    <RowDefinition Height="*"></RowDefinition>
    <RowDefinition Height="*"></RowDefinition>
    <RowDefinition Height="*"></RowDefinition>
    <RowDefinition Height="*"></RowDefinition>
    </Grid.RowDefinitions>

此外,控件是“橡皮的” – 当我输入一个不够宽的值时,它们会横向扩展以适应一些额外的空间;我不希望这个 – 控件(TextBoxes)应该保持相同的宽度……

解决方法

您可以针对您的案例尝试两种不同的方法：

>为列创建一个SharedSizeGroup(see this article-在那里之间的一个 – 例如)
>为第二个网格中的列命名,并在第一个网格中设置列以将其宽度绑定到相应列的ActualWidth属性,如下所示：

<Page>
     <StackPanel>
         <Grid Name="Grid1">
            <Grid.ColumnDefinitions>
               <ColumnDefinition Width="{Binding ElementName=Col1Grid2,Path=ActualWidth}"/>
               <ColumnDefinition/>
            </Grid.ColumnDefinitions>

      <ScrollViewer>
        <Grid Name="Grid2">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Name="Col1Grid2" Width="*"/>
                    <ColumnDefinition Name="Col2Grid2" Width="Auto"/>
                </Grid.ColumnDefinitions>
      </ScrollViewer>
   </StackPanel>
 </Page>

看看您是否可以使用这些选项获得所需的行为.祝好运！

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!