Develop Reference

In Xamarin Forms I Want To Overlap A Control Center On Top Of Xamarin Forms Map But Couldn’t Expand The Map Under The Control Center

In the cross-platform app that I’m developing on Xamarin Forms, I want to achieve a map look where the map covers the whole screen and a semi-transparent control center covers on top of it at a section in the bottom of the screen as in Apple Maps.
My current code looks like this. I have my desired map view and control center view but I can't get to control center to overlap on top of my map.
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:d="http://xamarin.com/schemas/2014/forms/design"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:map="clr-namespace:Xamarin.Forms.Maps;assembly=Xamarin.Forms.Maps"
xmlns:pan ="http://xamarin.com/schemas/2014/forms"
xmlns:yummy="clr-namespace:Xamarin.Forms.PancakeView;assembly=Xamarin.Forms.PancakeView"
mc:Ignorable="d"
x:Class="GreenPath.MainPage">
<Grid HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">
<Grid.RowDefinitions>
<RowDefinition Height="1.8*"/>
</Grid.RowDefinitions>
<yummy:PancakeView CornerRadius="25,25,0,0" Opacity="0.8" Grid.Row="1" HorizontalOptions="FillAndExpand">
<StackLayout VerticalOptions="FillAndExpand" Orientation="Vertical">
<Image Source="down.png" VerticalOptions="Center" HorizontalOptions="Center" Scale="1"/>
<Label Text="X" TextColor="#3E454F" FontSize="40" FontFamily="segoeui.ttf" Margin="10,0"/>
<SearchBar FontFamily="segoeui.ttf" Text="X" VerticalTextAlignment="Center" VerticalOptions="Fill" HorizontalTextAlignment="Start" IsReadOnly="True" HorizontalOptions="Fill" SearchButtonPressed="SearchBar_SearchButtonPressed" PlaceholderColor="#3E454F" TextColor="#3E454F" CancelButtonColor="#3E454F" Visual="Material" Keyboard="Default" Placeholder="Search a location" IsEnabled="True"/>
<Label Text="X" FontFamily="segoeui.ttf" FontSize="25" VerticalOptions="Center" TextColor="#3E454F" Margin="10,0"/>
<Grid Grid.Row="1" ColumnSpacing="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Image Source="add.png" VerticalOptions="Center" HorizontalOptions="Center" Scale="1" Grid.Column="0" />
<Image Source="add.png" VerticalOptions="Center" HorizontalOptions="Center" Scale="1" Grid.Column="1" />
<Image Source="add.png" VerticalOptions="Center" HorizontalOptions="Center" Scale="1" Grid.Column="2" />
<Image Source="add.png" VerticalOptions="Center" HorizontalOptions="Center" Scale="1" Grid.Column="3" />
<Image Source="add.png" VerticalOptions="Center" HorizontalOptions="Center" Scale="1" Grid.Column="4" />
</Grid>
</StackLayout>
</yummy:PancakeView>
<StackLayout VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand">
<map:Map MapType="Street" VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand"/>
</StackLayout>
</Grid>
</ContentPage>

Try putting the StackLayout that contains the map before the yummy:PancakeView (Also remove the Grid.Row="1")
It is similar at this answer.

