logo标签列表

在ScrollViewer中是否可能有一个不可滚动的行？

xamlwinrt-xamlwindows-store-appsscrollviewernon-scrolling
4

由于我需要将页面的一部分（但不是全部）放入滚动查看器中，因此我的winrt-xaml布局如下：

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

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

我有第二个网格的列标题，它在滚动查看器内。如果我将列标题放在外部网格中（将它们放在外部网格的最后一行中），则很难甚至不可能使它们与内部网格中的列对齐。但是，如果我将它们留在内部网格中（在ScrollViewer内），它们可能会滚动消失。

因此：是否可能将第一行固定在原位？或者，反之，"Grid1"（外部网格）中的列宽是否可以与"Grid2"（内部网格）中的列宽无缝对齐？

更新

我不知道为什么，但使用Juan答案中的选项#2并没有完全起作用。唯一的问题是，"Longitude"和"Color"标签显示在它们应该出现的位置的右侧 - 所有其他标签都完美对齐，并且它们的水平对齐属性设置为 "Left"，因此我不知道为什么这两个标签不能顺从。这是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,0,4" MinWidth="200" Height="36" HorizontalAlignment="Left" SelectionChanged="CmbxColor1_OnSelectionChanged"/>
        <ComboBox x:Name="cmbxColor2" Grid.Row="1" Grid.Column="6" Margin="4,4,0,4" MinWidth="200" Height="36" HorizontalAlignment="Left"/>
        <ComboBox x:Name="cmbxColor3" Grid.Row="2" Grid.Column="6" Margin="4,4,0,4" MinWidth="200" Height="36" HorizontalAlignment="Left"/>
        <ComboBox x:Name="cmbxColor4" Grid.Row="3" Grid.Column="6" Margin="4,4,0,4" MinWidth="200" Height="36" HorizontalAlignment="Left"/>
        <ComboBox x:Name="cmbxColor5" Grid.Row="4" Grid.Column="6" Margin="4,4,0,4" MinWidth="200" Height="36" HorizontalAlignment="Left"/>
        <ComboBox x:Name="cmbxColor6" Grid.Row="5" Grid.Column="6" Margin="4,4,0,4" MinWidth="200" Height="36" HorizontalAlignment="Left"/>
        <ComboBox x:Name="cmbxColor7" Grid.Row="6" Grid.Column="6" Margin="4,4,0,4" MinWidth="200" Height="36" HorizontalAlignment="Left"/>
        <ComboBox x:Name="cmbxColor8" Grid.Row="7" Grid.Column="6" Margin="4,4,0,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,6,10">or</TextBlock>
        <TextBlock Grid.Row="2" Grid.Column="2" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="20" Margin="7,10,6,10">or</TextBlock>
        <TextBlock Grid.Row="3" Grid.Column="2" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="20" Margin="7,10,6,10">or</TextBlock>
        <TextBlock Grid.Row="4" Grid.Column="2" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="20" Margin="7,10,6,10">or</TextBlock>
        <TextBlock Grid.Row="5" Grid.Column="2" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="20" Margin="7,10,6,10">or</TextBlock>
        <TextBlock Grid.Row="6" Grid.Column="2" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="20" Margin="7,10,6,10">or</TextBlock>
        <TextBlock Grid.Row="7" Grid.Column="2" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="20" Margin="7,10,6,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

由于我仍然遇到对齐问题（如上面的网格列与下面的网格列在宽度上不总是对齐），按照要求，我在这里发布我的Grid 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>

此外，控件有点“弹性”——当我输入一个超过它们宽度的值时，它们会向两侧扩展以适应一些额外的空间；但我不希望这样——控件（文本框）应该保持相同的宽度...
1个回答
1
您可以尝试两种不同的方法来解决您的问题：

  1. 为列创建共享大小组（例如：见这篇文章 - 其中有很多例子)

  2. 在第二个网格中命名列，将第一个网格中的列的宽度绑定到相应列的 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>

请尝试使用这些选项中的任何一个来获得所需的行为。祝你好运！

谢谢您选择我的答案并给予点赞。您采用了哪种方法？ - Hannish
#2 差不多可以了；但是我还有两个文本块无法对齐，出现了一些奇怪的行为。我已经更新了我的帖子/问题。 - B. Clay Shannon-B. Crow Raven
@ClayShannon，我唯一看到的问题是“Color”文本块没有左对齐，但实际上“Longitude”是左对齐的...我想它们应该是相当标准的，但尝试发布网格的列定义。 - Hannish
好的，我正在将列定义附加到我的原始帖子中。 - B. Clay Shannon-B. Crow Raven
我在两个网格和滚动视图中都添加了明确的0边距，但没有任何区别。 - B. Clay Shannon-B. Crow Raven
显示剩余2条评论
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接