WP7リスト姿勢Changsのは

Question

私が今までコンテンツはので、ここで私がやったこと が何であるかを画面いっぱいダイナミック充填リストを作りたい幅の問題：最初 ：デザイン

<Border BorderBrush="Black" CornerRadius="25" Margin="0,10,0,0" BorderThickness="1" Background="Aqua"> 
<Grid> 
    <Grid.ColumnDefinitions> 
    <ColumnDefinition Width="auto"/> 
    <ColumnDefinition Width="*"/> 
    <ColumnDefinition Width="auto"/> 
    </Grid.ColumnDefinitions> 
    <StackPanel Grid.Column="0" Orientation="Horizontal" HorizontalAlignment="Right" VerticalAlignment="Center"> 
    <Button Width="100" Name="RED" Height="100" Click="ButtonDec_Click"> 
    <Button.Background> 
    <ImageBrush ImageSource="/LifeCounter;component/Images/RED.png" /> 
    </Button.Background> 
    </Button> 
    </StackPanel> 
    <StackPanel Margin="10,0,0,0" Grid.Column="1" HorizontalAlignment="Center" VerticalAlignment="Center" > 
    <TextBlock Name="name" HorizontalAlignment="Center" VerticalAlignment="Center" Text="AAAAAAAAAAAAA" Foreground="{Binding color}" TextWrapping="Wrap" FontWeight="Bold" FontSize="22" /> 
    <TextBlock Name="count" HorizontalAlignment="Center" VerticalAlignment="Center" Text="CCCCC" FontWeight="Bold" TextWrapping="Wrap" FontSize="30" /> 
    </StackPanel> 
    <StackPanel Grid.Column="2" Orientation="Horizontal" HorizontalAlignment="Right" VerticalAlignment="Center"> 
    <Button Grid.Column="0" Width="100" Name="GREEN" Height="100" Click="ButtonInc_Click"> 
    <Button.Background> 
    <ImageBrush ImageSource="/LifeCounter;component/Images/Green.png" /> 
    </Button.Background> 
    </Button> 
    </StackPanel> 
</Grid> 
</Border> 

と結果でした画面を埋め、縦または横

し、それを動的にするには重要ではありませんアイテムは、単に私がデータテンプレートのリストを作った

風景の中にそれを

<ListBox Grid.Row="1" Name="countersList" HorizontalAlignment="Center" VerticalAlignment="Center" SelectionChanged="countersList_SelectionChanged"> 
    <ListBox.ItemTemplate> 
    <DataTemplate> 
    <Border BorderBrush="Black" CornerRadius="25" Margin="0,10,0,0" BorderThickness="1" Background="Aqua"> 
    <Grid> 
     <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="auto"/> 
     <ColumnDefinition Width="*"/> 
     <ColumnDefinition Width="auto"/> 
     </Grid.ColumnDefinitions> 
     <StackPanel Grid.Column="0" Orientation="Horizontal" HorizontalAlignment="Right" VerticalAlignment="Center"> 
     <Button Width="100" Name="{Binding index}" Height="100" Click="ButtonDec_Click"> 
     <Button.Background> 
     <ImageBrush ImageSource="/LifeCounter;component/Images/RED.png" /> 
     </Button.Background> 
     </Button> 
     </StackPanel> 
     <StackPanel Margin="10,0,0,0" Grid.Column="1" HorizontalAlignment="Center" VerticalAlignment="Center" > 
     <TextBlock Name="name" HorizontalAlignment="Center" VerticalAlignment="Center" Text="{Binding name}" Foreground="{Binding color}" TextWrapping="Wrap" FontWeight="Bold" FontSize="22" /> 
     <TextBlock Name="count" HorizontalAlignment="Center" VerticalAlignment="Center" Text="{Binding count}" FontWeight="Bold" TextWrapping="Wrap" FontSize="30" /> 
     </StackPanel> 
     <StackPanel Grid.Column="2" Orientation="Horizontal" HorizontalAlignment="Right" VerticalAlignment="Center"> 
     <Button Grid.Column="0" Width="100" Name="{Binding index}" Height="100" Click="ButtonInc_Click"> 
     <Button.Background> 
     <ImageBrush ImageSource="/LifeCounter;component/Images/Green.png" /> 
     </Button.Background> 
     </Button> 
     </StackPanel> 
    </Grid> 
    </Border> 
    </DataTemplate> 
    </ListBox.ItemTemplate> 
</ListBox> 

結果は、それが

ので内容ですが、私はそれを修正することができますどのように、私は画面いっぱいリストが必要でそれをラップし、リストのサイズだし、それは問題ではありませんでしたまたはポートレート

Answer 1

問題は、リストボックス内の項目が伸びていないことです。

リストボックスアイテムのサイズは、ItemTemplateではなく、ItemContainerStyleとListBoxのサイズによって決まります。

まず、リストボックスに追加します。

<ListBox HorizontalAlignment="Stretch" ...> 

リストボックス自体が水平方向に伸びていることを確認します。 Centerに設定すると、そのコンテンツ/子供の要求と同じ幅になります。

その後のListBoxにこれを追加します。

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

このItemContainerStyleは、すべてのアイテムが期待どうもありがとう、その作業として、親（ListBoxコントロールの項目パネル）