UWP - Могу ли я привязать текстовый блок в табличке данных к ширине столбца сетки за ее пределами?

Question

Относительно новый для UWP, можно ли связать TextBlock из DataTemplate (используется для ItemTemplate в просмотре списка) со столбцом вне его, или есть какой-либо способ установить столбцы сетки DataTemplateширины к размеру ширины определения столбца "MainGrid"?Код ниже, чтобы показать то, что я пытаюсь достичь.

<Grid x:Name="MainGrid">
   <Grid.ColumnDefinitions>
       <ColumnDefinition x:Name="Column1" Width="*"/>
       <ColumnDefinition x:Name="Column2" Width="8*"/>
       <ColumnDefinition x:Name="Column3" Width="*"/>
   </Grid.ColumnDefinitions>
   <ListView Name="recordList" ItemsSource="{x:Bind _recordingList, TargetNullValue=0}">
       <ListView.ItemTemplate>
          <DataTemplate x:DataType="local:Recording">
            <Grid>
              <TextBlock Grid.Column="{Binding Column1}" Name="TextBlock_Time" Text="{x:Bind Time}"/>
              <TextBlock Grid.Column="{Binding Column2}"  Name="TextBlock_Message" Text="{x:Bind Message}"/>
              <TextBlock Grid.Column="{Binding Column3}"  Name="TextBlock_Type" Text="{x:Bind Type}"/>
            </Grid>
          </DataTemplate>
       </ListView.ItemTemplate>
   </ListView>
</Grid>

С изображением ниже, я предполагаю, что красные линии - это окно.По сути, пытается заставить столбцы адаптироваться к изменению размера окна.

пример

Answer 1

Я думаю, вы хотите, чтобы listviewitem было растянуто до размера окна.Для достижения этого вам нужно установить HorizontalContentAlignment элемента списка просмотра должен быть установлен на растянуть в ItemContainerStyle

<ListView x:Name="MessagesList" BorderThickness="1" ItemsSource="{x:Bind _recordingList, TargetNullValue=0}" BorderBrush="Black">
    <ListView.ItemContainerStyle>
        <Style TargetType="ListViewItem">
            <Setter Property="HorizontalContentAlignment"  Value="Stretch"></Setter>
            <Setter Property="Padding"  Value="0"></Setter>
        </Style>
    </ListView.ItemContainerStyle>
    <ListView.ItemTemplate>
       <DataTemplate x:DataType="local:Recording">
           <Grid BorderThickness="0,1,0,0" Padding="20" BorderBrush="{ThemeResource SystemControlForegroundBaseMediumBrush}">
              <Grid.ColumnDefinitions>
                  <ColumnDefinition Width="*" />
                  <ColumnDefinition Width="8*"/>
                  <ColumnDefinition Width="*"/>
              </Grid.ColumnDefinitions>
              <TextBlock Text="{x:Bind Time,Mode=OneWay}"></TextBlock>
              <TextBlock Grid.Column="1" Text="{x:Bind Message,Mode=OneWay}"></TextBlock>
              <TextBlock Grid.Column="2" Text="{x:Bind Type,Mode=OneWay}"></TextBlock>
           </Grid>
       </DataTemplate>
    </ListView.ItemTemplate>  
</ListView>

Answer 2

Вам просто нужно переместить ваши столбцы в сам шаблон.

DataTemplate - это схема, которая описывает, что и где.Поскольку он находится в ItemTemplate , то это означает, что он подходит для каждого элемента.

 <ListView Name="recordList" ItemsSource="{x:Bind _recordingList, TargetNullValue=0}">
        <ListView.ItemTemplate>
            <DataTemplate x:DataType="local:Recording">
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition x:Name="Column1" Width="*" />
                        <ColumnDefinition x:Name="Column2" Width="8*" />
                        <ColumnDefinition x:Name="Column3" Width="*" />
                    </Grid.ColumnDefinitions>
                    <TextBlock
                        Name="TextBlock_Time"
                        Grid.Column="0"
                        Margin="20"
                        Foreground="Red"
                        Text="{x:Bind Time}" />
                    <TextBlock
                        Name="TextBlock_Message"
                        Grid.Column="1"
                        Margin="20"
                        Foreground="Green"
                        Text="{x:Bind Message}" />
                    <TextBlock
                        Name="TextBlock_Type"
                        Grid.Column="2"
                        Margin="20"
                        Foreground="LightBlue"
                        Text="{x:Bind Type}" />
                </Grid>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>

Это должно сделать ваши элементы похожими на это.

Ознакомьтесь с документацией, поскольку она хорошо объясняет это.В шаблонах есть шаблоны.Таким образом, вы можете создать шаблон Контейнер (как он должен отображать элементы) и Предметы (как должен выглядеть каждый элемент).

Шаблоны

Помните о HorizontalAlignment = "Stretch" и т. Д., Поскольку это означает, что текстовый блок (или Grid ) будет занимать все доступное пространство (по горизонтали).Поработайте с ним, и вы поймете, как он работает.