首页 > 解决方案 > Xaml ListView 以编程方式 C# 导致奇怪的行为

问题描述

我需要以编程方式添加一个动态变化的列表视图......但我遇到了一个非常奇怪的布局。我觉得我忽略了一些东西。我需要每一行分别显示射手姓名、球队名称和他们的分数。签出代码。对此进行了编辑,以使其更易于阅读和理解。即使只有一个射击者名字的标签,它也有奇怪的用户界面问题。

    private Grid grid = new Grid() { BackgroundColor = Color.White };
    private BoxView boxview = new BoxView() { BackgroundColor = Color.LightGray };
    private Grid grid2 = new Grid() { BackgroundColor = Color.White, Margin = new Thickness(0, 0, 0, 1), Padding = new Thickness(0, 10, 0, 0) };




        var shooterlabel = new Label() { HorizontalTextAlignment = TextAlignment.Start, Padding = PaddingLeft };
        shooterlabel.SetBinding(Label.TextProperty, new Binding("Shooter_Name"));  

        grid2.Children.Add(shooterlabel, 0, 0);

        //grid.Children.Add(boxview);
        grid.Children.Add(grid2);

        ListView ShooterListView = new ListView() { BackgroundColor = Color.White, SeparatorVisibility = SeparatorVisibility.None, HasUnevenRows = true, VerticalScrollBarVisibility = ScrollBarVisibility.Always };

        var ShooterDataTemplate = new DataTemplate(() =>
        {
            return new ViewCell { View = grid };
        });

        var connect = new ConnectionQuery("Select * From Shooters");
        var list = await connect.GetShooters();
        ShooterListView.ItemsSource = list;

        ShooterListView.ItemTemplate = ShooterDataTemplate;
        ShooterGrid.Children.Add(ShooterListView);

        connect.CloseConnection();

下面是正在发生的事情的屏幕截图。它应该是每一行的名称。我只在 c# 中遇到这个问题,而不是在 xaml 中。我必须让这个在代码后面工作......

奇怪的ui图片

在下面附加 xaml 确实适用于包含的图片。

 <StackLayout x:Name="Test">
            <Grid x:Name="ShooterGrid" >
                <ListView x:Name="ShooterListView" >
                    <ListView.ItemTemplate>
                        <DataTemplate>
                            <ViewCell>
                                <Grid>
                                    <Label Text="{Binding Shooter_Name}" />
                                </Grid>
                            </ViewCell>
                        </DataTemplate>
                    </ListView.ItemTemplate>
                </ListView>
               </Grid>
        </StackLayout>

下面附上的是在 xaml 中完成时正确的 ui。

普通用户界面图像

标签: c#xamllistviewxamarin

解决方案


您可以将其设置HasUnevenRows为 true 以删除您不想要的空间。

完整代码:

public class Page1 : ContentPage
{
    public static ObservableCollection<Names> names { get; set; }
    public Page1()
    {
        ObservableCollection<Names> names = new ObservableCollection<Names>()
        {
             new Names(){ Shooter_Name="Brain Palmer"},
             new Names(){ Shooter_Name="John Hagee"},
             new Names(){ Shooter_Name="Anget Jones"},
             new Names(){ Shooter_Name="Ron Kelly"},
             new Names(){ Shooter_Name="Jay Knight"},
             new Names(){ Shooter_Name="Jamie Redferm"},
             new Names(){ Shooter_Name="John Randolf"},
             new Names(){ Shooter_Name="Johnny Reddings"},
             new Names(){ Shooter_Name="Johnny john"},
             new Names(){ Shooter_Name="James Dun"},
             new Names(){ Shooter_Name="James Green"},
             new Names(){ Shooter_Name="Sunny Perdue"},
             new Names(){ Shooter_Name="John Gree"},
             new Names(){ Shooter_Name="Jamoe Parrott"},
        };

        ListView ShooterListView = new ListView() { HasUnevenRows = true };
        ShooterListView.ItemsSource = names;
        ShooterListView.ItemTemplate = new DataTemplate(() =>
        {
            Grid grid = new Grid();


            Label NameLabel = new Label();

            NameLabel.SetBinding(Label.TextProperty, "Shooter_Name");

            grid.Children.Add(NameLabel);
            return new ViewCell { View = grid };
        });
        //DataTemplate dt = new DataTemplate(typeof(TextCell));
        //dt.SetBinding(TextCell.TextProperty, new Binding("Shooter_Name"));
        //ShooterListView.ItemTemplate= dt;


        Content = new StackLayout
        {

            Children = {
              ShooterListView
            }
        };

        this.BindingContext = this;
    }
}

public class Names
{
    public string Shooter_Name { get; set; }
}

前:

在此处输入图像描述

后:

在此处输入图像描述


推荐阅读