I have a FlipView control witch consists of image and text about image. I want text to be same width as image. Some of images have different dimensions than others.
Here is my XAML code:
<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>
If I try to bind text to image's ActualWidth it always returns 0. Is there a way to do that?
Edit:
It looks like this:
(------------------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
But I want Grid named "textGrid" to have the same width as Image has.
Binding <Grid x:Name="textGrid" Width="{Binding ElementName=image, Path=ActualWidth}"/> leads to Grid's width always being equal to 0. Image Loaded event also returns ActualWidth as 0.