WPF Change Grid.ColumnSpan на триггере

Question

tl; dr: Я хочу, чтобы детализированные представления отображались в 2 столбцах, если выбрано 2 элемента, и чтобы охватить 2 столбца, если выбран только один элемент.

У меня есть DockPanel с 2 ListBoxes, установленными слева, и сеткой с двумя столбцами справа.

Когда элемент выбран в спискеBox1, я отображаю вид детали в столбце 0 сетки.

Когда элемент выбран в спискеBox2, я показываю представление деталей в столбце 1 сетки.

<DockPanel> 

     <StackPanel DockPanel.Dock="Left" Orientation="Horizontal"> 
      <ListBox x:Name="listBox1" ItemsSource="{Binding Items1}" SelectedItem="{Binding SelectedItem1}"/>      
      <ListBox x:Name="listBox2" ItemsSource="{Binding Items2}" SelectedItem="{Binding SelectedItem2}"/> 
     </StackPanel> 

     <Grid> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition Width="*" /> 
       <ColumnDefinition Width="*" /> 
      </Grid.ColumnDefinitions> 

      <ContentControl Grid.Column="0" Content="{Binding SelectedItem1}" ContentTemplateSelector="{StaticResource SelectedItemTemplateSelector}"/> 
      <ContentControl Grid.Column="1" Content="{Binding SelectedItem2}" ContentTemplateSelector="{StaticResource SelectedItemTemplateSelector}"/> 
     </Grid> 

    </DockPanel> 

Это прекрасно работает. Тем не менее, я хотел бы изменить его так, чтобы в представлении подробных данных отображались оба столбца сетки, когда в одном из списков выбран элемент, но не в другом.

Моя первая мысль заключалась в том, чтобы создать пару DataTriggers, которые изменяют ColumnSpan ContentControls на основе SelectedIndex ListBoxes.

Это прекрасно работает для представления сведений, которое обычно находится в Grid.Column = "0". Однако, это не работает для просмотра подробной информации, которая обычно живет в Grid.Column = «1», так как оригинальный номер столбца жестко:

  <ContentControl Grid.Column="0" Content="{Binding SelectedItem1}" ContentTemplateSelector="{StaticResource SelectedItemTemplateSelector}"> 
       <ContentControl.Style> 
        <Style TargetType="ContentControl"> 
         <Style.Triggers> 
          <DataTrigger Binding="{Binding ElementName=listBox2, Path=SelectedIndex}" Value="-1"> 
           <Setter Property="Grid.ColumnSpan" Value="2"/> 
          </DataTrigger> 
         </Style.Triggers> 
        </Style> 
       </ContentControl.Style> 
      </ContentControl> 

      <ContentControl Grid.Column="1" Content="{Binding SelectedItem2}" ContentTemplateSelector="{StaticResource SelectedItemTemplateSelector}"> 
       <ContentControl.Style> 
        <Style TargetType="ContentControl"> 
         <Style.Triggers> 
          <DataTrigger Binding="{Binding ElementName=listBox1, Path=SelectedIndex}" Value="-1"> 
           <!--Can't modify Grid.Column since it's hardcoded above!--> 
           <Setter Property="Grid.Column" Value="0"/> 
           <Setter Property="Grid.ColumnSpan" Value="2"/> 
          </DataTrigger> 
         </Style.Triggers> 
        </Style> 
       </ContentControl.Style> 
      </ContentControl> 

Если бы я мог создать DataTrigger, что может сделать значение сравнение с ListBox.SelectedIndex (т.е..> = 0), тогда я мог бы избежать жесткого кодирования номеров столбцов в первую очередь.

Есть ли способ сделать что-то подобное в XAML?

Answer 1

Я закончил внедрение преобразователя, описанного here.

Answer 2

Вы всегда можете спрятать скрытый элемент. пример ниже, вы просто меняете bindme на 2, и диапазон Grids изменится. Я делаю это на всех типах вещей, которые вы не можете оживить с помощью раскадровки.

< Прямоугольник х: Name = "bindme" Ширина = "0" Высота = "0" Метка = "1" />

< Сетка Grid.ColumnSpan = "{Binding Тег, ElementName = bindme}" >