I'm making my app adaptive for different resolutions.
I have page divided in 2 halves with Grid.RowDefinition="*", first half is green, second is red.
I'm having the problem with red part.
Big Title (text "Novice") is size "Title" and text in yellow (thumb byte testhh is font size "Small".
What I want to accomplish is for image to take all available height and set the same width and then either crop image or set Aspect="AspectFill".
Right now, image width and height are hardcoded to image (height and width are set to 210, this emulator is of resolution 1080x1920 at 420dpi)
Second image is cut off, because it's horizontal collection view, there can be any number of images with text, so it's important for them to be of the same size.
How to make this dynamic?
<Grid Padding="10">
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<StackLayout Grid.Row="0" BackgroundColor="Green">
<StackLayout Orientation="Horizontal">
<Label
Style="{StaticResource TitleLabel}"
Text="{x:Static resources:AppResources.Zahtevki}" />
<Label
HorizontalOptions="EndAndExpand"
Style="{StaticResource NearTitlelabel}"
Text="{x:Static resources:AppResources.AllTasks}"
VerticalOptions="End">
</Label>
</StackLayout>
<CollectionView EmptyView="{x:Static resources:AppResources.NoTasksAvailable}" ItemsSource="{Binding Tasks}">
<CollectionView.ItemTemplate>
<DataTemplate>
<ContentView Padding="0,0,0,0" HorizontalOptions="StartAndExpand">
<Frame Margin="0,0,0,5" Style="{StaticResource ZahtevkiUnfinishedFrame}">
<Grid Grid.Row="0" Style="{StaticResource TaskGrid}">
<Image
Grid.Column="0"
Source="alarm.png"
Style="{StaticResource IconImage}"
VerticalOptions="Center" />
<StackLayout
Grid.Column="1"
Spacing="0"
VerticalOptions="Center">
<Label
LineBreakMode="TailTruncation"
Style="{StaticResource ZahtevkiTopLabel}"
Text="{Binding Title}" />
<Label Style="{StaticResource ZahtevkiBottomLabel}" Text="{Binding Date, StringFormat='{0:dd.MM.yyyy}'}" />
</StackLayout>
</Grid>
</Frame>
</ContentView>
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>
</StackLayout>
<StackLayout Grid.Row="1" BackgroundColor="Red">
<StackLayout Orientation="Horizontal">
<Label
Margin="5,0,0,0"
Style="{StaticResource TitleLabel}"
Text="{x:Static resources:AppResources.Novice}" />
<Label
HorizontalOptions="EndAndExpand"
Style="{StaticResource NearTitlelabel}"
Text="{x:Static resources:AppResources.AllNews}"
VerticalOptions="End">
</Label>
</StackLayout>
<CollectionView
EmptyView="{x:Static resources:AppResources.NoNewsAvailable}"
IsVisible="{Binding IsBusy, Converter={StaticResource NegateBoolConverter}}"
ItemsLayout="HorizontalList"
ItemsSource="{Binding NewsList}">
<CollectionView.ItemTemplate>
<DataTemplate>
<ContentView Padding="0,0,5,0">
<StackLayout BackgroundColor="Yellow">
<forms:CachedImage
Aspect="AspectFill"
DownsampleToViewSize="True"
HeightRequest="210"
Source="{Binding files[0].Image, Converter={StaticResource Base64ToImageConverter}}"
WidthRequest="210" />
<Label
FontSize="Small"
LineBreakMode="TailTruncation"
Text="{Binding Title}"
TextColor="Black" />
</StackLayout>
</ContentView>
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>
</StackLayout>
</Grid>
Thank you all!