XAMARIN

For each of my items in the ListView, I wanted to display the title of the show and the remaining episodes. But it can be really difficult to see the label on an image. A solution I used in my previous Windows Phone app was to add a border with a background color. So I decided to use the same tip with the Frame control. <Frame Grid.Row="0" HeightRequest="22" VerticalOptions="End" BackgroundColor="#80000000" > <StackLayout Orientation="Horizontal"> <Label Grid.Row="0" Text="{Binding Title}" TextColor="#FFFFFF" Margin="5,0,0,0" LineBreakMode="TailTruncation" HorizontalOptions="StartAndExpand" FontAttributes="Bold" FontSize="Subtitle"/> <Label Grid.Row="0" Text="{Binding User.Remaining}" TextColor="#FFFFFF" Margin="0,0,5,0" HorizontalOptions="End" FontAttributes="Bold" FontSize="Subtitle" /> </StackLayout> </Frame> ...

In my App I wanted to have a view for my TV shows. As I have a WPF and Windows Phone background, I tried to set the row height on the Grid RowDefinition. <ListView ItemsSource="{Binding Shows}" VerticalOptions="FillAndExpand" > <ListView.ItemTemplate> <DataTemplate> <ViewCell> <Grid> <Grid.ColumnDefinitions> <ColumnDefinition Width="*"/> </Grid.ColumnDefinitions> <Grid.RowDefinitions> <RowDefinition Height="100"/> </Grid.RowDefinitions> <ffimageloading:CachedImage Grid.Row="0" Source="{Binding Image.Banner}" Aspect="AspectFill" RetryCount= "3" RetryDelay= "600" HeightRequest="100" DownsampleToViewSize = "true" /> <Frame Grid.Row="0" HeightRequest="20" VerticalOptions="End" Padding="0" BackgroundColor="#80000000" > <StackLayout Orientation="Horizontal"> <Label Grid.Row="0" Text="{Binding Title}" TextColor="#FFFFFF" Margin="5,0,0,0" LineBreakMode="TailTruncation" HorizontalOptions="StartAndExpand"/> <Label Grid.Row="0" Text="{Binding User.Remaining}" TextColor="#FFFFFF" Margin="0,0,5,0" HorizontalOptions="End"/> </StackLayout> </Frame> </Grid> </ViewCell> </DataTemplate> </ListView.ItemTemplate> </ListView> But the result was completely wrong. The black frame is too big and the show title is not displayed. ...