After reading what David Jesus recomended I did what he said but unfortunately it was't the answer that I was looking for but I followed his advices and did some cahnges myself. In conclusion, I put StackLayout at the top like David said but ı didn't remove Grid.Row="1" and I added the desired height in yummy:PancakeView as TranslationY="550".
My final code is:
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:d="http://xamarin.com/schemas/2014/forms/design"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:map="clr-namespace:Xamarin.Forms.Maps;assembly=Xamarin.Forms.Maps"
xmlns:pan ="http://xamarin.com/schemas/2014/forms"
xmlns:yummy="clr-namespace:Xamarin.Forms.PancakeView;assembly=Xamarin.Forms.PancakeView"
mc:Ignorable="d"
x:Class="GreenPath.MainPage">
<Grid>
<StackLayout VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand">
<map:Map MapType="Street" VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand"/>
</StackLayout>
<yummy:PancakeView CornerRadius="25,25,0,0" Opacity="0.8" HorizontalOptions="FillAndExpand" BackgroundColor="White" TranslationY="550">
<StackLayout VerticalOptions="FillAndExpand" Orientation="Vertical" Margin="5">
<Image Source="down.png" VerticalOptions="Center" HorizontalOptions="Center" Scale="1"/>
<Label Text="X" TextColor="#3E454F" FontSize="40" FontFamily="segoeui.ttf" Margin="10,0"/>
<SearchBar FontFamily="segoeui.ttf" Text="X" VerticalTextAlignment="Center" VerticalOptions="Fill" HorizontalTextAlignment="Start" IsReadOnly="True" HorizontalOptions="Fill" SearchButtonPressed="SearchBar_SearchButtonPressed" PlaceholderColor="#3E454F" TextColor="#3E454F" CancelButtonColor="#3E454F" Visual="Material" Keyboard="Default" Placeholder="Search a location" IsEnabled="True"/>
<Label Text="X" FontFamily="segoeui.ttf" FontSize="25" VerticalOptions="Center" TextColor="#3E454F" Margin="10,0"/>
<Grid Grid.Row="1" ColumnSpacing="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Image Source="add.png" VerticalOptions="Center" HorizontalOptions="Center" Scale="1" Grid.Column="0" />
<Image Source="add.png" VerticalOptions="Center" HorizontalOptions="Center" Scale="1" Grid.Column="1" />
<Image Source="add.png" VerticalOptions="Center" HorizontalOptions="Center" Scale="1" Grid.Column="2" />
<Image Source="add.png" VerticalOptions="Center" HorizontalOptions="Center" Scale="1" Grid.Column="3" />
<Image Source="add.png" VerticalOptions="Center" HorizontalOptions="Center" Scale="1" Grid.Column="4" />
</Grid>
</StackLayout>
</yummy:PancakeView>
</Grid>
</ContentPage>

How can i make an expandable table view to work as submenus?

I created a MasterDetailPage to create menu for my cross platform aplication. Some items of the menu have submenus within. I would like to show these submenus after the user tap in the menu item.
I have a table view with multiple viewcell for each menu item but i dont know how to show submenu items.
<MasterDetailPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="KiaiDay.Views.Main.HomePage"
xmlns:pages="clr-namespace:KiaiDay.Views.Main"
xmlns:local="clr-namespace:KiaiDay.MarkupExtensions" NavigationPage.HasNavigationBar="False">
<MasterDetailPage.Master>
<pages:HomePageMaster x:Name="MasterPage" Title="Menu" NavigationPage.HasNavigationBar="False" Padding="0">
<StackLayout>
<Grid Padding="10" BackgroundColor="#456f95" HeightRequest="200" VerticalOptions="Center">
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="3*"/>
</Grid.ColumnDefinitions>
<Image Grid.Row="1" Grid.Column="0" Grid.RowSpan="2" Source="{local:ImageResource KiaiDay.Images.user.png}" BackgroundColor="Transparent" HorizontalOptions="EndAndExpand"/>
<Label Text="Kelve Neto" Grid.Row="1" Grid.Column="1" BackgroundColor="Transparent" VerticalOptions="EndAndExpand" FontSize="Medium"/>
<Label Text="10 Dias" Grid.Row="2" Grid.Column="1" BackgroundColor="Transparent" VerticalOptions="StartAndExpand" TextColor="BlueViolet" FontSize="Small" FontAttributes="Bold"/>
</Grid>
<StackLayout>
<TableView Intent="Menu">
<TableSection>
<ViewCell>
<StackLayout Padding="30,0,0,0" VerticalOptions="Center">
<StackLayout Orientation="Horizontal">
<Image Source="https://img.icons8.com/ios/50/000000/goal.png" HorizontalOptions="Start"/>
<Label Text="Objectivos" Margin="30,0,0,0" FontAttributes="Bold"/>
<Image Source="https://img.icons8.com/material-rounded/50/000000/expand-arrow.png" HorizontalOptions="EndAndExpand"/>
</StackLayout>
</StackLayout>
</ViewCell>
<ViewCell>
<StackLayout Padding="30,0,0,0" VerticalOptions="Center">
<StackLayout Orientation="Horizontal">
<Image Source="https://img.icons8.com/ios/50/000000/trophy.png" HorizontalOptions="Start"/>
<Label Text="Prémios" Margin="30,0,0,0" FontAttributes="Bold"/>
<Image Source="https://img.icons8.com/material-rounded/50/000000/expand-arrow.png" HorizontalOptions="EndAndExpand"/>
</StackLayout>
</StackLayout>
</ViewCell>
<ViewCell>
<StackLayout Padding="30,0,0,0" VerticalOptions="Center">
<StackLayout Orientation="Horizontal">
<Image Source="https://img.icons8.com/ios/50/000000/task.png" HorizontalOptions="Start"/>
<Label Text="Tarefas" Margin="30,0,0,0" FontAttributes="Bold"/>
</StackLayout>
</StackLayout>
</ViewCell>
<ViewCell>
<StackLayout Padding="30,0,0,0" VerticalOptions="Center">
<StackLayout Orientation="Horizontal">
<Image Source="https://img.icons8.com/ios/50/000000/tasks-filled.png" HorizontalOptions="Start"/>
<Label Text="Notas" Margin="30,0,0,0" FontAttributes="Bold"/>
</StackLayout>
</StackLayout>
</ViewCell>
<ViewCell>
<StackLayout Padding="30,0,0,0" VerticalOptions="Center">
<StackLayout Orientation="Horizontal">
<Image Source="https://img.icons8.com/ios/50/000000/help.png" HorizontalOptions="Start"/>
<Label Text="Suporte" Margin="30,0,0,0" FontAttributes="Bold"/>
</StackLayout>
</StackLayout>
</ViewCell>
<ViewCell>
<StackLayout Padding="30,0,0,0" VerticalOptions="Center">
<StackLayout Orientation="Horizontal">
<Image Source="https://img.icons8.com/ios/50/000000/today.png" HorizontalOptions="Start"/>
<Label Text="Hoje" Margin="30,0,0,0" FontAttributes="Bold"/>
<Image Source="https://img.icons8.com/material-rounded/50/000000/expand-arrow.png" HorizontalOptions="EndAndExpand"/>
</StackLayout>
</StackLayout>
</ViewCell>
<ViewCell>
<StackLayout Padding="30,0,0,0" VerticalOptions="Center">
<StackLayout Orientation="Horizontal">
<Image Source="https://img.icons8.com/ios/50/000000/hourglass-sand-bottom.png" HorizontalOptions="Start"/>
<Label Text="Terminar Dia" Margin="30,0,0,0" FontAttributes="Bold"/>
</StackLayout>
</StackLayout>
</ViewCell>
<ViewCell>
<StackLayout Padding="30,0,0,0" VerticalOptions="Center">
<StackLayout Orientation="Horizontal">
<Image Source="https://img.icons8.com/metro/50/000000/exit.png" HorizontalOptions="Start"/>
<Label Text="Sair" Margin="30,0,0,0" FontAttributes="Bold"/>
</StackLayout>
</StackLayout>
</ViewCell>
</TableSection>
</TableView>
</StackLayout>
</StackLayout>
</pages:HomePageMaster>
</MasterDetailPage.Master>
<MasterDetailPage.Detail>
<NavigationPage>
<x:Arguments>
<pages:HomePageDetail />
</x:Arguments>
</NavigationPage>
</MasterDetailPage.Detail>
</MasterDetailPage>
I would like to have something like this : https://imgur.com/a/7OxOvRw

First of all, I would suggest you check the answer here where I have shown the optimized and easy way of creating MasterDetail setup with Xamarin Forms.
Then I would suggest you do something like this for the Expand collapse of this do something like:
<StackLayout> // Parent Menu Item Stacklayout
.
.
<StackLayout IsVisible="{Binding ShowHideBar}">
.
.
</StackLayout>
</StackLayout>
Now either you can write a convertor or just do it through the code. I will do it without a converter.
In your HamburgerMenu's ViewModel add the property :
private bool _showHide;
public bool ShowHideBar { get{return _showHide;}
set{_showHide=value; OnPropertyChanged(nameof(ShowHideBar)); }}
Then on your Items click event add the following line of code:
ShowHideBar= !ShowHideBar;
And it will work like an Expand collapse menu
Goodluck
Revert in case of query

How can i use table view and picker as user input?

I would like to create a page like this: [1]: https://imgur.com/YreKQi3. But picker comes with underline and i also am not being able to display table separator line.
I tried to use tableview inside a frame but it didnt work. because frame's width is larger than table and seperator becomes invisible.
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="KiaiDay.Views.PosLogin.ComoTeSentesPage"
xmlns:sys="clr-namespace:System;assembly=mscorlib"
Title="Como te sentes?">
<ContentPage.Content>
<StackLayout Padding="30">
<StackLayout HorizontalOptions="Center">
<Label Text="Como te sentes hoje?" FontAttributes="Bold" FontSize="Medium" TextColor="Black"/>
</StackLayout>
<Frame CornerRadius="10" BackgroundColor="#ECECEC" BorderColor="LightGray" Padding="10" HeightRequest="200">
<TableView Intent="Form" HeightRequest="200">
<TableRoot>
<TableSection>
<ViewCell>
<StackLayout HeightRequest="40">
<StackLayout Orientation="Horizontal">
<Label Text="Energia" TextColor="White" VerticalOptions="Center" HorizontalOptions="Center" WidthRequest="500" Opacity="1"/>
<Picker ItemsSource="{Binding Opcoes}" BackgroundColor="White" WidthRequest="50"/>
</StackLayout>
</StackLayout>
</ViewCell>
<ViewCell>
<StackLayout HeightRequest="40">
<StackLayout Orientation="Horizontal" BackgroundColor="Blue">
<Picker ItemsSource="{Binding Opcoes}" BackgroundColor="White" WidthRequest="50"/>
<Label Text="Mindset" TextColor="White" VerticalOptions="Center" HorizontalOptions="StartAndExpand" FontAttributes="Bold"/>
</StackLayout>
</StackLayout>
</ViewCell>
<ViewCell>
<StackLayout HeightRequest="40">
<StackLayout Orientation="Horizontal" BackgroundColor="Blue">
<Picker ItemsSource="{Binding Opcoes}" BackgroundColor="White" WidthRequest="50"/>
<Label Text="Estratégia" TextColor="White" VerticalOptions="Center" HorizontalOptions="StartAndExpand" FontAttributes="Bold"/>
</StackLayout>
</StackLayout>
</ViewCell>
<ViewCell>
<StackLayout HeightRequest="40">
<StackLayout Orientation="Horizontal" BackgroundColor="Blue">
<Picker ItemsSource="{Binding Opcoes}" TextColor="White" BackgroundColor="White" WidthRequest="50"/>
<Label Text="Acção" TextColor="White" VerticalOptions="Center" HorizontalOptions="StartAndExpand" FontAttributes="Bold"/>
</StackLayout>
</StackLayout>
</ViewCell>
<ViewCell>
<StackLayout HeightRequest="40">
<StackLayout Orientation="Horizontal" BackgroundColor="Blue">
<Picker ItemsSource="{Binding Opcoes}" BackgroundColor="White" WidthRequest="50"/>
<Label Text="Conexão" TextColor="White" VerticalOptions="Center" HorizontalOptions="StartAndExpand" FontAttributes="Bold"/>
</StackLayout>
</StackLayout>
</ViewCell>
</TableSection>
</TableRoot>
</TableView>
</Frame>
</StackLayout>
</ContentPage.Content>
</ContentPage>
´´´

I write a simple demo to achieve the requirement of the image in your answer, I use Frame and Grid:
<StackLayout Padding="30">
<StackLayout HorizontalOptions="Center">
<Label Text="Como te sentes hoje?" FontAttributes="Bold" FontSize="Medium" TextColor="Black"/>
</StackLayout>
<Frame CornerRadius="7" BackgroundColor="Gray" BorderColor="LightGray" Padding="3" HeightRequest="180" HasShadow="False">
<Grid ColumnSpacing="1" RowSpacing="1">
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="*" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="100" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Label Text="CVC Code:" BackgroundColor="LightGray" HorizontalTextAlignment="Center" VerticalTextAlignment="Center" Grid.Row="0" Grid.Column="0" WidthRequest="100" HeightRequest="60"/>
<local:BorderlessPicker BackgroundColor="White" Grid.Row="0" Grid.Column="1" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">
<Picker.ItemsSource>
<x:Array Type="{x:Type x:String}">
<x:String>1321</x:String>
<x:String>3299</x:String>
</x:Array>
</Picker.ItemsSource>
</local:BorderlessPicker>
<Label Text="Card No:" BackgroundColor="LightGray" HorizontalTextAlignment="Center" VerticalTextAlignment="Center" Grid.Row="1" Grid.Column="0" WidthRequest="100" HeightRequest="60"/>
<local:BorderlessPicker BackgroundColor="White" Grid.Row="1" Grid.Column="1" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">
<Picker.ItemsSource>
<x:Array Type="{x:Type x:String}">
<x:String>1900</x:String>
<x:String>1233</x:String>
</x:Array>
</Picker.ItemsSource>
</local:BorderlessPicker>
<Label Text="Expiry:" BackgroundColor="LightGray" HorizontalTextAlignment="Center" VerticalTextAlignment="Center" Grid.Row="2" Grid.Column="0" WidthRequest="100" HeightRequest="60"/>
<local:BorderlessPicker BackgroundColor="White" Grid.Row="2" Grid.Column="1" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">
<Picker.ItemsSource>
<x:Array Type="{x:Type x:String}">
<x:String>12/4</x:String>
<x:String>11/8</x:String>
</x:Array>
</Picker.ItemsSource>
</local:BorderlessPicker>
</Grid>
</Frame>
</StackLayout>
In code behind, I removed the border of picker by using custom renderer:
AndroDevil mentioned in the comment: xamarin-tip-borderless-picker :
public class BorderlessPicker : Picker
{
}
Here is the result:

Xamarin forms order draw of components

I'm having a problem with the orders of the components of my main page, in this case I have her divided into three parts, Top, Boddy and Botton, Y make the search with auto complete and the component ListView Lower my boddy
<StackLayout x:Name="MainContext"
Spacing="0"
RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent,Property=Width,Factor=1,Constant=0}"
RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent,Property=Height,Factor=1,Constant=0}" >
<StackLayout.GestureRecognizers>
<TapGestureRecognizer Tapped="OnSelectMenuTapGestureTap"
NumberOfTapsRequired="1" />
</StackLayout.GestureRecognizers>
<!-- Main manu -->
<!-- Margin IOS-->
<StackLayout HeightRequest="20"
VerticalOptions="Start"
BackgroundColor="#5AC8FA"/>
<!-- end Margin IOS-->
<StackLayout x:Name="TopBar"
BackgroundColor="#5AC8FA"
VerticalOptions="Start"
HeightRequest="50"
Orientation="Horizontal">
<StackLayout x:Name="ContainerTitleLabel"
HorizontalOptions="FillAndExpand"
VerticalOptions="Center"
Orientation="Horizontal">
<Button Command="{Binding MainMenuCmd}"
BackgroundColor="Transparent"
BorderColor="Transparent"
HorizontalOptions="Start"
WidthRequest="{Binding WidthMenuRequest}"
HeightRequest="{Binding HeightMenuRequest}"
Image="icon_menu"
Margin="5,0"/>
<Label x:Name="TitleLb"
Text="{Binding TitleLb}"
VerticalOptions="Center"
HorizontalOptions="CenterAndExpand"
TextColor="Black"/>
<Button HorizontalOptions="End"
VerticalOptions="Center"
Image="icon_search"
Command = "{Binding ShowSearchCmd}"
BorderColor="Transparent"
BackgroundColor="Transparent"/>
</StackLayout>
<StackLayout x:Name="ContainerSearch"
HorizontalOptions="Start"
VerticalOptions="Center"
Orientation="Horizontal"
IsVisible="false">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width = "7*" />
<ColumnDefinition Width = "3*" />
</Grid.ColumnDefinitions>
<MarkupsInterfaces:SearchBarAutoComplet Grid.Column="0"
x:Name="SearchBar"
HorizontalOptions="Start"
TextColor="White"
PlaceholderColor="White"
CancelButtonColor="Black"
Placeholder="{MarkupsInterfaces:TranslateExtension Search}">
</MarkupsInterfaces:SearchBarAutoComplet>
<Button Grid.Column="1"
HorizontalOptions="End"
VerticalOptions="Center"
Text="{MarkupsInterfaces:TranslateExtension Close}"
Command="{Binding CloseSearchCmd}"
FontSize="12"
BackgroundColor="#5AC8FA"/>
</Grid>
</StackLayout>
</StackLayout>
<!--End Main Menu -->
<!--Boddy Context-->
<StackLayout x:Name="Boddy"
HorizontalOptions="FillAndExpand"
VerticalOptions="FillAndExpand"
Orientation="Horizontal">
</StackLayout>
<!--End Boddy Context-->
<StackLayout BackgroundColor="White"
VerticalOptions="End"
HorizontalOptions="FillAndExpand">
<!--Botton menu navigation-->
<Grid HorizontalOptions="FillAndExpand"
VerticalOptions="Fill"
ColumnSpacing="-5">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<!--Btn Scanner-->
<Button Grid.Column="1"
x:Name="BtnScneer"
Command="{Binding ScannerTabCmd}"
BackgroundColor="White"
Image="icon_scanner"
HorizontalOptions="FillAndExpand"
Margin="{Binding MarginButtons}"/>
<!--Btn Coupons-->
<Button Grid.Column="2"
x:Name="BtnCoupons"
BackgroundColor="White"
Image="icon_coupon"
HorizontalOptions="FillAndExpand"
Margin="{Binding MarginButtons}"/>
<BoxView x:Name="IndicationCoupons"
Grid.Column="2"
VerticalOptions="End"
HorizontalOptions="FillAndExpand"
HeightRequest="8"
BackgroundColor="#5AC8FA"
IsVisible="false"
Margin="5,0"/>
<!--Btn Promotions-->
<Button Grid.Column="3"
x:Name="BtnPromotions"
BackgroundColor="White"
HorizontalOptions="FillAndExpand"
Image="icon_promotions"
Margin="{Binding MarginButtons}"/>
<BoxView x:Name="IndicationPromotions"
Grid.Column="3"
VerticalOptions="End"
HorizontalOptions="FillAndExpand"
HeightRequest="8"
BackgroundColor="#5AC8FA"
IsVisible="false"
Margin="5,0"/>
<!--Btn Maket car -->
<Button Grid.Column="4"
x:Name="BtnMarketCar"
BackgroundColor="White"
VerticalOptions="Center"
HorizontalOptions="FillAndExpand"
Image="icon_market_car"
Margin="{Binding MarginButtons}"/>
<BoxView x:Name="IndicationMarketCar"
VerticalOptions="End"
HorizontalOptions="FillAndExpand"
Grid.Column="4"
HeightRequest="8"
BackgroundColor="#5AC8FA"
IsVisible="false"
Margin="5,0"/>
<!--Btn Favorites-->
<Button Grid.Column="5"
x:Name="BtnFavorites"
BackgroundColor="White"
VerticalOptions="Center"
HorizontalOptions="FillAndExpand"
Image="icon_favorite"
Margin="{Binding MarginButtons}"/>
<BoxView x:Name="IndicationFavorites"
Grid.Column="5"
VerticalOptions="End"
HorizontalOptions="FillAndExpand"
HeightRequest="8"
BackgroundColor="#5AC8FA"
IsVisible="false"
Margin="5,0"/>
</Grid>
<!--End bottom menu navigation-->
</StackLayout>
</StackLayout>
the content of body is dynamic, and my problen is
As a possibility to force the top to always be on the whole context

