How to arrange the data from ListView exactly below the labels using xamarin?-CodePudding

I want to arrange the data from ListView to be exactly below the Labels.

For now ListView look like this:

What is the option to arrange the data just above of labels ?

My Code:

 <StackLayout>
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*"/>
                        <ColumnDefinition Width="*"/>
                        <ColumnDefinition Width="*"/>
                        <ColumnDefinition Width="*"/>
                        <ColumnDefinition Width="*"/>
                        <ColumnDefinition Width="*"/>
                        <ColumnDefinition Width="*"/>
                        <ColumnDefinition Width="*"/>
                    </Grid.ColumnDefinitions>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto" />
                        <RowDefinition Height="Auto" />
                    </Grid.RowDefinitions>

                    <Label  TextColor="White" Grid.ColumnSpan="3" Grid.Row="0" HorizontalTextAlignment="Center" VerticalTextAlignment="Center" FontAttributes="Bold"/>
                    <Label Text="Станция:" BackgroundColor="#6588cf" TextColor="White" Grid.Column="0" Grid.Row="1" HorizontalTextAlignment="Center" VerticalTextAlignment="Center" FontAttributes="Bold" FontSize="15"/>
                    <Label Text="Име:" BackgroundColor="#6588cf" TextColor="White" Grid.Column="1" Grid.Row="1" HorizontalTextAlignment="Center" VerticalTextAlignment="Center" FontAttributes="Bold" FontSize="15"/>
                    <Label Text="Дата:" BackgroundColor="#6588cf" TextColor="White" Grid.Column="2" Grid.Row="1" HorizontalTextAlignment="Center" VerticalTextAlignment="Center" FontAttributes="Bold" FontSize="15"/>
                    <Label Text="Мин. Стоеж:" BackgroundColor="#6588cf" TextColor="White" Grid.Column="3" Grid.Row="1" HorizontalTextAlignment="Center" VerticalTextAlignment="Center" FontAttributes="Bold" FontSize="15"/>
                    <Label Text="Ср. Стоеж:" BackgroundColor="#6588cf" TextColor="White" Grid.Column="4" Grid.Row="1" HorizontalTextAlignment="Center" VerticalTextAlignment="Center" FontAttributes="Bold" FontSize="15"/>
                    <Label Text="Макс. Стоеж:" BackgroundColor="#6588cf" TextColor="White" Grid.Column="5" Grid.Row="1" HorizontalTextAlignment="Center" VerticalTextAlignment="Center" FontAttributes="Bold" FontSize="15"/>
                    <Label Text="Делта:" BackgroundColor="#6588cf" TextColor="White" Grid.Column="6" Grid.Row="1" HorizontalTextAlignment="Center" VerticalTextAlignment="Center" FontAttributes="Bold" FontSize="15"/>
                    <Label Text="Макс. Делта:" BackgroundColor="#6588cf" TextColor="White" Grid.Column="7" Grid.Row="1" HorizontalTextAlignment="Center" VerticalTextAlignment="Center" FontAttributes="Bold" FontSize="15"/>
                </Grid>

            </StackLayout>

            <StackLayout VerticalOptions="EndAndExpand" Margin="0,0,0,20">
                <ListView x:Name="lstLevel" HasUnevenRows="True" BackgroundColor="#f7f77c">
                    <ListView.ItemTemplate>
                        <DataTemplate>
                            <ViewCell>
                                <ViewCell.View>
                                    <Grid BackgroundColor="#f7f77c">
                                        <Grid.RowDefinitions>
                                            <RowDefinition Height="*"></RowDefinition>
                                            <RowDefinition Height="2"></RowDefinition>

                                        </Grid.RowDefinitions>
                                        <Grid.ColumnDefinitions>
                                            <ColumnDefinition Width="*"></ColumnDefinition>
                                            <ColumnDefinition Width="*"></ColumnDefinition>
                                            <ColumnDefinition Width="*"></ColumnDefinition>
                                            <ColumnDefinition Width="*"></ColumnDefinition>
                                            <ColumnDefinition Width="*"></ColumnDefinition>
                                            <ColumnDefinition Width="*"></ColumnDefinition>
                                            <ColumnDefinition Width="*"></ColumnDefinition>
                                            <ColumnDefinition Width="*"></ColumnDefinition>
                                            <ColumnDefinition Width="*"></ColumnDefinition>
                                        </Grid.ColumnDefinitions>
                                        <Label Grid.Row="0" Grid.Column="0" Text="{Binding Station}" XAlign="Start" YAlign="Center" TextColor="Black" FontAttributes="Bold" FontSize="Small"/>
                                        <Label Grid.Row="0" Grid.Column="1" Text="{Binding Ime}" XAlign="Center" YAlign="Center" TextColor="Black" FontAttributes="Bold" FontSize="Small"/>
                                        <Label Grid.Row="0" Grid.Column="2" Text="{Binding Dat, StringFormat='{0:dd.MM.yyyy}'}" XAlign="Center" YAlign="Center" TextColor="Black" FontAttributes="Bold" FontSize="Small"/>
                                        <Label Grid.Row="0" Grid.Column="3" Text="{Binding MinStoej}" XAlign="Center" YAlign="Center" TextColor="Black" FontAttributes="Bold" FontSize="Small"/>
                                        <Label Grid.Row="0" Grid.Column="4" Text="{Binding AvgStoej}" XAlign="Center" YAlign="Center" TextColor="Black" FontAttributes="Bold" FontSize="Small"/>
                                        <Label Grid.Row="0" Grid.Column="5" Text="{Binding MaxStoej}" XAlign="Center" YAlign="Center" TextColor="Black" FontAttributes="Bold" FontSize="Small"/>
                                        <Label Grid.Row="0" Grid.Column="6" Text="{Binding Delta}" XAlign="Center" YAlign="Center" TextColor="Black" FontAttributes="Bold" FontSize="Small"/>
                                        <Label Grid.Row="0" Grid.Column="7" Text="{Binding DeltaMax}" XAlign="Center" YAlign="Center" TextColor="Black" FontAttributes="Bold" FontSize="Small"/>
                                        <BoxView Color="#001aff" HeightRequest="1" Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="9"/>
                                    </Grid>
                                </ViewCell.View>
                            </ViewCell>
                        </DataTemplate>
                    </ListView.ItemTemplate>
                </ListView>
            </StackLayout>

