【问题标题】:Create 2D Grid Based from Width, Height and Total Boxes根据宽度、高度和总框创建 2D 网格
【发布时间】:2017-06-25 16:34:38
【问题描述】:

我正在尝试在具有宽度和高度的屏幕上绘制 2048 个框。 (我用 Java 做这个)

我有以下变量:

  • 宽度 = 1024
  • 身高 = 768
  • 人口 = 2048

基于这些变量,我如何绘制具有 x 列数和 y 行数的网格,以使整个布局完美地适应所需的宽度和高度?

例如: 我的宽度和高度为 4 x 4,总人口为 4,因此我将有 2 列和 2 行。

示例 2:

我想在上面的屏幕截图中重现完全相同的内容,但我不知道需要循环多少行和多少列以及每个正方形的大小。

我只知道窗口的总宽度/高度,以及我要绘制的框的总数。

【问题讨论】:

  • 我不明白,你能举一个更复杂的例子吗?例如 7x10 尺寸?
  • 你的盒子应该是正方形,还是窗口纵横比的矩形,还是任意纵横比的矩形?
  • 想象一下,您想用随机数量的框(例如 55 个)填充整个计算机屏幕,并且您希望它们处于网格行布局中。我的问题是,如何确定网格的行数和列数是均匀分布的
  • @NabinBhandari 在我的脑海中,我认为矩形最好,但这并不重要
  • 人口与箱子的大小有什么关系?

标签: java math processing


【解决方案1】:

为自己回答此类问题,您能做的最好的事情就是拿出一张纸和一支铅笔,然后画出一堆例子。标记窗口的宽度和高度,以及每个单独框的位置和宽度和高度。继续绘制示例,直到你注意到一个模式。

Stack Overflow 并不是针对一般的“我该怎么做”类型的问题而设计的。这是针对特定的“我尝试了 X,预期 Y,但得到了 Z”类型的问题。您需要break your problem down into smaller pieces 并一次拿走这些碎片。话虽如此,我可以尝试在一般意义上提供帮助。

首先,您需要弄清楚您的网格应该有多少行和多少列。从总体到行数和列数的方法不止一种。事实上,这甚至是不可能的——你将如何分割 3 个人口?还有多种解决方案:如果您的人口数是 20,那么您可以有一个 1x20、2x10、4x5、5x4、10x2 或 20x1 的网格。我建议您将此视为一个单独的问题,然后发布一个单独的问题。

但是,一旦有了行数和列数,就可以使用一些基本的数学计算来计算每个框的位置和大小。同样,画出一些示例会有所帮助,但基本内容如下所示:

  float cellWidth = width/columns;
  float cellHeight = height/rows;

  for (int row = 0; row < rows; row++) {
    for (int column = 0; column < columns; column++) {

      float cellX = cellWidth*column;
      float cellY = cellHeight*row;

      rect(cellX, cellY, cellWidth, cellHeight);
    }
  }

请注意,我从this tutorial 获得了此代码,但如果您进行谷歌搜索,您会在整个互联网上找到示例。如果您仍然无法使其正常工作,请发布 MCVE 准确显示您尝试过的内容,我们将从那里开始。祝你好运。

【讨论】:

  • @Acidic 我已经编辑了我的答案以包含有关将人口转换为行数和列数的更多信息,但实际上主要答案保持不变。你真的在这里问了两个不同的问题。
【解决方案2】:

如果盒子需要是矩形的,有多种可能的解决方案。例如。对于区域 12,框可以是 12x1、1x12、4x3、3x4、6x2、2x6 等。更不用说浮动值了。

如果方框没问题:

area = available_width * available_height
area_per_box = area / no_of_boxes
length = sqrt(area_per_box)

用这个获得的长度填充网格作为小盒子的宽度和高度。

另一种方法是根据需要填充网格并将网格缩放到所需的尺寸。

【讨论】:

  • 答案没问题,但只适用于方盒子。
猜你喜欢
  • 2021-06-07
  • 2018-10-08
  • 1970-01-01
  • 2018-02-23
  • 1970-01-01
  • 1970-01-01
  • 2012-06-25
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多