在更改集合中绑定到 ActualWidth

Question

我有一个 FlipView 控件由图像和关于图像的文本组成。我希望文本与图像的宽度相同。有些图片的尺寸与其他图片不同。
这是我的 XAML 代码：

<FlipView x:Name="flipView"  HorizontalContentAlignment="Center" VerticalContentAlignment="Center" ItemsSource="{Binding ImagesWithDescriptions}">
    <FlipView.ItemTemplate>
        <DataTemplate>
            <Grid x:Name="grid" Tapped="flipView_Tapped">
                <Grid.RowDefinitions>
                    <RowDefinition Height="3*"/>
                    <RowDefinition />
                </Grid.RowDefinitions>
                <Image x:Name="image" Grid.RowSpan="2" Source="{Binding Image}"></Image>
                <Grid x:Name="textGrid" Grid.Row="1">
                    <Grid.Background>
                        <SolidColorBrush Color="Black" Opacity="0.5"/>
                    </Grid.Background>
                    <TextBlock Foreground="White" HorizontalAlignment="Left" FontSize="20" Text="{Binding Description}"/>
                </Grid>
            </Grid>
        </DataTemplate>
    </FlipView.ItemTemplate>
</FlipViewControl>

如果我尝试将文本绑定到图像的 ActualWidth 它总是 returns 0。有没有办法做到这一点？

编辑：
它看起来像这样：

(------------------FlipView width----------------------)
--------------------------------------------------------F
|          |This is Image. It's height is |            |l
|          |equals to FlipView's height,  |            |i
|          |but width depends on picture's|            |p
|          |ratio, which might differ on  |            |V
|          |some pictures.                |            |i
|          |                              |            |e
|          |                              |            |w
|          |                              |            |
|          |                              |            |h
|          |                              |            |e
|----------|------------------------------|------------|i
|This is   |where Grid named "textGrid" is|now (it's   |g
|width is  |the same as FlipView's)       |            |h
--------------------------------------------------------t

但我希望名为 "textGrid" 的 Grid 具有与图像相同的宽度。
绑定 <Grid x:Name="textGrid" Width="{Binding ElementName=image, Path=ActualWidth}"/> 导致 Grid 的宽度始终等于 0。Image Loaded 事件也 returns ActualWidth 为 0.

Answer 1

<FlipView x:Name="flipView" ItemsSource="{Binding ListTest}" HorizontalContentAlignment="Center" VerticalContentAlignment="Center" >
            <FlipView.ItemTemplate>
                <DataTemplate>
                    <Grid x:Name="grid" Background="Blue" >
                        <Grid.RowDefinitions>
                            <RowDefinition Height="3*"/>
                            <RowDefinition />
                        </Grid.RowDefinitions>
                        <Grid Grid.RowSpan="2" x:Name="image">
                            <Image  Stretch="Uniform" SizeChanged="Image_SizeChanged"  Source="{Binding Url}" ></Image>
                        </Grid>
                        <Grid   x:Name="textblockgrid" Grid.Row="1" Background="Gray">
                            <TextBlock Foreground="White" TextWrapping="Wrap"  HorizontalAlignment="Left" FontSize="20" Text="TEXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX trysffffffffffffff sdfffffffffffff dfhdffffffffffffff dfhhhhhhhhX"/>
                        </Grid>
                    </Grid>
                </DataTemplate>


                </FlipView.ItemTemplate>

        </FlipView>


    private void Image_SizeChanged(object sender, SizeChangedEventArgs e)
    {
      FlipViewItem item = (FlipViewItem) flipView.ContainerFromItem((sender as Image).DataContext);
      var text =  FindElementInVisualTree<TextBlock>(item);
        (text.Parent as Grid).Width = (sender as Image).ActualWidth;
    }
    private T FindElementInVisualTree<T>(DependencyObject parentElement) where T : DependencyObject
    {
        var count = VisualTreeHelper.GetChildrenCount(parentElement);
        if (count == 0) return null;

        for (int i = 0; i < count; i++)
        {
            var child = VisualTreeHelper.GetChild(parentElement, i);
            if (child != null && child is T)
                return (T)child;
            else
            {
                var result = FindElementInVisualTree<T>(child);
                if (result != null)
                    return result;
            }
        }
        return null;
    }

在更改集合中绑定到 ActualWidth

Binding to ActualWidth in changing collection

c#

wpf

xaml

binding

actualwidth