将矩形适合另一个矩形

Question

我经常将一个矩形装入另一个矩形，以便它很好地适应并居中。 我会在白板上画一些东西，然后拍摄一下逻辑是什么，但它变得越来越暗，烛光使得它不那么有趣。

无论如何，它非常简单易懂。这是我刚刚从头开始写的函数（这次是在PHP中）：

// Fit rectangle 2 into rectangle 1 to get rectangle 3
// Rectangle 3 must be centered
// Return dimensions of rectangle and position relative to rectangle 1

function fitrect($w1,$h1,$w2,$h2){

    // Let's take a chance with rectangle 3 width being equal to rectangle 1 width
    $w3=$w1;
    $h3=$w3*($h2/$w2);

    // Check if height breaks rectangle 1 height
    if($h3>$h1){
        // Recalculate dimensions and then position
        $h3=$h1;
        $w3=$h3*($w2/$h2);
        $x3=($w1-$w3)/2;
        $y3=0;
    }else{
        // Just calculate position
        $y3=($h1-$h3)/2;
        $x3=0;
    }

    // Tidy up
    $x3=round($x3);
    $y3=round($y3);
    $w3=round($w3);
    $h3=round($h3);

    // Result array
    $res=array($x3,$y3,$w3,$h3);

    return($res);

}

我想了解这个算法及其他版本的算法，这样我的大脑就可以找到基础，这样我就不必再依赖笔和纸（或白板）了。

那么，你会怎么做？什么绒毛可以去除？

编辑：举个例子 - 假设我们有矩形1，尺寸为256x256，矩形2为44x167。然后我们需要将矩形2缩放到67x256并将其相对于矩形1定位在94,0，以使其最大化并集中在矩形1中。<​​/ p>

Answer 1

我将如何做到这一点。

让我们定义一个术语，肥胖，等于矩形宽度与高度的比值。高度为1且宽度为10的矩形具有粗细度10.高度为20且宽度为10的矩形的粗细度为0.5。调整矩形大小时，其粗细度不会改变。

当您将矩形2向上或向下缩放以使其宽度等于矩形1时，只要矩形2比矩形1更胖，它将不溢出顶部或底部。如果1比2大，将溢出。现在您提前知道是否要调整宽度或舒适高度。此外，两种情况下的转换逻辑都是相同的，因此可以超出if / else块。

伪代码中的

:(抱歉，我不知道PHP）

fatness1 = w1 / h1
fatness2 = w2 / h2

#adjust scaling
if fatness2 >= fatness1:
    #scale for a snug width
    scaleRatio = w1 / w2
else:
    #scale for a snug height
    scaleRatio = h1 / h2
w3 = w2 * scaleRatio
h3 = h2 * scaleRatio


#adjust rectangle 3's center so it is the same as 1's center
xCenterOf1 = x1 + (w1 / 2)
yCenterOf1 = y1 + (h1 / 2)

x3 = xCenterOf1 - (w3 / 2)
y3 = yCenterOf1 - (h3 / 2)

return (x3, y3, w3, h3)

在python中测试，假设矩形1位于（0,0），scale(256,256, 44, 167)返回(0.0, 94.3, 256.0, 67.4)。

Answer 2

这是一个用Java编写的方便的函数。

public static RectF fitRectWithin(Rect inner, Rect outer) {
    float innerAspectRatio = inner.width() / (float) inner.height();
    float outerAspectRatio = outer.width() / (float) outer.height();

    float resizeFactor = (innerAspectRatio >= outerAspectRatio) ?
    (outer.width() / (float) inner.width()) :
    (outer.height() / (float) inner.height());

    float newWidth = inner.width() * resizeFactor;
    float newHeight = inner.height() * resizeFactor;
    float newLeft = outer.left + (outer.width() - newWidth) / 2f;
    float newTop = outer.top + (outer.height() - newHeight) / 2f;

    return new RectF(newLeft, newTop, newWidth + newLeft, newHeight + newTop);
}

Answer 3

我是这样做的。 （此算法适用于图像。） 假设你有一个矩形和一个容器（也是一个矩形）：

aspectRatio = screen.width / screen.height

if (rectangle.width >= rectangle.height)
{
   resizeFactor = container.width / rectangle.width
   rectangle.width = rectangle.width * resizeFactor
   rectangle.height = rectangle.height * resizeFactor * aspectRatio
}
else
{
   resizeFactor = container.height / rectangle.height
   rectangle.width = rectangle.width * resizeFactor / aspectRatio
   rectangle.height = rectangle.height * resizeFactor
}

您可以通过将第6行更改为：

来优化此算法

rectangle.width = container.width

如果你愿意，也可以在第13行。

Answer 4

我只需要处理类似的问题：让我们将矩形2称为image，将矩形1称为window。因此，我们的任务是将图像放入窗口中。

在我的场景中，image和window都具有[-1,1]X[-1,1]的“内部”坐标系。实际上，在窗口内，有一个viewport投射在其中的image（问题中的矩形3），因此我们的任务是找到最大的viewport（内部的矩形window）的长宽比（宽度/高度）与image相同。

viewport由image的宽度/高度的一部分确定：

viewport_width = scale_w * window_w
viewport_height = scale_h * window_h

因此，我们的目标是找到window的宽度和高度的正确比例，以使viewport的纵横比（宽度/高度）与image相同：

# goal: 
scale_w * window_w == image_w
scale_h * window_h == image_h

这意味着我们正在寻找满足的规模：

(scale_w / scale_h) == ((image_w / image_h) / (window_w / window_h))

暂时用s表示此等式的右侧。

由于我们正在寻找最大的viewport，因此，肯定会在scale_w和scale_h中至少有一个等于1。因此-如果s<1表示window比image宽，我们将得到scale_w=s, scale_h=1（这与上面的数字对应，带有scale_w=0.5）。并且如果s>1（意味着image比window宽，我们将得到scale_w=1, scale_h=1/s。

在python代码中，它看起来像这样：

def compute_viewport_scale(image_size, window_size):
    image_w, image_h = image_size
    window_w, window_h = window_size
    im_ratio, win_ratio = image_w / image_h, window_w / window_h

    scale = im_ratio / win_ratio
    if scale > 1:  # image is wider than screen
        scale_w = 1
        scale_h = 1 / scale
    else:  # window is wider then image
        scale_w = scale
        scale_h = 1

    viewport_w, viewport_h = window_w * scale_w, window_h * scale_h
    assert (round(viewport_w / viewport_h, 5) == round(image_w / image_h, 5))

    return scale_w, scale_h

由于我想绝对确定已涵盖所有案例，因此构建了尺寸示例示例列表，以确保此公式确实正确。实际上，如果您运行所有这些行，则不会出现断言错误：）

# aspect ratio = 1
compute_viewport_scale((100, 100), (100, 100))
compute_viewport_scale((100, 100), (200, 200))
compute_viewport_scale((200, 200), (100, 100))

# image is wider than screen: (im_w / im_h) > (win_w / win_h)  [ i.e. im_ratio > win_ratio ]
# (im_ratio < 1 and win_ratio > 1 cant happen)
# im_w > win_w and im_h > win_h
compute_viewport_scale((300, 200), (100, 90))  # im_ratio > 1 and win_ratio > 1
compute_viewport_scale((200, 300), (100, 200))  # im_ratio < 1 and win_ratio < 1
compute_viewport_scale((300, 200), (100, 150))  # im_ratio > 1 and win_ratio < 1
# im_w > win_w and im_h < win_h
compute_viewport_scale((150, 50), (110, 100))  # im_ratio > 1 and win_ratio > 1
compute_viewport_scale((200, 300), (100, 400))  # im_ratio < 1 and win_ratio < 1
compute_viewport_scale((300, 100), (100, 150))  # im_ratio > 1 and win_ratio < 1
# (im_w < win_w and im_h > win_h cant happen)
# im_w < win_w and im_h < win_h
compute_viewport_scale((150, 50), (200, 100))  # im_ratio > 1 and win_ratio > 1
compute_viewport_scale((90, 100), (100, 200))  # im_ratio < 1 and win_ratio < 1
compute_viewport_scale((110, 100), (100, 200))  # im_ratio > 1 and win_ratio < 1

# image is wider than screen: (im_w / im_h) < (win_w / win_h)  [ i.e. im_ratio < win_ratio ]
# (im_ratio > 1 and win_ratio < 1 cant happen)
# im_w > win_w and im_h > win_h
compute_viewport_scale((300, 200), (100, 50))  # im_ratio > 1 and win_ratio > 1
compute_viewport_scale((200, 400), (100, 150))  # im_ratio < 1 and win_ratio < 1
compute_viewport_scale((200, 400), (150, 100))  # im_ratio < 1 and win_ratio > 1
# (im_w > win_w and im_h < win_h cant happen)
# im_w < win_w and im_h > win_h
compute_viewport_scale((150, 100), (200, 50))  # im_ratio > 1 and win_ratio > 1
compute_viewport_scale((200, 400), (380, 390))  # im_ratio < 1 and win_ratio < 1
compute_viewport_scale((200, 400), (390, 380))  # im_ratio < 1 and win_ratio > 1
# im_w < win_w and im_h < win_h
compute_viewport_scale((300, 200), (600, 300))  # im_ratio > 1 and win_ratio > 1
compute_viewport_scale((200, 300), (500, 600))  # im_ratio < 1 and win_ratio < 1
compute_viewport_scale((50, 100), (300, 200))  # im_ratio < 1 and win_ratio > 1