2016-10-18 2 views
1

Я хочу разбить ListBox своим ListBoxItem. Стрельба ListBox сама по себе не проблема. Кажется, проблема заключается в том, чтобы сообщить ListBoxItem использовать доступное пространство в ListBox.Strech ListBox и ListBoxItems в UWP

<Page.Content> 
    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}" Height="200"> 
     <ListBox VerticalContentAlignment="Stretch" VerticalAlignment="Stretch" Background="Green" ItemsSource="{x:Bind Path=ChessFieldList}" > 
      <ListBox.ItemTemplate> 
       <DataTemplate > 
        <StackPanel HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Background="Yellow" BorderBrush="Red" BorderThickness="3" > 
        </StackPanel> 
       </DataTemplate> 
      </ListBox.ItemTemplate> 
     </ListBox> 
    </Grid> 
</Page.Content> 

На изображении ниже показан вышеуказанный и ожидаемый результат.

enter image description here

Как можно достичь ожидаемого результата?

[править] Другим и на мой взгляд, правильное решение: Set Width and Height of ItemsControl Children

+0

Возможный дубликат [Strech ListBox/ItemsControl в UWP] (http://stackoverflow.com/questions/40094115/strech-listbox-itemscontrol-in-uwp) – AVK

+0

Нет, что касается растягивания списка - этот вопрос касается стрельбы listboxitems – Briefkasten

ответ

1

Это является общей проблемой. Все, что вам нужно сделать, это установить HorizontalContentAlignment из ListBoxItem слишком:

<ListBox Background="Green" ItemsSource="{x:Bind ChessFieldList}"> 
    <ListBox.ItemTemplate> 
     <DataTemplate> 
      <StackPanel Background="Yellow" BorderBrush="Red" BorderThickness="3" Height="50"> 
      </StackPanel> 
     </DataTemplate> 
    </ListBox.ItemTemplate> 
    <ListBox.ItemContainerStyle> 
     <Style TargetType="ListBoxItem"> 
      <Setter Property="HorizontalContentAlignment" Value="Stretch"/> 
     </Style> 
    </ListBox.ItemContainerStyle> 
</ListBox> 

Поскольку StackPanel не содержит никакого содержания, оно не будет иметь любую высоту, так что я просто добавил Height="50" к ней цель этой демонстрации.

+0

Я попытался заменить Stackpanel сеткой, так что явное значение для Height не было бы необходимым. Но это, похоже, не сработает. Нет ли решения без установки высоты? – Briefkasten

+1

@Briefkasten Сетка без какого-либо дочернего элемента имеет нулевую высоту. – Clemens

+0

@Clemens я использовал в качестве DataTemplate: <Сетка Background = "Yellow" BorderBrush = "Red" BorderThickness = "3"> Briefkasten

0

Просто добавьте

<ListBox.ItemContainerStyle> 
    <Style TargetType="ListBoxItem"> 
     <Setter Property="HorizontalContentAlignment" Value="Stretch"/> 
    </Style> 
</ListBox.ItemContainerStyle> 

Если вы используете группировку, вы должны включать в себя:

<ListView.GroupStyle> 
    <GroupStyle HidesIfEmpty="False"> 
     <GroupStyle.HeaderContainerStyle> 
      <Style TargetType="ListViewHeaderItem"> 
       <Setter Property="HorizontalContentAlignment" Value="Stretch" /> 
       <Setter Property="VerticalContentAlignment" Value="Stretch" /> 
      </Style> 
     </GroupStyle.HeaderContainerStyle> 
    </GroupStyle> 
</ListView.GroupStyle> 

Это немного больше, чем вы просили, но это мало известный метод.

Смежные вопросы