reduce spacing between ListView Items in Xamarin forms

I have this list in xamarin portable app and i cant seem to be able to remove or at least reduce spacing between items ,and disable item selection also .
<ListView x:Name="ListGroups"
ItemsSource="{Binding Source={x:Static local:Stash.Groups}}"
HorizontalOptions="Center" >
<ListView.ItemTemplate>
<DataTemplate >
<ViewCell>
<Label Text="{Binding Name}" TextColor="Aqua" FontSize="10" HorizontalOptions="Center" />
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
then some labels
<Label Text="If you feel you're missing"
FontSize="15"
VerticalOptions="Center"
HorizontalOptions="Center"
TextColor="White"
/>
<Label Text="a group or two, please contact"
FontSize="15"
VerticalOptions="Center"
HorizontalOptions="Center"
TextColor="White"
/>
<Label Text="your manager"
FontSize="15"
VerticalOptions="Center"
HorizontalOptions="Center"
TextColor="White"
/>
</StackLayout>
ImageBackgroundcolor

you can try with
HasUnevenRows = "true"
for "Disable selection" you can follow these
Disabling selection
SelectionDemoList.ItemSelected += (sender, e) => {
((ListView)sender).SelectedItem = null;
};
Note that on Windows Phone, some cells, including SwitchCell don't update their visual state in response to selection.
To reduce the ListView's height you can use a Grid. This is a sample
<?xml version="1.0" encoding="UTF-8"?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="TestRelativeLayout.MyPage2">
<ContentPage.Content>
<StackLayout>
<StackLayout>
<Grid VerticalOptions = "FillAndExpand">
<Grid.RowDefinitions>
<RowDefinition Height="50" />
<RowDefinition/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="10*" />
<ColumnDefinition Width = "1*"/>
</Grid.ColumnDefinitions>
<Entry Placeholder="MyEntry" Grid.Column = "0" Grid.Row="0" Grid.ColumnSpan = "2"/>
<Image Source="icon.png" Grid.Column="1" Grid.Row = "0" Margin="0,0,20,0"/>
</Grid>
</StackLayout>
<Grid VerticalOptions = "FillAndExpand">
<Grid.RowDefinitions>
<RowDefinition Height="150" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<ListView x:Name="ListGroups"
Grid.Row = "0"
Grid.Column = "0"
ItemsSource="{Binding myList}"
HorizontalOptions="Center"
VerticalOptions="Start"
BackgroundColor = "Red">
<ListView.ItemTemplate>
<DataTemplate >
<ViewCell>
<Label Text="{Binding Name}" TextColor="Aqua" FontSize="10" HorizontalOptions="Center" />
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
<StackLayout Grid.Row = "1" Grid.Column = "0" >
<Label Text="If you feel you're missing"
FontSize="15"
VerticalOptions="StartAndExpand"
HorizontalOptions="Center"
TextColor="Black" />
<Label Text="a group or two, please contact"
FontSize="15"
VerticalOptions="StartAndExpand"
HorizontalOptions="Center"
TextColor="Black" />
<Label Text="your manager"
FontSize="15"
VerticalOptions="StartAndExpand"
HorizontalOptions="Center"
TextColor="Black" />
</StackLayout>
</Grid>
</StackLayout>
</ContentPage.Content>
</ContentPage>
you have this (on Emulator / Android)