Entry and Buttons are not focused in xamarin forms - xaml

I am developing one android application using xamarin android. I am designing one page using xaml. in my screen i have 5 images. it is basically a login screen. but here entry(textbox) is not focused and also button press is not working. if i remove some images and stacklayouts then it is working fine.
below is my xaml
<StackLayout>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="745"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<StackLayout Orientation="Horizontal" HorizontalOptions="Center" Spacing="10" Grid.Column="0" >
<Grid Grid.Column="0" ColumnSpacing="80" RowSpacing="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="100"/>
<RowDefinition Height="100"/>
<RowDefinition Height="250"/>
</Grid.RowDefinitions>
<Image Source="image1.png" Margin="0" Grid.Row="0" Grid.Column="0" HorizontalOptions="StartAndExpand" HeightRequest="100" WidthRequest="200" />
<Image Source="image3.png" Margin="0" Grid.Row="0" Grid.Column="1" HorizontalOptions="StartAndExpand" HeightRequest="100" WidthRequest="200" />
<Label x:Name="lblTitle" FontSize="22" TextColor="Blue" Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="2"
FontAttributes="Bold" VerticalOptions="Center"
HorizontalTextAlignment="Center" Text="Title goes here"/>
<Image Source="image3.png" Grid.Row="2" Grid.Column="0" HorizontalOptions="StartAndExpand" HeightRequest="500" WidthRequest="500" />
<StackLayout Grid.Row="2" Grid.Column="1" InputTransparent="False" >
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="100"/>
<ColumnDefinition Width="100"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="30"/>
<RowDefinition Height="40"/>
<RowDefinition Height="30"/>
<RowDefinition Height="40"/>
<RowDefinition Height="40"/>
<RowDefinition Height="40"/>
</Grid.RowDefinitions>
<Label FontSize="15" TextColor="Blue" Grid.Column="0" Grid.Row="0" Grid.ColumnSpan="2"
FontAttributes="Bold" VerticalOptions="Center"
HorizontalTextAlignment="Start" Text="User Name"/>
<Frame BorderColor="DodgerBlue" CornerRadius="0" Padding="0" Grid.Column="0" Grid.Row="1" Grid.ColumnSpan="2">
<Entry x:Name="txtUsername" FontFamily="{StaticResource UbuntuRegularFontFamily}" Placeholder="Enter Username" HorizontalOptions="FillAndExpand" Text="" FontSize="15"/>
</Frame>
<Label FontSize="15" TextColor="Blue" Grid.Column="0" Grid.Row="2" Grid.ColumnSpan="2"
FontAttributes="Bold" VerticalOptions="Center"
HorizontalTextAlignment="Start" Text="Password"/>
<Frame BorderColor="DodgerBlue" CornerRadius="0" Padding="0" Grid.Column="0" Grid.Row="3" Grid.ColumnSpan="2">
<Entry x:Name="txtPassword" FontFamily="{StaticResource UbuntuRegularFontFamily}" Placeholder="Enter Password" IsPassword="True" HorizontalOptions="FillAndExpand" Text="" FontSize="15"/>
</Frame>
<Button x:Name="btnlogin" Grid.Row="4" Grid.Column="0" Text="LOGIN" WidthRequest="100" HeightRequest="40" ></Button>
<Button x:Name="btnCancel" Grid.Row="4" Grid.Column="1" Text="CANCEL" WidthRequest="100" HeightRequest="40" ></Button>
</Grid>
</StackLayout>
</Grid>
</StackLayout>
<StackLayout Grid.Row="3" InputTransparent="True">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="150"/>
<ColumnDefinition Width="150"/>
<ColumnDefinition Width="100"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Image Source="image4.png" Margin="0" Grid.Row="1" Grid.Column="0" HorizontalOptions="StartAndExpand" HeightRequest="400" WidthRequest="250" />
<Label FontSize="25" TextColor="Black" Grid.Row="1" Grid.Column="1" Grid.ColumnSpan="2"
FontAttributes="Bold" VerticalOptions="Center"
HorizontalTextAlignment="Center" Text="year "/>
<Label FontSize="25" TextColor="Black" Grid.Row="1" Grid.Column="2" Grid.ColumnSpan="2"
FontAttributes="Bold" VerticalOptions="Center"
HorizontalTextAlignment="Center" Text="company name goes here"/>
</Grid>
</StackLayout>
<StackLayout Grid.RowSpan="1" Grid.Column="1" InputTransparent="True">
<Image Source="image5.png" Margin="0"
/>
</StackLayout>
</Grid >
</StackLayout>


but here entry(textbox) is not focused and also button press is not working. if i remove some images and stacklayouts then it is working fine.
I test you code, and find you put the following code in wrong place.
<StackLayout Grid.Row="3">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="150" />
<ColumnDefinition Width="150" />
<ColumnDefinition Width="100" />
</Grid.ColumnDefinitions>
<Image
Grid.Row="1"
Grid.Column="0"
Margin="0"
HeightRequest="400"
HorizontalOptions="StartAndExpand"
Source="check.png"
WidthRequest="250" />
<Label
Grid.Row="1"
Grid.Column="1"
FontAttributes="Bold"
FontSize="25"
HorizontalTextAlignment="Center"
Text="year "
TextColor="Black"
VerticalOptions="Center" />
<Label
Grid.Row="1"
Grid.Column="2"
FontAttributes="Bold"
FontSize="25"
HorizontalTextAlignment="Center"
Text="company name goes here"
TextColor="Black"
VerticalOptions="Center" />
</Grid>
</StackLayout>
You just define 3 RowDefinitions, but you use Grid.Row="3" above code.
<StackLayout
Grid.Column="0"
HorizontalOptions="Center"
Orientation="Horizontal"
Spacing="10">
<Grid
Grid.Column="0"
ColumnSpacing="80"
RowSpacing="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="100" />
<RowDefinition Height="100" />
<RowDefinition Height="250" />
<RowDefinition Height="100" />
</Grid.RowDefinitions>
please take a look the following code, I use my image source.
<StackLayout>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<StackLayout
Grid.Column="0"
HorizontalOptions="Center"
Orientation="Horizontal"
Spacing="10">
<Grid
Grid.Column="0"
ColumnSpacing="80"
RowSpacing="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="100" />
<RowDefinition Height="100" />
<RowDefinition Height="250" />
<RowDefinition Height="100" />
</Grid.RowDefinitions>
<Image
Grid.Row="0"
Grid.Column="0"
Margin="0"
HeightRequest="100"
HorizontalOptions="StartAndExpand"
Source="c1.png"
WidthRequest="200" />
<Image
Grid.Row="0"
Grid.Column="1"
Margin="0"
HeightRequest="100"
HorizontalOptions="StartAndExpand"
Source="c10.png"
WidthRequest="200" />
<Label
x:Name="lblTitle"
Grid.Row="1"
Grid.Column="0"
Grid.ColumnSpan="2"
FontAttributes="Bold"
FontSize="22"
HorizontalTextAlignment="Center"
Text="Title goes here"
TextColor="Blue"
VerticalOptions="Center" />
<Image
Grid.Row="2"
Grid.Column="0"
HeightRequest="500"
HorizontalOptions="StartAndExpand"
Source="c11.png"
WidthRequest="500" />
<StackLayout
Grid.Row="2"
Grid.Column="1"
InputTransparent="False">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="100" />
<ColumnDefinition Width="100" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="30" />
<RowDefinition Height="40" />
<RowDefinition Height="30" />
<RowDefinition Height="40" />
<RowDefinition Height="40" />
<RowDefinition Height="40" />
</Grid.RowDefinitions>
<Label
Grid.Row="0"
Grid.Column="0"
Grid.ColumnSpan="2"
FontAttributes="Bold"
FontSize="15"
HorizontalTextAlignment="Start"
Text="User Name"
TextColor="Blue"
VerticalOptions="Center" />
<Frame
Grid.Row="1"
Grid.Column="0"
Grid.ColumnSpan="2"
Padding="0"
BorderColor="DodgerBlue"
CornerRadius="0">
<Entry
x:Name="txtUsername"
FontSize="15"
HorizontalOptions="FillAndExpand"
Placeholder="Enter Username"
Text="" />
</Frame>
<Label
Grid.Row="2"
Grid.Column="0"
Grid.ColumnSpan="2"
FontAttributes="Bold"
FontSize="15"
HorizontalTextAlignment="Start"
Text="Password"
TextColor="Blue"
VerticalOptions="Center" />
<Frame
Grid.Row="3"
Grid.Column="0"
Grid.ColumnSpan="2"
Padding="0"
BorderColor="DodgerBlue"
CornerRadius="0">
<Entry
x:Name="txtPassword"
FontSize="15"
HorizontalOptions="FillAndExpand"
IsPassword="True"
Placeholder="Enter Password"
Text="" />
</Frame>
<Button
x:Name="btnlogin"
Grid.Row="4"
Grid.Column="0"
HeightRequest="40"
Text="LOGIN"
WidthRequest="100" />
<Button
x:Name="btnCancel"
Grid.Row="4"
Grid.Column="1"
HeightRequest="40"
Text="CANCEL"
WidthRequest="100" />
</Grid>
</StackLayout>
<StackLayout Grid.Row="3" InputTransparent="True">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="150" />
<ColumnDefinition Width="150" />
<ColumnDefinition Width="100" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Image
Grid.Row="1"
Grid.Column="0"
Margin="0"
HeightRequest="400"
HorizontalOptions="StartAndExpand"
Source="check.png"
WidthRequest="250" />
<Label
Grid.Row="1"
Grid.Column="1"
Grid.ColumnSpan="2"
FontAttributes="Bold"
FontSize="25"
HorizontalTextAlignment="Center"
Text="year "
TextColor="Black"
VerticalOptions="Center" />
<Label
Grid.Row="1"
Grid.Column="2"
Grid.ColumnSpan="2"
FontAttributes="Bold"
FontSize="25"
HorizontalTextAlignment="Center"
Text="company name goes here"
TextColor="Black"
VerticalOptions="Center" />
</Grid>
</StackLayout>
</Grid>
</StackLayout>
<StackLayout
Grid.RowSpan="1"
Grid.Column="1"
InputTransparent="True">
<Image Margin="0" Source="image5.png" />
</StackLayout>
</Grid>
</StackLayout>

Related

xamarin forms - ios - listview header - showing bold border?

Please see below image
please see below code
//PopUp.Xaml
<ListView.Header>
<Frame>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="30*" />
<ColumnDefinition Width="25*" />
<ColumnDefinition Width="25*" />
<ColumnDefinition Width="20*" />
</Grid.ColumnDefinitions>
<Label Grid.Column="0" Grid.Row="0" Text="Product"
HorizontalOptions="Center"/>
<Label Grid.Column="1" Grid.Row="0"
Text="Quantity"
HorizontalOptions="Center"/>
<Label Grid.Column="2" Grid.Row="0"
Text="Price"
HorizontalOptions="Center"/>
<Label Grid.Column="3" Grid.Row="0"
Text="Sub"
HorizontalOptions="Center"/>
<BoxView Grid.Row="1"
Grid.ColumnSpan="4"
HeightRequest="1"
BackgroundColor="LightGray"/>
</Grid>
</Frame>
</ListView.Header>
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<Grid Padding="10" RowSpacing="10" ColumnSpacing="10">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="43*" />
<ColumnDefinition Width="8*" />
<ColumnDefinition Width="25*" />
<ColumnDefinition Width="24*" />
</Grid.ColumnDefinitions>
<Label Grid.Column="0" Text="{Binding OrderModel_Id}" VerticalOptions="End"/>
<Label Grid.Column="1" Grid.Row="0" Text="{Binding User_Name}" VerticalOptions="End"/>
<Label Grid.Column="0" Grid.Row="0" HorizontalOptions="StartAndExpand" VerticalOptions="StartAndExpand" Text="{Binding Product_Id, Converter={StaticResource converter}}"/>
<Label Grid.Column="1" Grid.Row="0" HorizontalOptions="CenterAndExpand" VerticalOptions="CenterAndExpand" Text="{Binding Quantity}"/>
<Label Grid.Column="2" Grid.Row="0" HorizontalOptions="CenterAndExpand" VerticalOptions="CenterAndExpand" Text="{Binding PriceOf_Item, StringFormat='£{0:0.00}'}"/>
<Label Grid.Column="3" Grid.Row="0" HorizontalOptions="CenterAndExpand" VerticalOptions="CenterAndExpand" Text="{Binding SubtotalForThis_Item, StringFormat='£{0:0.00}'}"/>
</Grid>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</StackLayout>
</pages:PopupPage>
My Q being why does the popUp header of the listview...appear with a bold border below it? only on ios...not on android...I would like to remove it please. does anyone know how?

In a Grid with value of Auto I cannot see the contents of the Label

In the DataTemplate of a CollectionView I have a Grid, and inside it a Row to which I insert the Height value in Auto. I associate a Label with that Row, but it is not displayed, while if I insert an absolute value in the Row then the text is visible. How could I solve?
<CollectionView
RelativeLayout.YConstraint="{ConstraintExpression
Type=Constant,
Constant=140}"
RelativeLayout.WidthConstraint="{ConstraintExpression
Type=RelativeToParent,
Property=Width,
Factor=1}"
Margin="10,0">
<CollectionView.ItemsLayout>
<LinearItemsLayout Orientation="Vertical" ItemSpacing="9"/>
</CollectionView.ItemsLayout>
<CollectionView.ItemTemplate>
<DataTemplate>
<yummy:PancakeView CornerRadius="5">
<RelativeLayout>
<Grid BackgroundColor="LightGray" RowSpacing="0.2">
<Grid.RowDefinitions>
<RowDefinition Height="1"/>
<RowDefinition Height="16"/>
<RowDefinition Height="16"/>
<RowDefinition Height="25"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="40"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="65"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<BoxView Grid.ColumnSpan="2" Grid.Row="0" BackgroundColor="{Binding ColoreUmore}"/>
<Image Grid.Row="1" Grid.RowSpan="3" Grid.Column="0" Margin="8" Source="{Binding Umore}" VerticalOptions="Start"/>
<Label Grid.Row="1" Grid.Column="1" Text="{Binding GiornoTrascritto}" FontSize="14" TextColor="Black" Opacity="0.7" />
<Label Grid.Row="2" Grid.Column="1" Text="{Binding Orario}" FontSize="14" TextColor="Black" Opacity="0.7" />
<Label Grid.Row="3" Grid.Column="1" Text="{Binding DescrizioneUmore}" FontSize="16" TextColor="{Binding ColoreUmore}" HorizontalTextAlignment="Start"/>
<FlexLayout
Grid.Row="4"
Margin="0,5,10,0"
Grid.Column="1"
BindableLayout.ItemsSource="{Binding IconDiaries}"
Wrap="Wrap"
JustifyContent="Start"
Direction="Row"
AlignItems="Start"
AlignContent="Start">
<BindableLayout.ItemTemplate>
<DataTemplate>
<Grid Padding="0,2,3,0">
<Grid.RowDefinitions>
<RowDefinition Height="17"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="18"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<BoxView BackgroundColor="Black" Opacity="0.4" Grid.ColumnSpan="2" Grid.Row="0" CornerRadius="5" />
<Image Grid.Row="0" Grid.Column="0" Source="{Binding isSource}" Margin="3"/>
<Label Grid.Row="0" Grid.Column="1" Text="{Binding id}" TextColor="{Binding ColoreUmore}" FontSize="12" VerticalTextAlignment="Center" Margin="0,0,3,0"/>
</Grid>
</DataTemplate>
</BindableLayout.ItemTemplate>
</FlexLayout>
<BoxView Grid.Row="5" Grid.Column="1" CornerRadius="7" BackgroundColor="Black" Opacity="0.2" Margin="0,0,4,4"/>
THIS-----> <Label Grid.Row="5" Grid.Column="1" TextColor="White" FontSize="16" Text="{Binding Nota}" Margin="5,0,9,0" />
<Image Source="rightArrowB" Grid.Row="1" Grid.Column="1" HorizontalOptions="End" Margin="0,0,10,0" Rotation="90" Opacity="0.4"/>
<Button Grid.Row="1" Grid.Column="1" WidthRequest="70" HeightRequest="21" BackgroundColor="Transparent" Clicked="BtOperazioni"/>
</Grid>
<StackLayout
RelativeLayout.YConstraint="{ConstraintExpression
Type=Constant,
Constant=8}"
RelativeLayout.XConstraint="{ConstraintExpression
Type=Constant,
Constant=200}"
HeightRequest="72"
WidthRequest="90"
IsVisible="{Binding Edit}">
<Button Text="Modifica" BackgroundColor="Blue" Opacity="0.9" CornerRadius="5" TextColor="White" HeightRequest="37" />
<Button Text="Elimina" BackgroundColor="Blue" Opacity="0.9" CornerRadius="5" TextColor="White" Clicked="EliminaDiario" HeightRequest="37" />
</StackLayout>
</RelativeLayout>
</yummy:PancakeView>
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>

Controls overlaps other controls and need more space

My listview when new items are added overlaps the buttons. The buttons seems to have same place on the center of application. I would love to have them at the bottom. From the other hand listview should expand to the buttons and then scroll should appear. Last thing is the listview itself overlaps top part of controls and there is need to make more space i suppose (i highlited it on black on the picture. How can i fix that? Below screnshoot how it looks at the moment and current code as well. Thanks.
Full xaml code:
<?xml version="1.0" encoding="utf-8" ?>
<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"
mc:Ignorable="d"
x:Class="MobileAppXamarinForms.Views.Order.OrderModifyPage"
Title="{Binding SelectedOrder.OrderId, StringFormat='Numer zamówienia: {0}'}">
<ContentPage.Content>
<StackLayout Orientation="Vertical">
<Grid ColumnSpacing="4" HorizontalOptions="FillAndExpand">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Label Text="{Binding SelectedOrder.OrderId, StringFormat='NUMER ZAMÓWIENIA: {0}'}" FontSize="16" TextColor="Gray" Grid.Column="0" Padding="30,1,1,1" FontAttributes="None" HorizontalOptions="FillAndExpand" VerticalOptions="Center"/>
<Label Text=" " Grid.Column="1" HorizontalOptions="FillAndExpand"/>
<Label Text="KLIENT:" FontSize="15" VerticalOptions="Center" Grid.Column="2" HorizontalOptions="Start"/>
<Label Text="{Binding SelectedClient.Value, StringFormat='{0}'}" FontSize="16" TextColor="Gray" Grid.Column="3"
Padding="5,1,1,1" FontAttributes="None" HorizontalOptions="FillAndExpand" VerticalOptions="Center"/>
<Label Text="NA DZIEŃ:" Grid.Column="4" HorizontalOptions="FillAndExpand" VerticalOptions="Center"/>
<DatePicker Date="{Binding SelectedTargetDate, Mode=TwoWay}" Format="dd.MM.yyyy"
Grid.Column="5" HorizontalOptions="FillAndExpand"/>
</Grid>
<Grid ColumnSpacing="4" HorizontalOptions="FillAndExpand">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Label Text="BUTLA:" FontSize="15" TextColor="Gray" Grid.Column="0" Padding="30,1,1,1" FontAttributes="None" HorizontalOptions="FillAndExpand" VerticalOptions="Center"/>
<Picker Title="BUTLA" ItemsSource="{Binding Bottles}" SelectedItem="{Binding SelectedBottle, Mode=TwoWay}" ItemDisplayBinding="{Binding Value}" SelectedIndex="{Binding Id}" FontSize="15" VerticalOptions="Center" Grid.Column="1" HorizontalOptions="FillAndExpand"/>
<Label Text=" " Grid.Column="2" HorizontalOptions="FillAndExpand"/>
<Label Text="ILOŚĆ:" FontSize="15" VerticalOptions="Center" Grid.Column="3" HorizontalOptions="Start"/>
<Entry Placeholder="Ilość" Text="{Binding SelectedAmount, Mode=TwoWay}" Keyboard="Numeric" MaxLength="5" Grid.Column="4" HorizontalOptions="Start"/>
</Grid>
<StackLayout Orientation="Vertical" VerticalOptions="Fill">
<Grid ColumnSpacing="0" RowSpacing="0" VerticalOptions="Fill">
<!--Listview section-->
<ListView ItemsSource="{Binding SelectedItems}" SelectedItem="{Binding SelectedItem, Mode=TwoWay}" VerticalScrollBarVisibility="Always">
<ListView.Header>
<Grid BackgroundColor="White">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="1*"></ColumnDefinition>
<ColumnDefinition Width="1*"></ColumnDefinition>
<ColumnDefinition Width="1*"></ColumnDefinition>
<ColumnDefinition Width="1*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Label Text="Nazwa butli" HorizontalOptions="Fill" Grid.Column="0" FontSize="Medium" FontAttributes="Bold" BackgroundColor="LightBlue" TextColor="White" HorizontalTextAlignment="Center" Margin="1"/>
<Label Text="Pełna?" HorizontalOptions="Fill" Grid.Column="1" FontSize="Medium" FontAttributes="Bold" BackgroundColor="LightBlue" TextColor="White" HorizontalTextAlignment="Center" Margin="1"/>
<Label Text="Ilość" HorizontalOptions="Fill" Grid.Column="2" FontSize="Medium" FontAttributes="Bold" BackgroundColor="LightBlue" TextColor="White" HorizontalTextAlignment="Center" Margin="1"/>
<Label Text="Kwota" HorizontalOptions="Fill" Grid.Column="3" FontSize="Medium" FontAttributes="Bold" BackgroundColor="LightBlue" TextColor="White" HorizontalTextAlignment="Center" Margin="1"/>
</Grid>
</ListView.Header>
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<Grid BackgroundColor="White">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"></ColumnDefinition>
<ColumnDefinition Width="*"></ColumnDefinition>
<ColumnDefinition Width="*"></ColumnDefinition>
<ColumnDefinition Width="*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Label Grid.Column="0" Text ="{Binding BottleTypeName}" BackgroundColor="WhiteSmoke" HorizontalOptions="Fill" HorizontalTextAlignment="Center"></Label>
<Label Grid.Column="1" Text ="{Binding BottleIsFilled}" BackgroundColor="WhiteSmoke" HorizontalOptions="Fill" HorizontalTextAlignment="Center"></Label>
<Label Grid.Column="2" Text ="{Binding Amount}" BackgroundColor="WhiteSmoke" HorizontalOptions="Fill" HorizontalTextAlignment="Center"></Label>
<Label Grid.Column="3" Text ="{Binding Price}" BackgroundColor="WhiteSmoke" HorizontalOptions="Fill" HorizontalTextAlignment="Center"></Label>
</Grid>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
<!--Buttons section-->
<Grid ColumnSpacing="0" RowSpacing="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="33.33*"/>
<ColumnDefinition Width="33.33*"/>
<ColumnDefinition Width="33.33*"/>
<ColumnDefinition Width="33.33*"/>
</Grid.ColumnDefinitions>
<Button Text="Dodaj butlę"
VerticalOptions="Center"
Margin="20"
BackgroundColor="DarkMagenta"
TextColor="White"
FontSize="20"
FontAttributes="Bold"
Command="{Binding SaveBottleCommand}" Grid.Column="0" HorizontalOptions="FillAndExpand"/>
<Button Text="Usuń butlę"
VerticalOptions="Center"
Margin="20"
BackgroundColor="MediumVioletRed"
TextColor="White"
FontSize="20"
FontAttributes="Bold"
Command="{Binding RemoveBottleCommand}" Grid.Column="1" HorizontalOptions="FillAndExpand"/>
<Button Text="Ok"
VerticalOptions="Center"
Margin="20"
BackgroundColor="Red"
TextColor="White"
FontSize="20"
FontAttributes="Bold"
Command="{Binding ClearFormCommand}" Grid.Column="2" HorizontalOptions="FillAndExpand"/>
<Button Text="Ok"
VerticalOptions="Center"
Margin="20"
BackgroundColor="OrangeRed"
TextColor="White"
FontSize="20"
FontAttributes="Bold"
Command="{Binding ClearFormCommand}" Grid.Column="3" HorizontalOptions="FillAndExpand"/>
</Grid>
</Grid>
</StackLayout>
</StackLayout>
</ContentPage.Content>
</ContentPage>
EDIT 1:
Current code:
<?xml version="1.0" encoding="utf-8" ?>
<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"
mc:Ignorable="d"
x:Class="MobileAppXamarinForms.Views.Order.OrderModifyPage"
Title="{Binding SelectedOrder.OrderId, StringFormat='Numer zamówienia: {0}'}">
<ContentPage.Content>
<StackLayout>
<Grid HorizontalOptions="FillAndExpand" VerticalOptions="Center">
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition />
<RowDefinition />
<RowDefinition />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="1*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<!-- ********** COL 0 | ROW 0 ********** -->
<Grid Column="0" Row="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<Label Text="{Binding SelectedOrder.OrderId, StringFormat='NUMER ZAMÓWIENIA: {0}'}" FontSize="16" TextColor="Gray"
Grid.Column="0" Padding="30,1,1,1" FontAttributes="None" VerticalOptions="Center"/>
<Label Text="KLIENT:" FontSize="15" VerticalOptions="Center" Grid.Column="1"/>
<Label Text="{Binding SelectedClient.Value, StringFormat='{0}'}" FontSize="16" TextColor="Gray" Grid.Column="2" FontAttributes="None" VerticalOptions="Center"/>
<Label Text="NA DZIEŃ:" Grid.Column="3" VerticalOptions="Center"/>
<DatePicker Date="{Binding SelectedTargetDate, Mode=TwoWay}" Format="dd.MM.yyyy" Grid.Column="4"/>
</Grid>
<!-- ********** COL 0 | ROW 1 ********** -->
<Grid Column="0" Row="1">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<Label Text="BUTLA:" FontSize="15" TextColor="Gray" Grid.Column="0" Padding="30,1,1,1"
FontAttributes="None" HorizontalOptions="FillAndExpand" VerticalOptions="Center"/>
<Picker Title="BUTLA" ItemsSource="{Binding Bottles}" SelectedItem="{Binding SelectedBottle, Mode=TwoWay}"
ItemDisplayBinding="{Binding Value}" SelectedIndex="{Binding Id}" FontSize="15"
VerticalOptions="Center" Grid.Column="1" HorizontalOptions="FillAndExpand"/>
<Label Text=" " Grid.Column="2" HorizontalOptions="FillAndExpand"/>
<Label Text="ILOŚĆ:" FontSize="15" VerticalOptions="Center" Grid.Column="3" HorizontalOptions="Start"/>
<Entry Placeholder="Ilość" Text="{Binding SelectedAmount, Mode=TwoWay}" Keyboard="Numeric" MaxLength="5" Grid.Column="4" HorizontalOptions="Start"/>
</Grid>
<!-- ********** COL 0 | ROW 2 ********** -->
<Grid VerticalOptions="FillAndExpand" Column="0" Row="2">
<Grid.RowDefinitions>
<RowDefinition Grid.ColumnSpan="1" />
<RowDefinition Grid.ColumnSpan="1" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="1*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<!--Listview section-->
<ListView ItemsSource="{Binding SelectedItems}" SelectedItem="{Binding SelectedItem, Mode=TwoWay}" VerticalScrollBarVisibility="Always" Grid.Column="0" Grid.Row="0">
<ListView.Header>
<Grid BackgroundColor="White" Grid.Column="0" Grid.Row="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="1*"></ColumnDefinition>
<ColumnDefinition Width="1*"></ColumnDefinition>
<ColumnDefinition Width="1*"></ColumnDefinition>
<ColumnDefinition Width="1*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Label Text="Nazwa butli" HorizontalOptions="Fill" Grid.Column="0" FontSize="Medium" FontAttributes="Bold" BackgroundColor="LightBlue" TextColor="White" HorizontalTextAlignment="Center" Margin="1"/>
<Label Text="Pełna?" HorizontalOptions="Fill" Grid.Column="1" FontSize="Medium" FontAttributes="Bold" BackgroundColor="LightBlue" TextColor="White" HorizontalTextAlignment="Center" Margin="1"/>
<Label Text="Ilość" HorizontalOptions="Fill" Grid.Column="2" FontSize="Medium" FontAttributes="Bold" BackgroundColor="LightBlue" TextColor="White" HorizontalTextAlignment="Center" Margin="1"/>
<Label Text="Kwota" HorizontalOptions="Fill" Grid.Column="3" FontSize="Medium" FontAttributes="Bold" BackgroundColor="LightBlue" TextColor="White" HorizontalTextAlignment="Center" Margin="1"/>
</Grid>
</ListView.Header>
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<Grid BackgroundColor="White">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"></ColumnDefinition>
<ColumnDefinition Width="*"></ColumnDefinition>
<ColumnDefinition Width="*"></ColumnDefinition>
<ColumnDefinition Width="*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Label Grid.Column="0" Text ="{Binding BottleTypeName}" BackgroundColor="WhiteSmoke" HorizontalOptions="Fill" HorizontalTextAlignment="Center"></Label>
<Label Grid.Column="1" Text ="{Binding BottleIsFilled}" BackgroundColor="WhiteSmoke" HorizontalOptions="Fill" HorizontalTextAlignment="Center"></Label>
<Label Grid.Column="2" Text ="{Binding Amount}" BackgroundColor="WhiteSmoke" HorizontalOptions="Fill" HorizontalTextAlignment="Center"></Label>
<Label Grid.Column="3" Text ="{Binding Price}" BackgroundColor="WhiteSmoke" HorizontalOptions="Fill" HorizontalTextAlignment="Center"></Label>
</Grid>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</Grid>
<!-- ********** COL 0 | ROW 3 ********** -->
<Grid BackgroundColor="White" Grid.Column="0" Grid.Row="3">
<Button Text="Dodaj butlę" Grid.Row="1"
VerticalOptions="Center"
Margin="20"
BackgroundColor="DarkMagenta"
TextColor="White"
FontSize="20"
FontAttributes="Bold"
Command="{Binding SaveBottleCommand}" Grid.Column="0" HorizontalOptions="FillAndExpand"/>
<Button Text="Usuń butlę" Grid.Row="1"
VerticalOptions="Center"
Margin="20"
BackgroundColor="MediumVioletRed"
TextColor="White"
FontSize="20"
FontAttributes="Bold"
Command="{Binding RemoveBottleCommand}" Grid.Column="1" HorizontalOptions="FillAndExpand"/>
<Button Text="Ok" Grid.Row="1"
VerticalOptions="Center"
Margin="20"
BackgroundColor="Red"
TextColor="White"
FontSize="20"
FontAttributes="Bold"
Command="{Binding ClearFormCommand}" Grid.Column="2" HorizontalOptions="FillAndExpand"/>
<Button Text="Ok" Grid.Row="1"
VerticalOptions="Center"
Margin="20"
BackgroundColor="OrangeRed"
TextColor="White"
FontSize="20"
FontAttributes="Bold"
Command="{Binding ClearFormCommand}" Grid.Column="3" HorizontalOptions="FillAndExpand"/>
</Grid>
</Grid>
</StackLayout>
</ContentPage.Content>
</ContentPage>
EDIT 3:

your ListView and buttons are both contained in a Grid with no RowDefintions, so both will occupy the same row and overlap. You need to place each one in its own row

I would love to have them at the bottom.
If you want to place button at the bottom , just set VerticalOptions="End" for Grid.
listview itself overlaps top part of controls and there is need to make more space.
You can use Margin to add space between control and ListView.
I modify your code, you can take a look:
<StackLayout Orientation="Vertical">
<Grid HorizontalOptions="FillAndExpand">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Label
Grid.Column="0"
Padding="30,1,1,1"
FontAttributes="None"
FontSize="16"
HorizontalOptions="FillAndExpand"
Text="{Binding SelectedOrder.OrderId, StringFormat='NUMER ZAMÓWIENIA: {0}'}"
TextColor="Gray"
VerticalOptions="Center" />
<Label
Grid.Column="1"
HorizontalOptions="FillAndExpand"
Text=" " />
<Label
Grid.Column="2"
FontSize="15"
HorizontalOptions="Start"
Text="KLIENT:"
VerticalOptions="Center" />
<Label
Grid.Column="3"
Padding="5,1,1,1"
FontAttributes="None"
FontSize="16"
HorizontalOptions="FillAndExpand"
Text="{Binding SelectedClient.Value, StringFormat='{0}'}"
TextColor="Gray"
VerticalOptions="Center" />
<Label
Grid.Column="4"
HorizontalOptions="FillAndExpand"
Text="NA DZIEŃ:"
VerticalOptions="Center" />
<DatePicker
Grid.Column="5"
Date="{Binding SelectedTargetDate, Mode=TwoWay}"
Format="dd.MM.yyyy"
HorizontalOptions="FillAndExpand" />
</Grid>
<Grid Margin="5" HorizontalOptions="FillAndExpand">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Label
Grid.Column="0"
Padding="30,1,1,1"
FontAttributes="None"
FontSize="15"
HorizontalOptions="FillAndExpand"
Text="BUTLA:"
TextColor="Gray"
VerticalOptions="Center" />
<Picker
Title="BUTLA"
Grid.Column="1"
FontSize="15"
HorizontalOptions="FillAndExpand"
ItemDisplayBinding="{Binding Value}"
ItemsSource="{Binding Bottles}"
SelectedIndex="{Binding Id}"
SelectedItem="{Binding SelectedBottle, Mode=TwoWay}"
VerticalOptions="Center" />
<Label
Grid.Column="2"
HorizontalOptions="FillAndExpand"
Text=" " />
<Label
Grid.Column="3"
FontSize="15"
HorizontalOptions="Start"
Text="ILOŚĆ:"
VerticalOptions="Center" />
<Entry
Grid.Column="4"
HorizontalOptions="Start"
Keyboard="Numeric"
MaxLength="5"
Placeholder="Ilość"
Text="{Binding SelectedAmount, Mode=TwoWay}" />
</Grid>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<!-- Listview section -->
<ListView
ItemsSource="{Binding SelectedItems}"
SelectedItem="{Binding SelectedItem, Mode=TwoWay}"
VerticalScrollBarVisibility="Always">
<ListView.Header>
<Grid BackgroundColor="White">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="1*" />
<ColumnDefinition Width="1*" />
<ColumnDefinition Width="1*" />
<ColumnDefinition Width="1*" />
</Grid.ColumnDefinitions>
<Label
Grid.Column="0"
Margin="1"
BackgroundColor="LightBlue"
FontAttributes="Bold"
FontSize="Medium"
HorizontalOptions="Fill"
HorizontalTextAlignment="Center"
Text="Nazwa butli"
TextColor="White" />
<Label
Grid.Column="1"
Margin="1"
BackgroundColor="LightBlue"
FontAttributes="Bold"
FontSize="Medium"
HorizontalOptions="Fill"
HorizontalTextAlignment="Center"
Text="Pełna?"
TextColor="White" />
<Label
Grid.Column="2"
Margin="1"
BackgroundColor="LightBlue"
FontAttributes="Bold"
FontSize="Medium"
HorizontalOptions="Fill"
HorizontalTextAlignment="Center"
Text="Ilość"
TextColor="White" />
<Label
Grid.Column="3"
Margin="1"
BackgroundColor="LightBlue"
FontAttributes="Bold"
FontSize="Medium"
HorizontalOptions="Fill"
HorizontalTextAlignment="Center"
Text="Kwota"
TextColor="White" />
</Grid>
</ListView.Header>
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<Grid BackgroundColor="White">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Label
Grid.Column="0"
BackgroundColor="WhiteSmoke"
HorizontalOptions="Fill"
HorizontalTextAlignment="Center"
Text="{Binding BottleTypeName}" />
<Label
Grid.Column="1"
BackgroundColor="WhiteSmoke"
HorizontalOptions="Fill"
HorizontalTextAlignment="Center"
Text="{Binding BottleIsFilled}" />
<Label
Grid.Column="2"
BackgroundColor="WhiteSmoke"
HorizontalOptions="Fill"
HorizontalTextAlignment="Center"
Text="{Binding Amount}" />
<Label
Grid.Column="3"
BackgroundColor="WhiteSmoke"
HorizontalOptions="Fill"
HorizontalTextAlignment="Center"
Text="{Binding Price}" />
</Grid>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
<!-- Buttons section -->
<Grid Grid.Row="1" VerticalOptions="End">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="33.33*" />
<ColumnDefinition Width="33.33*" />
<ColumnDefinition Width="33.33*" />
<ColumnDefinition Width="33.33*" />
</Grid.ColumnDefinitions>
<Button
Grid.Column="0"
BackgroundColor="DarkMagenta"
Command="{Binding SaveBottleCommand}"
FontAttributes="Bold"
FontSize="20"
HorizontalOptions="FillAndExpand"
Text="Dodaj butlę"
TextColor="White"
VerticalOptions="Fill" />
<Button
Grid.Column="1"
BackgroundColor="MediumVioletRed"
Command="{Binding RemoveBottleCommand}"
FontAttributes="Bold"
FontSize="20"
HorizontalOptions="FillAndExpand"
Text="Usuń butlę"
TextColor="White"
VerticalOptions="Center" />
<Button
Grid.Column="2"
BackgroundColor="Red"
Command="{Binding ClearFormCommand}"
FontAttributes="Bold"
FontSize="20"
HorizontalOptions="FillAndExpand"
Text="Ok"
TextColor="White"
VerticalOptions="Center" />
<Button
Grid.Column="3"
BackgroundColor="OrangeRed"
Command="{Binding ClearFormCommand}"
FontAttributes="Bold"
FontSize="20"
HorizontalOptions="FillAndExpand"
Text="Ok"
TextColor="White"
VerticalOptions="Center" />
</Grid>
</Grid>
</StackLayout>
Update:
Those items are cutted how to make more space for those item's texts?
Setting Picker ColumnDefinitions width=80 or higher.
How to make this more to the left?
Try to set Label HorizontalOptions="StartAndExpand"
When i select item in listview i only see colored orange line - how to make full item select?
Delete ListView ViewCell grid and Lable BackgroundColor="WhiteSmoke"
<StackLayout Orientation="Vertical">
<Grid HorizontalOptions="FillAndExpand">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Label
Grid.Column="0"
Padding="30,1,1,1"
FontAttributes="None"
FontSize="16"
HorizontalOptions="FillAndExpand"
Text="{Binding SelectedOrder.OrderId, StringFormat='NUMER ZAMÓWIENIA: {0}'}"
TextColor="Gray"
VerticalOptions="Center" />
<Label
Grid.Column="1"
HorizontalOptions="FillAndExpand"
Text=" " />
<Label
Grid.Column="2"
FontSize="15"
HorizontalOptions="Start"
Text="KLIENT:"
VerticalOptions="Center" />
<Label
Grid.Column="3"
Padding="5,1,1,1"
FontAttributes="None"
FontSize="16"
HorizontalOptions="FillAndExpand"
Text="{Binding SelectedClient.Value, StringFormat='{0}'}"
TextColor="Gray"
VerticalOptions="Center" />
<Label
Grid.Column="4"
HorizontalOptions="StartAndExpand"
Text="NA DZIEŃ:"
VerticalOptions="Center" />
<DatePicker
Grid.Column="5"
Date="{Binding SelectedTargetDate, Mode=TwoWay}"
Format="dd.MM.yyyy"
HorizontalOptions="StartAndExpand" />
</Grid>
<Grid Margin="5" HorizontalOptions="FillAndExpand">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="80" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Label
Grid.Column="0"
Padding="30,1,1,1"
FontAttributes="None"
FontSize="15"
HorizontalOptions="FillAndExpand"
Text="BUTLA:"
TextColor="Gray"
VerticalOptions="Center" />
<Picker
Title="BUTLA"
Grid.Column="1"
FontSize="15"
HorizontalOptions="FillAndExpand"
ItemDisplayBinding="{Binding Value}"
ItemsSource="{Binding Bottles}"
SelectedIndex="{Binding Id}"
SelectedItem="{Binding SelectedBottle, Mode=TwoWay}"
VerticalOptions="Center" />
<Label
Grid.Column="2"
HorizontalOptions="FillAndExpand"
Text=" " />
<Label
Grid.Column="3"
FontSize="15"
HorizontalOptions="Start"
Text="ILOŚĆ:"
VerticalOptions="Center" />
<Entry
Grid.Column="4"
HorizontalOptions="Start"
Keyboard="Numeric"
MaxLength="5"
Placeholder="Ilość"
Text="{Binding SelectedAmount, Mode=TwoWay}" />
</Grid>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<!-- Listview section -->
<ListView
ItemsSource="{Binding bottles}"
SelectedItem="{Binding SelectedItem, Mode=TwoWay}"
VerticalScrollBarVisibility="Always">
<ListView.Header>
<Grid BackgroundColor="White">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="1*" />
<ColumnDefinition Width="1*" />
<ColumnDefinition Width="1*" />
<ColumnDefinition Width="1*" />
</Grid.ColumnDefinitions>
<Label
Grid.Column="0"
Margin="1"
BackgroundColor="LightBlue"
FontAttributes="Bold"
FontSize="Medium"
HorizontalOptions="Fill"
HorizontalTextAlignment="Center"
Text="Nazwa butli"
TextColor="White" />
<Label
Grid.Column="1"
Margin="1"
BackgroundColor="LightBlue"
FontAttributes="Bold"
FontSize="Medium"
HorizontalOptions="Fill"
HorizontalTextAlignment="Center"
Text="Pełna?"
TextColor="White" />
<Label
Grid.Column="2"
Margin="1"
BackgroundColor="LightBlue"
FontAttributes="Bold"
FontSize="Medium"
HorizontalOptions="Fill"
HorizontalTextAlignment="Center"
Text="Ilość"
TextColor="White" />
<Label
Grid.Column="3"
Margin="1"
BackgroundColor="LightBlue"
FontAttributes="Bold"
FontSize="Medium"
HorizontalOptions="Fill"
HorizontalTextAlignment="Center"
Text="Kwota"
TextColor="White" />
</Grid>
</ListView.Header>
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Label
Grid.Column="0"
HorizontalOptions="Fill"
HorizontalTextAlignment="Center"
Text="{Binding BottleTypeName}" />
<Label
Grid.Column="1"
HorizontalOptions="Fill"
HorizontalTextAlignment="Center"
Text="{Binding BottleIsFilled}" />
<Label
Grid.Column="2"
HorizontalOptions="Fill"
HorizontalTextAlignment="Center"
Text="{Binding Amount}" />
<Label
Grid.Column="3"
HorizontalOptions="Fill"
HorizontalTextAlignment="Center"
Text="{Binding Price}" />
</Grid>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
<!-- Buttons section -->
<Grid Grid.Row="1" VerticalOptions="End">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="33.33*" />
<ColumnDefinition Width="33.33*" />
<ColumnDefinition Width="33.33*" />
<ColumnDefinition Width="33.33*" />
</Grid.ColumnDefinitions>
<Button
Grid.Column="0"
BackgroundColor="DarkMagenta"
Command="{Binding SaveBottleCommand}"
FontAttributes="Bold"
FontSize="20"
HorizontalOptions="FillAndExpand"
Text="Dodaj butlę"
TextColor="White"
VerticalOptions="Fill" />
<Button
Grid.Column="1"
BackgroundColor="MediumVioletRed"
Command="{Binding RemoveBottleCommand}"
FontAttributes="Bold"
FontSize="20"
HorizontalOptions="FillAndExpand"
Text="Usuń butlę"
TextColor="White"
VerticalOptions="Center" />
<Button
Grid.Column="2"
BackgroundColor="Red"
Command="{Binding ClearFormCommand}"
FontAttributes="Bold"
FontSize="20"
HorizontalOptions="FillAndExpand"
Text="Ok"
TextColor="White"
VerticalOptions="Center" />
<Button
Grid.Column="3"
BackgroundColor="OrangeRed"
Command="{Binding ClearFormCommand}"
FontAttributes="Bold"
FontSize="20"
HorizontalOptions="FillAndExpand"
Text="Ok"
TextColor="White"
VerticalOptions="Center" />
</Grid>
</Grid>
</StackLayout>

set border to listview Xamarin form

I made a table with xamarin forms, but I would like the headers not to have blank spaces and also put borders, use table-striped, have the basic characteristics of a bootstrap table for example. Could you help me?. Thank you for you help.
Here my code.
<StackLayout BindingContext="{Binding OpportunityListViewModel}" Padding="8">
<ListView x:Name="ProposalListProduct"
ItemsSource="{Binding ProposalView}"
IsRefreshing="{Binding IsRefreshing}"
CachingStrategy="RecycleElement"
HasUnevenRows="True"
Margin="0">
<ListView.Header>
<Grid Margin="0" Padding="0" RowSpacing="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="50*" />
<ColumnDefinition Width="10*" />
<ColumnDefinition Width="20*" />
<ColumnDefinition Width="20*" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="20" />
</Grid.RowDefinitions>
<Label Grid.Row="0" Grid.Column="0" Margin="0" Text="Item" FontSize="8" TextColor="Black" BackgroundColor="LightGray" HorizontalTextAlignment="Center" HorizontalOptions="Fill" />
<Label Grid.Row="0" Grid.Column="1" Margin="0" Text="Cant." FontSize="8" TextColor="Black" BackgroundColor="LightGray" HorizontalTextAlignment="Center" HorizontalOptions="Fill" />
<Label Grid.Row="0" Grid.Column="2" Margin="0" Text="Precio" FontSize="8" TextColor="Black" BackgroundColor="LightGray" HorizontalTextAlignment="Center" HorizontalOptions="Fill" />
<Label Grid.Row="0" Grid.Column="3" Margin="0" Text="Total" FontSize="8" TextColor="Black" BackgroundColor="LightGray" HorizontalTextAlignment="Center" HorizontalOptions="Fill" />
</Grid>
</ListView.Header>
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<ViewCell.View>
<Grid Margin="0" Padding="0" RowSpacing="0" ColumnSpacing="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="50*" />
<ColumnDefinition Width="10*" />
<ColumnDefinition Width="20*" />
<ColumnDefinition Width="20*" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="20" />
</Grid.RowDefinitions>
<Label Grid.Column="0" Margin="0" x:Name="Nombre" Text="{Binding Nombre}" FontSize="8" TextColor="Black" VerticalTextAlignment="End" HorizontalTextAlignment="Start" />
<Label Grid.Column="1" Margin="0" x:Name="Cantidad" Text="{Binding Cantidad}" FontSize="8" TextColor="Black" VerticalTextAlignment="End" HorizontalTextAlignment="End"/>
<Label Grid.Column="2" Margin="0" x:Name="Precio" Text="{Binding Precio,StringFormat='{0:C2}'}" FontSize="8" TextColor="Black" VerticalTextAlignment="End" HorizontalTextAlignment="End"/>
<Label Grid.Column="3" Margin="0" x:Name="Total" Text="{Binding Total,StringFormat='{0:C2}'}" FontSize="8" TextColor="Black" VerticalTextAlignment="End" HorizontalTextAlignment="End"/>
</Grid>
</ViewCell.View>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</StackLayout>

you can do it like this:
<ListView ItemsSource="{Binding People}"
HasUnevenRows="True"
SeparatorVisibility="None">
<ListView.Header>
<Frame>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Label Text="Name"
HorizontalOptions="Center"
FontSize="Large"/>
<Label Grid.Column="1"
Text="Description"
HorizontalOptions="Center"
FontSize="Large"/>
<BoxView Grid.Row="1"
Grid.ColumnSpan="2"
HeightRequest="1"
BackgroundColor="LightGray"/>
</Grid>
</Frame>
</ListView.Header>
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<Grid Margin="20,10">
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Label Text="{Binding Name}"
HorizontalOptions="Center"
VerticalOptions="Center"/>
<Label Grid.Column="1"
Text="{Binding Description}"
HorizontalOptions="Center"
VerticalOptions="Center"/>
<BoxView Grid.Row="1"
Grid.ColumnSpan="2"
HeightRequest="1"
BackgroundColor="LightGray"/>
</Grid>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>

Xamarin Form retains space between BoxView and Button even after applying spacing and padding

I have following ContentPage in Xamarin Forms. It has a grid. I have applied ColumnSpacing="0" RowSpacing="0" Padding="0" for grid. And I have applied Margin="0" for BoxView and Button. Still there is space between BoxView and Button.
What is the best way to avoid this unwanted spacing?
XAML
<Grid x:Name="controlGrid" ColumnSpacing="0" RowSpacing="0" Padding="0">
<Grid.RowDefinitions>
<RowDefinition Height="4*" />
<RowDefinition Height="4*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<!--Row 1-->
<views:SKCanvasView PaintSurface="OnSecondPainting" Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="2" >
</views:SKCanvasView>
<!--Row 2-->
<Grid x:Name="secondGrid" Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="2" ColumnSpacing="0" RowSpacing="0" Padding="0">
<Grid.RowDefinitions>
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<BoxView Grid.Row="0" Grid.Column="0" BackgroundColor="Red" HeightRequest="1" VerticalOptions="End" HorizontalOptions="FillAndExpand" Margin="0" />
<BoxView Grid.Row="0" Grid.Column="0" BackgroundColor="Green" HeightRequest="1" VerticalOptions="Start" HorizontalOptions="FillAndExpand" Margin="0"/>
<BoxView Grid.Row="0" Grid.Column="0" BackgroundColor="Blue" WidthRequest="1" VerticalOptions="FillAndExpand" HorizontalOptions="End" Margin="0"/>
<BoxView Grid.Row="0" Grid.Column="0" BackgroundColor="Orange" WidthRequest="1" VerticalOptions="FillAndExpand" HorizontalOptions="Start" Margin="0"/>
<BoxView Grid.Row="0" Grid.Column="1" BackgroundColor="Crimson" HeightRequest="1" VerticalOptions="End" HorizontalOptions="FillAndExpand" Margin="0" />
<BoxView Grid.Row="0" Grid.Column="1" BackgroundColor="Cyan" HeightRequest="1" VerticalOptions="Start" HorizontalOptions="FillAndExpand" Margin="0"/>
<BoxView Grid.Row="0" Grid.Column="1" BackgroundColor="Blue" WidthRequest="1" VerticalOptions="FillAndExpand" HorizontalOptions="End" Margin="0"/>
<BoxView Grid.Row="0" Grid.Column="1" BackgroundColor="Orange" WidthRequest="1" VerticalOptions="FillAndExpand" HorizontalOptions="Start" Margin="0"/>
<Button x:Name="ClickMe1" Text="ClickMe 1" Grid.Row="0" Grid.Column="0" Margin="0" />
<Button x:Name="ClickMe2" Text="ClickMe 2" Grid.Row="0" Grid.Column="1" Margin="0" />
</Grid>
</Grid>
Screenshot

Button has a default padding.So there will be space always when you try to align buttons together. Either you have to give -ve margin or else instead of button you have to use stacklayout/boxview with gesture for tap commands.
Check this:
<Grid x:Name="controlGrid" ColumnSpacing="0" RowSpacing="0" Padding="0">
<Grid.RowDefinitions>
<RowDefinition Height="4*" />
<RowDefinition Height="4*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<!--Row 2-->
<Grid x:Name="secondGrid" Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="2" ColumnSpacing="0" RowSpacing="0" Padding="0">
<Grid.RowDefinitions>
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<BoxView Grid.Row="0" Grid.Column="0" BackgroundColor="Red" HeightRequest="1" VerticalOptions="End" HorizontalOptions="FillAndExpand" Margin="0" />
<BoxView Grid.Row="0" Grid.Column="0" BackgroundColor="Green" HeightRequest="1" VerticalOptions="Start" HorizontalOptions="FillAndExpand" Margin="0"/>
<BoxView Grid.Row="0" Grid.Column="0" BackgroundColor="Blue" WidthRequest="1" VerticalOptions="FillAndExpand" HorizontalOptions="End" Margin="0"/>
<BoxView Grid.Row="0" Grid.Column="0" BackgroundColor="Orange" WidthRequest="1" VerticalOptions="FillAndExpand" HorizontalOptions="Start" Margin="0"/>
<BoxView Grid.Row="0" Grid.Column="1" BackgroundColor="Crimson" HeightRequest="1" VerticalOptions="End" HorizontalOptions="FillAndExpand" Margin="0" />
<BoxView Grid.Row="0" Grid.Column="1" BackgroundColor="Cyan" HeightRequest="1" VerticalOptions="Start" HorizontalOptions="FillAndExpand" Margin="0"/>
<BoxView Grid.Row="0" Grid.Column="1" BackgroundColor="Blue" WidthRequest="1" VerticalOptions="FillAndExpand" HorizontalOptions="End" Margin="0"/>
<BoxView Grid.Row="0" Grid.Column="1" BackgroundColor="Orange" WidthRequest="1" VerticalOptions="FillAndExpand" HorizontalOptions="Start" Margin="0"/>
<StackLayout Grid.Row="0" Grid.Column="0" HorizontalOptions="FillAndExpand" Margin="1" VerticalOptions="FillAndExpand" BackgroundColor="Gray">
<StackLayout.GestureRecognizers>
<TapGestureRecognizer Command="{Binding Button1Command}"/>
</StackLayout.GestureRecognizers>
<Label Text="Click Me1" HorizontalOptions="Center" VerticalOptions="CenterAndExpand"/>
</StackLayout>
<StackLayout Grid.Row="0" Grid.Column="1" HorizontalOptions="FillAndExpand" Margin="1" VerticalOptions="FillAndExpand" BackgroundColor="Gray">
<StackLayout.GestureRecognizers>
<TapGestureRecognizer Command="{Binding Button1Command}"/>
</StackLayout.GestureRecognizers>
<Label Text="Click Me2" HorizontalOptions="Center" VerticalOptions="CenterAndExpand"/>
</StackLayout>
</Grid>
</Grid>