Question

我的 Windows应用商店应用中有一个ListView，它通过dataTemplateSelector选择模板。在ListView的ItemTemplate中，我有一个图像。我不想修复图像的高度和宽度，我想让它用可用空间调整自己。因此，可以在大屏幕尺寸下显示更大的图像。

以下是我的ListView XAML：

  <ListView Name="MyListView"  ItemTemplateSelector="{StaticResource MyTemplateConverter}"
                              Height="{Binding ActualHeight, ElementName=scroll, Converter={StaticResource BottomMarginConverter}}" Width="{Binding ActualWidth, Converter={StaticResource GVWIdthConverter}, ElementName=scroll}"
                              Grid.Column="1" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Tapped="MyGridView_Tapped">
                        <ListView.ItemsPanel>
                            <ItemsPanelTemplate>
                                <VirtualizingStackPanel Orientation="Horizontal" VerticalAlignment="Stretch" />
                            </ItemsPanelTemplate>
                        </ListView.ItemsPanel>
                        <ListView.ItemContainerStyle>
                            <Style TargetType="ListViewItem">
                                <Setter Property="VerticalContentAlignment" Value="Stretch" />
                                <Setter Property="Margin" Value="0,5,0,5" />
                                <Setter Property="Background" Value="LightCyan" />
                                <Setter Property="BorderBrush" Value="Black" />
                                <Setter Property="BorderThickness" Value="3" />
                            </Style>
                        </ListView.ItemContainerStyle>
                    </ListView>

我已将 VerticalContentAlignment 设置为 Stretch ，这会将 ListViewItem 拉伸到 ListView 的大小，但是问题是当Item内的图像更大时，它会增加 ListViewItem 的大小 ListView 。我还尝试通过添加

在上面的代码中设置 ListViewItem 的高度

<Setter Property="Height" Value="{Binding ActualHeight, ElementName=MyGridView}" />

以下是我的ItemTemplate的代码，它是通过ItemTemplateSelector选择的，

<DataTemplate x:Key="PhotoTemplate">
        <Grid x:Name="PhotoTemplateGrid" Width="400" Margin="2"  Background="LightPink" >

            <Grid.RowDefinitions>
                <RowDefinition Height="90"/>
                <RowDefinition Height="*"/>
                <RowDefinition Height="50"/>

            </Grid.RowDefinitions>

            <Grid  Grid.Row="0" Margin="5" HorizontalAlignment="Stretch"  >
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="90" />
                        <ColumnDefinition Width="*" />
                    </Grid.ColumnDefinitions>

                    <Image Grid.Column="0" Source="{Binding from.photoUrl}" Height="70" HorizontalAlignment="Center"  VerticalAlignment="Center"  Width="70" />

                    <StackPanel Orientation="Vertical" Margin="10,10,0,0"  Grid.Column="1" HorizontalAlignment="Left" VerticalAlignment="Top">
                        <TextBlock Grid.Column="1" Text="{Binding from.Name}" Style="{StaticResource SubHeaderText}"  VerticalAlignment="Top"  
                            IsHitTestVisible="false" TextWrapping="NoWrap" Foreground="{StaticResource StalkerBlueThemeBrush}" />
                        <TextBlock Text="{Binding created_Time, Converter={StaticResource TextDateConverter}}" Margin="0,0,0,0" Style="{StaticResource BaselineTextStyle}"  VerticalAlignment="Top"  
                            IsHitTestVisible="false" TextWrapping="NoWrap"  FontSize="12" />
                    </StackPanel>

                </Grid>

            <Grid Grid.Row="1" >
                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto" />
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="*"   />
                </Grid.RowDefinitions>

                <TextBlock Grid.Row="0" Margin="5,0,5,0" TextAlignment="Center" MaxHeight="40" HorizontalAlignment="Stretch" Text="{Binding message}"  Style="{StaticResource BaselineTextStyle}"
                        TextTrimming="WordEllipsis" IsHitTestVisible="false" TextWrapping="Wrap" VerticalAlignment="Center"  />

                <TextBlock Grid.Row="1" MaxHeight="20" Margin="5,0,5,0" TextAlignment="Center" Text="{Binding description}" Style="{StaticResource BaselineTextStyle}"
                    TextTrimming="WordEllipsis" IsHitTestVisible="false" TextWrapping="Wrap" VerticalAlignment="Center" HorizontalAlignment="Stretch"   />

                <Image Grid.Row="2" VerticalAlignment="Center" HorizontalAlignment="Center" Stretch="Uniform" Source="{Binding picture}" Margin="2"     />

            </Grid>

            <Grid Grid.Row="2" Background="LightGray" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" >
                    <Grid.RowDefinitions>
                        <RowDefinition Height="15" />
                        <RowDefinition Height="*"/>
                    </Grid.RowDefinitions>
                    <Grid Grid.Row="0" Height="Auto" Background="White" >
                        <Polygon Points="15,0 0,15 30,15" Stroke="LightGray" Fill="LightGray" Margin="20,0,0,0" />
                    </Grid>
                    <Grid Grid.Row="1" HorizontalAlignment="Stretch">

                        <TextBlock HorizontalAlignment="Left" VerticalAlignment="Center" Margin="5,0,0,0" Text="View all comments" Style="{StaticResource BaselineTextStyle}" Foreground="{StaticResource BlueThemeBrush}" />

                        <StackPanel  Orientation="Horizontal" HorizontalAlignment="Right" Margin="0,0,5,0">

                            <Image Height="15" VerticalAlignment="Center" HorizontalAlignment="Stretch" Margin="0,0,0,0"  Width="25" Source="ms-appx:///Assets/CtBlueSmall.png" />
                            <TextBlock  HorizontalAlignment="Center" VerticalAlignment="Center" Margin="0,0,0,0" TextWrapping="NoWrap" TextTrimming="WordEllipsis" Text="{Binding CtCount}" Foreground="White"   />
                            <Image  Height="15" VerticalAlignment="Center" HorizontalAlignment="Stretch" Margin="0,0,0,0" Width="25" Source="ms-appx:///Assets/LeBlueSmall.png" />
                            <TextBlock  HorizontalAlignment="Center" VerticalAlignment="Center" Margin="0,0,0,0" TextWrapping="NoWrap" TextTrimming="WordEllipsis" Text="{Binding LeCount}" Foreground="White"   />

                        </StackPanel>
                    </Grid>
                </Grid>
        </Grid>
    </DataTemplate>

行号1 <Grid Grid.Row="1" >处的网格，包含使高度大于ListView的图像。我想允许此Grid将其自身扩展到其父级的大小。但不要超过其父母的规模。换句话说，我只想将其高度绑定到其父级。请帮帮我，我被困在这里。

Answer 1

您是否尝试将应用于该图片的行定义更改为“自动”？ <Grid Grid.Row="1"> <Grid.RowDefinitions> <RowDefinition Height="Auto" /> <RowDefinition Height="Auto"/> <RowDefinition Height="Auto"/> </Grid.RowDefinitions>

Answer 2

我已经设法通过将Height中的Grid的{{1}}绑定到DataTemplate的{{1}}，在我自己的项目中解决了这个问题。如果绑定在ActualHeight样式中作为setter，我似乎无法工作。

ListView

将ListViewItem的高度从dataTemplate绑定到ListView

2 个答案: