4

スクロールビューアにページの一部（すべてではない）を含める必要があるため、次のようなwinrt-xamlレイアウトがあります。

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

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

スクロールビューア内にある2番目のグリッドの列タイトルがあります。列のタイトルをグリッドの外側に配置する（外側のグリッドの最後の行に配置する）場合、内側のグリッドの列に揃えることは不可能ではないにしても困難です。しかし、それらを内側のグリッド（ScrollViewer内）に置いたままにすると、スクロールして見えなくなる可能性があります。

SO：その最初の行を所定の位置にフリーズすることは可能ですか？または、OTOHは、結局のところ、「Grid1」（外側のグリッド）の列幅を「Grid2」（内側のグリッド）の列幅とシームレスに揃えることができるのでしょうか。

アップデート

理由はわかりませんが、フアンの回答のオプション＃2を使用すると、うまく機能していません。唯一の問題は、「経度」と「色」の両方のラベルが本来あるべき場所の右側に表示されることです。他のすべてのラベルは完全に整列し、水平方向の整列プロパティは「左」に設定されているので、私はしません。これら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,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

まだ位置合わせの問題が発生しているため（上​​のグリッド列は、下のグリッド列と幅方向に常に位置合わせされるとは限りません）、要求に応じて、グリッド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>

...今、2番目の（内側の）グリッド：

<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）は同じ幅のままでなければなりません...

4

1 に答える 1

1

ケースに対して2つの異なるアプローチを試すことができます。

  1. 列のSharedSizeGroupを作成します（例として、この記事-たくさんの間にあるもの-を参照してください）

  2. 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>

これらのオプションのいずれかを使用して、目的の動作を実現できるかどうかを確認してください。幸運を！

于 2012-12-30T21:36:00.330 に答える