Wie kann ich ein C # / Monogame-Ansichtsfenster in einem Fenster mit veränderbarer Größe mit einem Briefkasten versehen?

Ich mache ein 2D-Spiel mit xna / monogame. Ich möchte, dass im Hauptansichtsbereich immer 15 x 15 Kacheln oder 480 x 480 Pixel angezeigt werden.

Ich habe etwas, das funktioniert, wenn ich dieser Anleitung folge . Es erweitert den Ansichtsbereich, wenn Sie das Fenster verkleinern. Es funktioniert jedoch etwas richtig, wenn Sie es erweitern. Es funktioniert wie vorgesehen, wenn das Fenster maximiert ist.

Ich möchte, dass der Bereich des gerenderten Objekts unabhängig von der Fenstergröße nicht größer als 480 x 480 Pixel ist, aber ich möchte, dass die Sprites größer erscheinen, wenn die Fensterauflösung größer eingestellt wird (und umgekehrt).

Ich habe kürzlich so etwas in der MonoGame.Extended- Bibliothek implementiert . Das Erstellen eines Letterbox / Pillarbox-Ansichtsfensters in MonoGame ist eigentlich etwas schwierig. Ich werde mein Bestes geben, um hier eine gute Antwort zu geben.

Es gibt im Grunde 3 Teile. Die erste besteht darin, eine Skalierungsmatrix zu erstellen, die an den SpriteBatch.BeginAnruf weitergeleitet wird. Die Variablen repräsentieren Ihre tatsächliche Auflösung im Vergleich zur virtuellen Auflösung . Sie codieren das Spiel beispielsweise mit einer virtuellen Auflösung von 800 x 480, rendern es jedoch mit einer tatsächlichen Auflösung von 1024 x 768. Dieser Code streckt das Bild passend.

var scaleX = (float)ActualWidth / VirtualWidth;
var scaleY = (float)ActualHeight / VirtualHeight;
var scaleMatrix = Matrix.CreateScale(scaleX, scaleY, 1.0f);

_spriteBatch.Begin(transformMatrix: scaleMatrix);

Der zweite Teil ist, wie Sie den Briefkasten- / Säulenbox-Effekt erhalten. Es ändert die Größe des Ansichtsfensters auf GraphicsDeviceund zentriert das Bild. Dieser Code muss jedes Mal ausgeführt werden, wenn sich die Bildschirmgröße oder Fenstergröße des Geräts ändert. Zum Beispiel für den Window.ClientSizeChangedFall.

var viewport = GraphicsDevice.Viewport;
var aspectRatio = (float) VirtualWidth / VirtualHeight;
var width = viewport.Width;
var height = (int)(width / aspectRatio + 0.5f);

if (height > viewport.Height)
{
    height = viewport.Height;
    width = (int) (height * aspectRatio + 0.5f);
}

var x = (viewport.Width / 2) - (width / 2);
var y = (viewport.Height / 2) - (height / 2);

GraphicsDevice.Viewport = new Viewport(x, y, width, height);

Der letzte Teil befasst sich mit Eingabekoordinaten über die Maus oder den Touchscreen. Da Sie die Grafiken skaliert und verschoben haben, müssen Sie für die Eingabekoordinaten das Gegenteil tun. In diesem Fall so etwas

var viewport = GraphicsDevice.Viewport;
var matrix = Matrix.Invert(scaleMatrix);
var oldPosition = new Vector2(mousePoint.X - viewport.X, mousePoint.Y - viewport.Y);
var newPosition = Vector2.Transform(oldPosition, scaleMatrix).ToPoint();

Ich habe ein vollständiges Tutorial mit all diesen Dingen in Klassen auf meinem Blog .

Artikel werden im Stack-Austausch im Allgemeinen nicht gemocht, aber dies ist mein Blog-Beitrag, wenn ich versuche, mich daran zu erinnern

http://www.david-amador.com/2010/03/xna-2d-independent-resolution-rendering/