gpt4 book ai didi

mobile - 如何创建带有正方形的响应式网格?

转载 作者:行者123 更新时间:2023-12-01 07:57:43 24 4
gpt4 key购买 nike

我目前正在创建一个充满按钮的网格。现在我希望这个网格能够响应并且按钮是方形的。我想要创建的东西看起来像 iOS 或 Android 主屏幕(只是按钮)。

Grid grid = new Grid
{

HorizontalOptions = LayoutOptions.StartAndExpand,
RowSpacing = 15,
ColumnSpacing = 15,
ColumnDefinitions =
{
new ColumnDefinition { Width = new GridLength(1, GridUnitType.Star) },
new ColumnDefinition { Width = new GridLength(1, GridUnitType.Star) },
new ColumnDefinition { Width = new GridLength(1, GridUnitType.Star) }
}
};

for (int i = 0; i < 12; i++)
{
MonitorButton button = new MonitorButton();
grid.Children.Add(button, i % 3, i / 3);
}

this.Content = new ScrollView
{
Padding = new Thickness(15),
Orientation = ScrollOrientation.Vertical,
Content = grid
};

所以我在这里创建了一个包含 3 列的网格,其中填充了 12 个 MonitorButton(背景上带有图像的按钮)。看起来不错.. 现在当我在横向模式下打开屏幕时,屏幕上充满了矩形,因为列数仍然相同......我该如何解决这个问题?我希望有某种动态的可能性(例如:itemscontrol @XAML)。

最佳答案

当您旋转屏幕时,当前页面会自行调整大小,因此它会调用页面中的 OnSizeRequest 方法。如果重写该方法,则可以同时检测大小和方向。

你的页面.cs || YourPage.xaml.cs

protected override SizeRequest OnSizeRequest(double widthConstraint, double heightConstraint)
{
if(widthConstraint>heightConstraint)
{
//landscape mode
//set your grid row & columndefinitions
}
else
{
//portait mode
//set your grid row & columndefinitions
}
return base.OnSizeRequest(widthConstraint, heightConstraint);
}

关于mobile - 如何创建带有正方形的响应式网格?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24431955/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com