2Dゲームの解像度を独立させるにはどうすればよいですか？

私は単純な2Dゲームに取り組んでいます。携帯版を完成させました。

ただし、上司は自分のRTでゲームを動作させたいと考えています。「変換」を実行していますが、次のように画面サイズをハードコード化しているため、ボタンが間違った場所にあります。

 texture = game.Content.Load<Texture2D>("StartScreen");
 mainFrame = new Rectangle(0, 0, game.GraphicsDevice.Viewport.Width, game.GraphicsDevice.Viewport.Height);

 // button definitions
 startbrect = new Rectangle(300, 258, 88, 88);
 startbtext = game.Content.Load<Texture2D>("bplay");

この例でmainframeは問題startbrectありませんが、Windows Phoneの画面に合わせてサイズを定義したので問題ありません。すべてのWindows 8電話の画面が異なる場合、レスポンシブデザインをどのように処理できますか？適切なサイズになるたびに計算する数式またはマクロはありますか？

基準画面サイズを使用し、すべての比率を同じに保ちながら、それに応じてすべてをスケーリングします。

private static float CalcRatio(Vector2 Sizes)
{
    return Sizes.y/Sizes.x;
}

public static Vector2 CalculateNewPos(Vector2 RefPos, Vector2 RefScreenSize, 
                                      Vector2 CurrentScreenSize)
{       
    return new Vector2((RefPos.x/RefScreenSize.x) * CurrentScreenSize.x, 
                       (RefPos.y/RefScreenSize.y) * CurrentScreenSize.y);
}

public static Vector2 CalculateNewSize(Vector2 RefSize, Vector2 RefScreenSize,
                                       Vector2 CurrentScreenSize)
{       
    float origRatio = CalcRatio(RefSize);
    float perW = RefSize.x * 100f / RefScreenSize.x;    
    float newW = perW / 100f * CurrentScreenSize.x;
    float newH = newW * origRatio;
    return new Vector2(newW, newH);
}

参照解像度とは大幅に異なる比率の解像度でゲームを美しく見せるために、あらゆる種類の画面に適合する「再生可能領域」を定義し、すべてのゲームプレイの重要なビジュアルをそこに配置します。それ以外のすべてを背景で埋めます。通常、私の参照再生可能領域は、参照画面サイズ自体と同じ大きさです。

縦向きでは、画面が垂直方向に埋められるように（新しい）再生可能領域を計算し、水平方向に占めるスペースは、比率を維持するために必要なだけの大きさです。横向きでは、画面を水平方向に塗りつぶし、垂直方向のサイズを設定するときに比率を維持します。

詳細は、http：//en.wikipedia.org/wiki/Safe_area_（television）を参照してください。これは、同一ではないにしても、類似した概念です。

解像度に依存しないレイアウトへの最も簡単で自然なアプローチは、相対的な（パーセント）スキームだと思います。したがって、最初から実際の解像度では機能せず、可能な限り均一な[0,1] x [0,1]正方形でのみ機能します。

つまり、特定のscreen_size、特定のobject_size、および特定の相対位置(px, py)（たとえば、画面の中心の（0.5、0.5））では、オブジェクトの左上隅が次のように計算されます。

x = px * screen_size.width - 0.5 * object_size.width
y = py * screen_size.height - 0.5 * object_size.height

アイデアは明確でなければなりません。準備ができている抽象化は

x = cx1 * screen_size.width + cx2 * object_size.width + cx3
y = cy1 * screen_size.height + cy2 * object_size.height + cy3

そして、すべての位置はによって定義され(cxi, cyi)ます。これにより、縁のあるなしにかかわらず、コーナーにオブジェクトを配置できます。

単一の要素のサイズ（ボタン、ラベルなど）もスケーリングされていることを確認してください。

Special for MonoGame iには、IRR（Independent Resolution Renderer）と呼ばれるこの問題に対するプラットフォームに依存しないソリューションがあります。使い方は非常に簡単です。

1. Initialize（）メソッドでIRRを作成する

   _irr = new ResolutionRenderer（this、VirtualResolutionWidth、VirtualResolutionHeight、_gfx.PreferredBackBufferWidth、_gfx.PreferredBackBufferHeight）;

2. コール_irr.Draw（）内の各サイクルドロー（）の呼び出し
3. サプライ_irr.GetTransformationMatrix（）いずれかにSpriteBatch.Begin（）あなたはIRRを使用したいと呼びます。

説明はこちら：http : //panthernet.ru/forum/index.php? / topic /17- monogamexna-examples-v14 /? p=44

コードはこちら：https : //github.com/panthernet/Monogame-Examples