将图像设置为网格的最大高度

时间:2012-11-13 12:03:09

标签: windows-phone-7 xaml grid-layout

在我的XAML中,我有一个列表视图。列表视图的项模板包含一个网格。该网格有4列2行。像这样:
xaml item template

我希望左栏填充图像和图像下方的彩色条。我的核心问题是图像大部分时间都会决定项目的高度。虽然图像最大高度应该由项目的其余部分定义。最小的100(矩阵的网格MinHeight="125" - Height="25")。如果文本使项目变大,则更大。但是文本应该定义项目的高度。不是图像。

我目前的xaml如下:

<Grid MinHeight="125">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="auto" />
        <ColumnDefinition Width="2*" />
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="48" />
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="auto" />
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>
    <Grid Grid.Row="0" Grid.RowSpan="2" Grid.Column="0" Width="100">
        <Grid.RowDefinitions>
            <RowDefinition Height="auto" />
            <RowDefinition Height="25" />
        </Grid.RowDefinitions>
        <Image Grid.Row="0" Source="{Binding Path=BitmapImage}" Stretch="UniformToFill" />
        <Rectangle Grid.Row="1">
            <Rectangle.Fill>
                <SolidColorBrush Color="{Binding Path=Color}" />
            </Rectangle.Fill>
        </Rectangle>
    </Grid>
    <TextBlock Grid.Row="0" Grid.Column="1" Text="{Binding Path=Name}" FontWeight="ExtraBold" TextWrapping="Wrap" FontSize="16" />
    <TextBlock Grid.Row="1" Grid.Column="1" Text="{Binding Path=Description}" TextWrapping="Wrap" FontSize="20" />
    <TextBlock Grid.Row="0" Grid.RowSpan="2" Grid.Column="2" Text="{Binding Path=Type}" HorizontalAlignment="Center" VerticalAlignment="Center" TextWrapping="Wrap" FontSize="20" Margin="5" />
    <TextBlock Grid.Row="0" Grid.Column="3" Text="{Binding Path=Distance, Converter={StaticResource DistanceConverter}}" FontSize="16" />
    <Image Grid.Column="3" Grid.RowSpan="2" Source="/Images/appbar.next.rest.png" Stretch="Fill" Width="24" Height="24" />
</Grid>

1 个答案:

答案 0 :(得分:0)

http://darutk-oboegaki.blogspot.com/2011/07/binding-actualheight-and-actualwidth.html包含有关如何执行此操作的信息,因为在Silverlight中,ActualHeight通常会给出0的值。

从那里,如果你需要减去25个像素,你可以:

  • 编写转换器(实现System.Windows.UI.Xaml.Data.IValueConverter的对象)
  • 将转换器的实例添加到页面/窗口的资源中。
  • Converter={StaticResource MyConverter}, ConverterParameter=25添加到您的绑定中。

希望有所帮助:)