web-dev-qa-db-ja.com

境界ボックスに収まるように画像のサイズを変更

簡単な問題ですが、どういうわけか、今日はこれを理解できません。

アスペクト比を維持しながら、境界ボックスに収まる最大サイズに画像のサイズを変更する必要があります。

基本的に私はこの関数を埋めるためのコードを探しています:

void CalcNewDimensions(ref int w, ref int h, int MaxWidth, int MaxHeight);

ここで、w&hは元の高さと幅(in)および新しい高さと幅(out)であり、MaxWidthとMaxHeightは画像が収まる境界ボックスを定義します。

39
Eric Petroelje

小さい方を見つけます:MaxWidth / wまたはMaxHeight / h次に、whにその数値を掛けます

説明:

画像をフィットさせるスケーリング係数を見つける必要があります。

幅のスケーリング係数sを見つけるには、ss * w = MaxWidthである必要があります。したがって、スケーリング係数はMaxWidth / wです。

高さについても同様です。

最もスケーリングが必要なもの(小さいs)は、イメージ全体をスケーリングする必要がある係数です。

86
Shawn J. Goff

エリックの提案に基づいて、私は次のようなことをします:

private static Size ExpandToBound(Size image, Size boundingBox)
{       
    double widthScale = 0, heightScale = 0;
    if (image.Width != 0)
        widthScale = (double)boundingBox.Width / (double)image.Width;
    if (image.Height != 0)
        heightScale = (double)boundingBox.Height / (double)image.Height;                

    double scale = Math.Min(widthScale, heightScale);

    Size result = new Size((int)(image.Width * scale), 
                        (int)(image.Height * scale));
    return result;
}

キャストを少しやり過ぎたかもしれませんが、計算の精度を維持するためだけにしようとしていました。

27
Matt Warren

ウォーレン氏のコードを試したが、信頼できる結果が得られなかった。

例えば、

ExpandToBound(new Size(640,480), new Size(66, 999)).Dump();
// {Width=66, Height=49}

ExpandToBound(new Size(640,480), new Size(999,50)).Dump();
// {Width=66, Height=50}

ご覧のとおり、高さ= 49、高さ= 50です。

ここに、矛盾とわずかなリファクタリングなしの私の(ウォーレン氏のコードのベースバージョン)があります。

// Passing null for either maxWidth or maxHeight maintains aspect ratio while
//        the other non-null parameter is guaranteed to be constrained to
//        its maximum value.
//
//  Example: maxHeight = 50, maxWidth = null
//    Constrain the height to a maximum value of 50, respecting the aspect
//    ratio, to any width.
//
//  Example: maxHeight = 100, maxWidth = 90
//    Constrain the height to a maximum of 100 and width to a maximum of 90
//    whichever comes first.
//
private static Size ScaleSize( Size from, int? maxWidth, int? maxHeight )
{
   if ( !maxWidth.HasValue && !maxHeight.HasValue ) throw new ArgumentException( "At least one scale factor (toWidth or toHeight) must not be null." );
   if ( from.Height == 0 || from.Width == 0 ) throw new ArgumentException( "Cannot scale size from zero." );

   double? widthScale = null;
   double? heightScale = null;

   if ( maxWidth.HasValue )
   {
       widthScale = maxWidth.Value / (double)from.Width;
   }
   if ( maxHeight.HasValue )
   {
       heightScale = maxHeight.Value / (double)from.Height;
   }

   double scale = Math.Min( (double)(widthScale ?? heightScale),
                            (double)(heightScale ?? widthScale) );

   return new Size( (int)Math.Floor( from.Width * scale ), (int)Math.Ceiling( from.Height * scale ) );
}
7
Brian Chavez

アスペクトフィットの代わりにアスペクトフィルを実行するには、代わりに大きい比率を使用します。つまり、MattのコードをMath.MinからMath.Maxに変更します。

(アスペクトフィルでは、境界ボックスが空のままになることはありませんが、一部の画像が境界の外側に配置される可能性があります。一方、アスペクトフィットでは、画像が境界外に残されず、一部の境界ボックスが空白のままになる場合があります。)

7
vocaro

次のコードは、より正確な結果を生成します。

    public static Size CalculateResizeToFit(Size imageSize, Size boxSize)
    {
        // TODO: Check for arguments (for null and <=0)
        var widthScale = boxSize.Width / (double)imageSize.Width;
        var heightScale = boxSize.Height / (double)imageSize.Height;
        var scale = Math.Min(widthScale, heightScale);
        return new Size(
            (int)Math.Round((imageSize.Width * scale)),
            (int)Math.Round((imageSize.Height * scale))
            );
    }
5
M. Mennan Kara

ユーバーシンプル。 :)問題は、幅と高さを乗算する必要がある要因を見つけることです。解決策は、一方を使用してみて、それが合わない場合は、もう一方を使用することです。そう...

private float ScaleFactor(Rectangle outer, Rectangle inner)
{
    float factor = (float)outer.Height / (float)inner.Height;
    if ((float)inner.Width * factor > outer.Width) // Switch!
        factor = (float)outer.Width / (float)inner.Width;
    return factor;
}

画像(pctRect)をウィンドウ(wndRect)に合わせるには、次のように呼び出します。

float factor=ScaleFactor(wndRect, pctRect); // Outer, inner
RectangleF resultRect=new RectangleF(0,0,pctRect.Width*factor,pctRect.Height*Factor)
3
Tomaž Štih

Pythonコードですが、多分それは正しい方向を示します:

def fit_within_box(box_width, box_height, width, height):
    """
    Returns a Tuple (new_width, new_height) which has the property
    that it fits within box_width and box_height and has (close to)
    the same aspect ratio as the original size
    """
    new_width, new_height = width, height
    aspect_ratio = float(width) / float(height)

    if new_width > box_width:
        new_width = box_width
        new_height = int(new_width / aspect_ratio)

    if new_height > box_height:
        new_height = box_height
        new_width = int(new_height * aspect_ratio)

    return (new_width, new_height)
2
Jason Creighton

以前の回答に基づいて、JavaScript関数は次のとおりです。

/**
* fitInBox
* Constrains a box (width x height) to fit in a containing box (maxWidth x maxHeight), preserving the aspect ratio
* @param width      width of the box to be resized
* @param height     height of the box to be resized
* @param maxWidth   width of the containing box
* @param maxHeight  height of the containing box
* @param expandable (Bool) if output size is bigger than input size, output is left unchanged (false) or expanded (true)
* @return           {width, height} of the resized box
*/
function fitInBox(width, height, maxWidth, maxHeight, expandable) {
    "use strict";

    var aspect = width / height,
        initWidth = width,
        initHeight = height;

    if (width > maxWidth || height < maxHeight) {
        width = maxWidth;
        height = Math.floor(width / aspect);
    }

    if (height > maxHeight || width < maxWidth) {
        height = maxHeight;
        width = Math.floor(height * aspect);
    }

    if (!!expandable === false && (width >= initWidth || height >= initHeight)) {
        width = initWidth;
        height = initHeight;
    }

    return {
        width: width,
        height: height
    };
}

私は同様の問題を考え、それが非常に役立つことがわかりました: article 。私が正しく理解したように、画像のサイズを変更する必要がありますか?

0
bezieur