Xamarin 最大网格行/列定义

Question

我最近才开始玩 xamarin，但我正在使用 xamarin 制作 roguelike，我想到了为玩家地图使用网格（网格中的每个 X Y 位置都代表随机生成的地图）我遇到了一个障碍，尽管将任何东西放在第 55 列上似乎都会将它们推离屏幕（见下图）

到目前为止，这是我的代码：

StackLayout stackLayout = new StackLayout() { VerticalOptions = LayoutOptions.FillAndExpand };
           Grid grid = new Grid
           {
               VerticalOptions = LayoutOptions.FillAndExpand,
               HorizontalOptions = LayoutOptions.FillAndExpand,
           };
           stackLayout.Children.Add(grid);

           for (int i = 0; i < 300; i++)
           {
               grid.RowDefinitions.Add(new RowDefinition { Height = GridLength.Auto });
               grid.ColumnDefinitions.Add(new ColumnDefinition { Width = GridLength.Auto });
           }
           

           // Row 0
           // The BoxView and Label are in row 0 and column 0, and so only needs to be added to the
           // Grid.Children collection to get default row and column settings.
           grid.Children.Add(new BoxView
           {
               Color = Color.Green
           });
           grid.Children.Add(new Label
           {
               Text = "Row 0, Column 0",
               HorizontalOptions = LayoutOptions.Center,
               VerticalOptions = LayoutOptions.Center
           });

           // This BoxView and Label are in row 0 and column 1, which are specified as arguments
           // to the Add method.
           grid.Children.Add(new BoxView
           {
               Color = Color.Blue
           }, 55, 0);
           grid.Children.Add(new Label
           {
               Text = "Row 0, Column 1",
               HorizontalOptions = LayoutOptions.Center,
               VerticalOptions = LayoutOptions.Center
           }, 1, 0);

           // Row 1
           // This BoxView and Label are in row 1 and column 0, which are specified as arguments
           // to the Add method overload.
           grid.Children.Add(new BoxView
           {
               Color = Color.Teal
           }, 0, 1, 1, 2);
           grid.Children.Add(new Label
           {
               Text = "Row 1, Column 0",
               HorizontalOptions = LayoutOptions.Center,
               VerticalOptions = LayoutOptions.Center
           }, 0, 1, 1, 2); // These arguments indicate that that the child element goes in the column starting at 0 but ending before 1.
                           // They also indicate that the child element goes in the row starting at 1 but ending before 2.

           grid.Children.Add(new BoxView
           {
               Color = Color.Purple
           }, 1, 2, 1, 2);
           grid.Children.Add(new Label
           {
               Text = "Row1, Column 1",
               HorizontalOptions = LayoutOptions.Center,
               VerticalOptions = LayoutOptions.Center
           }, 1, 2, 1, 2);

           // Row 2
           // Alternatively, the BoxView and Label can be positioned in cells with the Grid.SetRow
           // and Grid.SetColumn methods.
           BoxView boxView = new BoxView { Color = Color.Red };
           Grid.SetRow(boxView, 2);
           Grid.SetColumnSpan(boxView, 2);
           Label label = new Label
           {
               Text = "Row 2, Column 0 and 1",
               HorizontalOptions = LayoutOptions.Center,
               VerticalOptions = LayoutOptions.Center
           };
           Grid.SetRow(label, 2);
           Grid.SetColumnSpan(label, 2);

           grid.Children.Add(boxView);
           grid.Children.Add(label);

           Title = "Basic Grid demo";
           Content = grid;

所以我想这个问题有几个问题，我怎样才能在网格视图上“缩小”以查看网格的其他单元格？此外，我什至以正确的方式处理这个问题吗？还是有比使用网格更好的方法？

Answer 1

您应该将内容变形为 ScrollView 并设置 Content = scrollView，然后您可以滚动查看所有元素：

    public MainPage()
    {
        InitializeComponent();


        StackLayout stackLayout = new StackLayout() { VerticalOptions = LayoutOptions.FillAndExpand };


        Grid grid = new Grid
        {
            VerticalOptions = LayoutOptions.FillAndExpand,
            HorizontalOptions = LayoutOptions.FillAndExpand,
        };
        stackLayout.Children.Add(grid);

        //......
        
        grid.Children.Add(boxView);
        grid.Children.Add(label);

        Title = "Basic Grid demo";

        //warp the content into a ScrollView 
        ScrollView scrollView = new ScrollView { Content = stackLayout };
        scrollView.Orientation = ScrollOrientation.Both;

        Content = scrollView;
    }

Xamarin 最大网格行/列定义

Xamarin maximum grid row/ column definitions

c#

xamarin

mobile

xamarin.forms

roguelike