I think the columns are correct, but the data from the grid itself needs to be shifted to the left. What is the right approach to do this?

CodePudding user response：

please try add the grid in listview header with same colm width.

<ListView x:Name="listViewm" ItemsSource="{Binding MyItems}">
    <ListView.Header>
        <Grid BackgroundColor="Black">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="1*" />
                <ColumnDefinition Width="1*" />
                <ColumnDefinition Width="1*" />
                <ColumnDefinition Width="1*" />
            </Grid.ColumnDefinitions>
            <Label  TextColor="White" Grid.ColumnSpan="3" Grid.Row="0" HorizontalTextAlignment="Center" VerticalTextAlignment="Center" FontAttributes="Bold"/>
                    <Label Text="Станция:" BackgroundColor="#6588cf" TextColor="White" Grid.Column="0" Grid.Row="1" HorizontalTextAlignment="Center" VerticalTextAlignment="Center" FontAttributes="Bold" FontSize="15"/>
                    <Label Text="Име:" BackgroundColor="#6588cf" TextColor="White" Grid.Column="1" Grid.Row="1" HorizontalTextAlignment="Center" VerticalTextAlignment="Center" FontAttributes="Bold" FontSize="15"/>
                    <Label Text="Дата:" BackgroundColor="#6588cf" TextColor="White" Grid.Column="2" Grid.Row="1" HorizontalTextAlignment="Center" VerticalTextAlignment="Center" FontAttributes="Bold" FontSize="15"/>
                    <Label Text="Мин. Стоеж:" BackgroundColor="#6588cf" TextColor="White" Grid.Column="3" Grid.Row="1" HorizontalTextAlignment="Center" VerticalTextAlignment="Center" FontAttributes="Bold" FontSize="15"/>
                    <Label Text="Ср. Стоеж:" BackgroundColor="#6588cf" TextColor="White" Grid.Column="4" Grid.Row="1" HorizontalTextAlignment="Center" VerticalTextAlignment="Center" FontAttributes="Bold" FontSize="15"/>
                    <Label Text="Макс. Стоеж:" BackgroundColor="#6588cf" TextColor="White" Grid.Column="5" Grid.Row="1" HorizontalTextAlignment="Center" VerticalTextAlignment="Center" FontAttributes="Bold" FontSize="15"/>
                    <Label Text="Делта:" BackgroundColor="#6588cf" TextColor="White" Grid.Column="6" Grid.Row="1" HorizontalTextAlignment="Center" VerticalTextAlignment="Center" FontAttributes="Bold" FontSize="15"/>
                    <Label Text="Макс. Делта:" BackgroundColor="#6588cf" TextColor="White" Grid.Column="7" Grid.Row="1" HorizontalTextAlignment="Center" VerticalTextAlignment="Center" FontAttributes="Bold" FontSize="15"/>
                
        </Grid>
    </ListView.Header>

    <ListView.ItemTemplate>
        <DataTemplate>
            <ViewCell>
                <Grid BackgroundColor="Black">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="1*" />
                        <ColumnDefinition Width="1*" />
                        <ColumnDefinition Width="1*" />
                        <ColumnDefinition Width="1*" />
                    </Grid.ColumnDefinitions>
                    <Label Grid.Row="0" Grid.Column="0" Text="{Binding Station}" XAlign="Start" YAlign="Center" TextColor="Black" FontAttributes="Bold" FontSize="Small"/>
                                        <Label Grid.Row="0" Grid.Column="1" Text="{Binding Ime}" XAlign="Center" YAlign="Center" TextColor="Black" FontAttributes="Bold" FontSize="Small"/>
                                        <Label Grid.Row="0" Grid.Column="2" Text="{Binding Dat, StringFormat='{0:dd.MM.yyyy}'}" XAlign="Center" YAlign="Center" TextColor="Black" FontAttributes="Bold" FontSize="Small"/>
                                        <Label Grid.Row="0" Grid.Column="3" Text="{Binding MinStoej}" XAlign="Center" YAlign="Center" TextColor="Black" FontAttributes="Bold" FontSize="Small"/>
                                        <Label Grid.Row="0" Grid.Column="4" Text="{Binding AvgStoej}" XAlign="Center" YAlign="Center" TextColor="Black" FontAttributes="Bold" FontSize="Small"/>
                                        <Label Grid.Row="0" Grid.Column="5" Text="{Binding MaxStoej}" XAlign="Center" YAlign="Center" TextColor="Black" FontAttributes="Bold" FontSize="Small"/>
                                        <Label Grid.Row="0" Grid.Column="6" Text="{Binding Delta}" XAlign="Center" YAlign="Center" TextColor="Black" FontAttributes="Bold" FontSize="Small"/>
                                        <Label Grid.Row="0" Grid.Column="7" Text="{Binding DeltaMax}" XAlign="Center" YAlign="Center" TextColor="Black" FontAttributes="Bold" FontSize="Small"/>
                                        <BoxView Color="#001aff" HeightRequest="1" Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="9"/>
                                   
                </Grid>
            </ViewCell>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>