Question

我有以下页面设置，包含一个包含两列的网格视图：图像和标题。并非所有行都有图像，我试图使图像的行宽为一半。因此，对于没有图像可用的行，文本应该填满整行，而带有图像的行则显示图像行的一半，行的其余部分的标题。

我已使用MathConverter将imageWidth调整为行的实际宽度的一半，但在调整大小时（在调整主窗口大小时桌面上，在更改设备方向时在手机/平板电脑上），图像大小不会更新。 / p>

 <Page.Resources>
    <local:MathConverter x:Key="MathConverter"/>
    <ItemsPanelTemplate x:Key="Compact">
        <ItemsStackPanel/>
    </ItemsPanelTemplate>
    <DataTemplate x:Key="LargeWidthDataTemplate">
        <Border BorderThickness="0,0,0,1" HorizontalAlignment="Stretch">
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto"/>
                    <ColumnDefinition Width="*"/>
                </Grid.ColumnDefinitions>
                <Image Grid.Column="0" Source="{Binding ImageURL}" MaxWidth="{Binding ActualWidth, ElementName=gridView, Converter={StaticResource MathConverter}}" Margin="4"/>
                <TextBlock Grid.Column="1" Text="{Binding Title}" 
                               Loaded="TextBlock_Loaded" HorizontalAlignment="Stretch" TextAlignment="Left" TextWrapping="WrapWholeWords"/>
            </Grid>
        </Border>
    </DataTemplate>
</Page.Resources>

<Grid>
    <GridView x:Name="gridView" Grid.Row="2" SizeChanged="gridView_SizeChanged"
              ItemsPanel="{StaticResource Compact}" ItemTemplate="{StaticResource LargeWidthDataTemplate}">
        <GridView.ItemContainerStyle>
            <Style TargetType="GridViewItem">
                <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
                <Setter Property="VerticalContentAlignment" Value="Center"/>
            </Style>
        </GridView.ItemContainerStyle>
    </GridView>
</Grid>

Answer 1

出于ElementName绑定的目的，ActualWidth在更改时不会发布更新（由于其异步和运行时计算的性质）。不要尝试使用ActualWidth作为ElementName绑定的绑定源。如果您的方案需要基于ActualWidth进行更新，请使用SizeChanged处理程序。

有关详细信息，请参阅FrameworkElement.ActualWidth的备注。

因此，您应该能够在页面中添加属性，并且页面需要实现INotifyPropertyChanged界面。在SizeChanged事件中，我们应该能够将ActualWidth设置为属性。然后我们可以将MaxWidth属性绑定到属性。

例如：

private double myActualWidth;

public double MyActualWidth
{
    get
    {
        return myActualWidth;
    }
    set
    {
        if (myActualWidth != value)
        {
            myActualWidth = value;
            if (PropertyChanged != null)
            {
                PropertyChanged(this, new PropertyChangedEventArgs("MyActualWidth"));
            }
        }
    }
}

private void NotifyPropertyChanged(string propertyName)
{
    if (PropertyChanged != null)
    {
        PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
    }
}

public event PropertyChangedEventHandler PropertyChanged;

private void gridView_SizeChanged(object sender, SizeChangedEventArgs e)
{
    this.MyActualWidth = gridView.ActualWidth;
}

UWP GridView在更改大小时调整一列

1 个答案: