Grid Column Definition Alignment and Width-CodePudding

I'm trying to create a simple grid with 3 columns and a 6 rows. I have defined the heights and width of the rows and columns However, the entire grid always starts from the middle of the screen. The entire left hand side of the screen is empty.

<Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="60"/>
                <RowDefinition Height="60"/>
                <RowDefinition Height="60"/>
                <RowDefinition Height="60"/>
                <RowDefinition Height="60"/>
                <RowDefinition Height="60"/>
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="120"/>
                <ColumnDefinition Width="Auto"/>
                <ColumnDefinition Width="60"/>
            </Grid.ColumnDefinitions>
            <Label Text="Height: " FontSize="Medium" Grid.Row="1" Grid.Column="1" BackgroundColor="Blue"/>
            <Entry x:Name="heightEntry" FontSize="Medium" Grid.Row="1" Grid.Column="2" BackgroundColor="Blue"/>
            <Label Text=" cm" FontSize="Medium" Grid.Row="1" Grid.Column="3" BackgroundColor="Blue"/>
            <Label Text="Width: " FontSize="Medium" Grid.Row="2" Grid.Column="1" BackgroundColor="Blue"/>
            <Entry x:Name="widthEntry" FontSize="Medium" Grid.Row="2" Grid.Column="2" BackgroundColor="Blue"/>
            <Label Text=" cm" FontSize="Medium" Grid.Row="2" Grid.Column="3" BackgroundColor="Blue"/>
            <Label Text="Depth: " FontSize="Medium" Grid.Row="3" Grid.Column="1" BackgroundColor="Blue"/>
            <Entry x:Name="depthEntry" FontSize="Medium" Grid.Row="3" Grid.Column="2" BackgroundColor="Blue"/>
            <Label Text=" cm" FontSize="Medium" Grid.Row="3" Grid.Column="3" BackgroundColor="Blue"/>
            <Label Text="Weight (Full): " FontSize="Medium" Grid.Row="4" Grid.Column="1" BackgroundColor="Blue"/>
            <Entry x:Name="weightEntry" FontSize="Medium" Grid.Row="4" Grid.Column="2" BackgroundColor="Blue"/>
            <Label Text=" g" FontSize="Medium" Grid.Row="4" Grid.Column="3" BackgroundColor="Blue"/>
            <Label Text="CaseQty: " FontSize="Medium" Grid.Row="5" Grid.Column="1" BackgroundColor="Blue"/>
            <Entry x:Name="qtyEntry" FontSize="Medium" Grid.Row="5" Grid.Column="2" BackgroundColor="Blue"/>
            <Label Text="Box Count: " FontSize="Medium" Grid.Row="6" Grid.Column="1" BackgroundColor="Blue"/>
            <Entry x:Name="boxEntry" FontSize="Medium" Grid.Row="6" Grid.Column="2" BackgroundColor="Blue"/>
           
        </Grid>

I have tried changing horizontal options of individual elements, the grid itself and the stack layout that its embedded in. Nothing changes. I have also tried changing the widths themselves (column definition) and the WidthRequests of the labels and entries. Nothing changes. I can't figure out what I'm doing wrong. All I want is to have control over the width of each column And to left-align each row. How is this achieved?

CodePudding user response：

For some reason, I have assumed 1-indexing for the grids and columns. It's zero-indexed, which I should have expected. The grid is left aligned. It's just that the above code doesn't put anything into the left column.