Question

我正在使用下面的代码来使当前硬编码的ColumnDefinition（336px）宽度动态化，以便它填充父/容器中的所有剩余区域。

<Page
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <Grid Height="480" Width="800">
    <ListBox Name="LatestScoresListBox" Margin="9" Background="Black">
        <ListBox.ItemTemplate>
        <DataTemplate>
            <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="64"/>
                <ColumnDefinition Width="*"/>
            </Grid.ColumnDefinitions>

            <TextBlock Grid.Column="0" Margin="4" Width="56" Height="56" Text="{Binding Text1}" TextAlignment="Center" TextWrapping="Wrap"/>

            <Grid Grid.Column="1">
                <Grid.RowDefinitions>
                <RowDefinition Height="0.5*"/>
                <RowDefinition Height="0.5*"/>
                </Grid.RowDefinitions>

                <Grid Grid.Row="0">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="336"/>
                    <ColumnDefinition Width="48"/>
                </Grid.ColumnDefinitions>

                <TextBlock Grid.Column="0" Margin="4" Text="{Binding Text2}"/>
                <TextBlock Grid.Column="1" Margin="4" Text="{Binding Text3}" TextAlignment="Center"/>
                </Grid>
                <Grid Grid.Row="1">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="336"/>
                    <ColumnDefinition Width="48"/>
                </Grid.ColumnDefinitions>

                <TextBlock Grid.Column="0" Margin="4" Text="{Binding Text4}"/>
                <TextBlock Grid.Column="1" Margin="4" Text="{Binding Text5}" TextAlignment="Center"/>
                </Grid>
            </Grid>
            </Grid>
        </DataTemplate>
        </ListBox.ItemTemplate>
    </ListBox>
    </Grid>
</Page>

我尝试不定义宽度，将宽度定义为1 *，在TextBlock中定义宽度，也可能没有任何运气。

从代码中可以看出，父网格的区域是在扣除第一列的64px后重新生成800px。

任何人都可以给我一个线索吗？：|

由于

Answer 1

尝试在HorizontalContentAlignment="Stretch"上设置ListBox属性。

默认情况下，ListBox使用Left对齐方式对齐其所有项目。您必须将其设置为Stretch才能使ListBox允许其项目占用所有可用空间。

Answer 2

结果很简单;感谢Laurent Bugnion :)我正在TechDays 11 Switzerland观看他的“Windows Phone 7 Overview”会议。大约在第42分钟，他用他的ListBox做了我正在尝试用我的。 Blend中几乎没有点击，结果如下：）

<Page
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <Grid Height="480" Width="800">
        <ListBox Name="MyListBox" Margin="9" Background="Black">
            <ListBox.Resources>
                <Style x:Key="MyListBoxItemStyle" TargetType="ListBoxItem">
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="ListBoxItem">
                                <Grid>
                                    <ContentPresenter/>
                                </Grid>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>
            </ListBox.Resources>
            <ListBox.ItemContainerStyle>
                <StaticResource ResourceKey="MyListBoxItemStyle"/>
            </ListBox.ItemContainerStyle>
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="64"/>
                            <ColumnDefinition Width="*"/>
                        </Grid.ColumnDefinitions>

                        <TextBlock Grid.Column="0" Margin="4" Width="56" Height="56" Text="{Binding Text1}" TextAlignment="Center" TextWrapping="Wrap"/>

                        <Grid Grid.Column="1">
                            <Grid.RowDefinitions>
                                <RowDefinition Height="0.5*"/>
                                <RowDefinition Height="0.5*"/>
                            </Grid.RowDefinitions>

                            <Grid Grid.Row="0">
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="*"/>
                                    <ColumnDefinition Width="48"/>
                                </Grid.ColumnDefinitions>

                                <TextBlock Grid.Column="0" Margin="4" Text="{Binding Text2}"/>
                                <TextBlock Grid.Column="1" Margin="4" Text="{Binding Text3}" TextAlignment="Center"/>
                            </Grid>
                            <Grid Grid.Row="1">
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="*"/>
                                    <ColumnDefinition Width="48"/>
                                </Grid.ColumnDefinitions>

                                <TextBlock Grid.Column="0" Margin="4" Text="{Binding Text4}"/>
                                <TextBlock Grid.Column="1" Margin="4" Text="{Binding Text5}" TextAlignment="Center"/>
                            </Grid>
                        </Grid>
                    </Grid>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>
    </Grid>
</Page>

注意添加到ListBox内的Grid的ContentPresenter;这里发生了神奇的事情;）

使文本块扩展以填充剩余区域

2 个答案: