Hi,
I'm having some trouble with my buttons. I simply can't make them fill the entire cell. I suspect it has some Margin and/or Padding set somewhere, but I tried to make all of them 0 still nothing. I even set them like -200 but they had still some space between them. I tried different ideas found on forums like setting HorizontalAlignment="Stretch" but I got that no property HorizontalAlingment exists in type Button. My basic idea is to practice a little bit and rebuild Androids calculator with Xamarin. In that app the buttons have 0 maring and padding and are nicely filling out the whole cell and the whole screen.
So here is my code. Its quite long but most of it is just the same code with different name and text.
<?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"
xmlns:controls="clr-namespace:XLabs.Forms.Controls;assembly=XLabs.Forms"
mc:Ignorable="d"
x:Class="Calculator.Views.BasicCalculatorPage"
Title="Basic calculator">
<ContentPage.Content>
<Grid
Margin="0,30,0,0"
Padding="0">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<controls:ExtendedLabel Grid.Row="0"
Margin="0,0,30,0"
HorizontalOptions="End"
Text="012345667"
FontSize="40"/>
<controls:ExtendedLabel
Grid.Row="1"
Margin="0,0,30,0"
FontSize="20"
Text="012345667"
HorizontalOptions="End"/>
<Grid
Grid.Row="2"
Margin="0"
Padding="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="0.2*"/>
<RowDefinition Height="0.2*"/>
<RowDefinition Height="0.2*"/>
<RowDefinition Height="0.2*"/>
<RowDefinition Height="0.2*"/>
</Grid.RowDefinitions>
<Grid
Grid.Row="0"
Margin="0"
Padding="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="0.25*"/>
<ColumnDefinition Width="0.25*"/>
<ColumnDefinition Width="0.25*"/>
<ColumnDefinition Width="0.25*"/>
</Grid.ColumnDefinitions>
<controls:ExtendedButton
Grid.Column="0"
Padding="0"
Margin="0"
x:Name="btnClear"
Text="C"
FontSize="32"
TextColor="CadetBlue"/>
<controls:ExtendedButton
Grid.Column="1"
Padding="0"
Margin="0"
x:Name="btnDiv"
Text="/"
FontSize="32"
TextColor="CadetBlue"/>
<controls:ExtendedButton
Grid.Column="2"
Padding="0"
Margin="0"
x:Name="btnMultiple"
Text="X"
FontSize="32"
TextColor="CadetBlue"/>
<controls:ExtendedButton
Grid.Column="3"
Padding="0"
Margin="0"
x:Name="btnBackspace"
Text="<-"
FontSize="32"
TextColor="CadetBlue"/>
</Grid>
<Grid
Grid.Row="1">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="0.25*"/>
<ColumnDefinition Width="0.25*"/>
<ColumnDefinition Width="0.25*"/>
<ColumnDefinition Width="0.25*"/>
</Grid.ColumnDefinitions>
<controls:ExtendedButton
Grid.Column="0"
Padding="0"
Margin="0"
x:Name="btn7"
Text="7"
FontSize="32"
TextColor="Black"/>
<controls:ExtendedButton
Grid.Column="1"
Padding="0"
Margin="0"
x:Name="btn8"
Text="8"
FontSize="32"
TextColor="Black"/>
<controls:ExtendedButton
Grid.Column="2"
Padding="0"
Margin="0"
x:Name="btn9"
Text="9"
FontSize="32"
TextColor="Black"/>
<controls:ExtendedButton
Grid.Column="3"
Padding="0"
Margin="0"
x:Name="btnMinus"
Text="-"
FontSize="32"
TextColor="CadetBlue"/>
</Grid>
<Grid
Grid.Row="2">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="0.25*"/>
<ColumnDefinition Width="0.25*"/>
<ColumnDefinition Width="0.25*"/>
<ColumnDefinition Width="0.25*"/>
</Grid.ColumnDefinitions>
<controls:ExtendedButton
Grid.Column="0"
Padding="0"
Margin="0"
x:Name="btn4"
Text="4"
FontSize="32"
TextColor="Black"/>
<controls:ExtendedButton
Grid.Column="1"
Padding="0"
Margin="0"
x:Name="btn5"
Text="5"
FontSize="32"
TextColor="Black"/>
<controls:ExtendedButton
Grid.Column="2"
Padding="0"
Margin="0"
x:Name="btn6"
Text="6"
FontSize="32"
TextColor="Black"/>
<controls:ExtendedButton
Grid.Column="3"
Padding="0"
Margin="0"
x:Name="btnAdd"
Text="+"
FontSize="32"
TextColor="CadetBlue"/>
</Grid>
<Grid
Grid.Row="3">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="0.25*"/>
<ColumnDefinition Width="0.25*"/>
<ColumnDefinition Width="0.25*"/>
<ColumnDefinition Width="0.25*"/>
</Grid.ColumnDefinitions>
<controls:ExtendedButton
Grid.Column="0"
Padding="0"
Margin="0"
x:Name="btn1"
Text="1"
FontSize="32"
TextColor="Black"/>
<controls:ExtendedButton
Grid.Column="1"
Padding="0"
Margin="0"
x:Name="btn2"
Text="2"
FontSize="32"
TextColor="Black"/>
<controls:ExtendedButton
Grid.Column="2"
Padding="0"
Margin="0"
x:Name="btn3"
Text="3"
FontSize="32"
TextColor="Black"/>
</Grid>
<Grid
Grid.Row="4">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="0.25*"/>
<ColumnDefinition Width="0.25*"/>
<ColumnDefinition Width="0.25*"/>
<ColumnDefinition Width="0.25*"/>
</Grid.ColumnDefinitions>
<controls:ExtendedButton
Grid.Column="0"
Padding="0"
Margin="0"
x:Name="btnPercent"
Text="%"
FontSize="32"
TextColor="Black"/>
<controls:ExtendedButton
Grid.Column="1"
Padding="0"
Margin="0"
x:Name="btn0"
Text="0"
FontSize="32"
TextColor="Black"/>
<controls:ExtendedButton
Grid.Column="2"
Padding="0"
Margin="0"
x:Name="btnDot"
Text="."
FontSize="32"
TextColor="Black"/>
<controls:ExtendedButton
Grid.Column="3"
Padding="0"
Margin="0"
x:Name="btnEqu"
Text="="
FontSize="32"
TextColor="White"
BackgroundColor="CadetBlue"/>
</Grid>
</Grid>
</Grid>
</ContentPage.Content>
</ContentPage>
Thank you for your help! 