Quick Start Tutorial

Roman Shapiro edited this page Jan 23, 2019 · 16 revisions
  1. Create MonoGame/FNA/Xenko project.
  2. Reference Myra.
  3. Add following field in the Game class:
private Desktop _host;
  1. Add following code to the constructor to make the mouse cursor visible:
IsMouseVisible = true;
  1. Add following code in the LoadContent method, which will create 2x2 grid and populate it with some widgets:
MyraEnvironment.Game = this;

var grid = new Grid
{
  RowSpacing = 8,
  ColumnSpacing = 8
};

grid.ColumnsProportions.Add(new Grid.Proportion(Grid.ProportionType.Auto));
grid.ColumnsProportions.Add(new Grid.Proportion(Grid.ProportionType.Auto));
grid.RowsProportions.Add(new Grid.Proportion(Grid.ProportionType.Auto));
grid.RowsProportions.Add(new Grid.Proportion(Grid.ProportionType.Auto));

// TextBlock
var helloWorld = new TextBlock
{
  Text = "Hello, World!"
};
grid.Widgets.Add(helloWorld);

// ComboBox
var combo = new ComboBox
{
  GridPositionX = 1,
  GridPositionY = 0
};

combo.Items.Add(new ListItem("Red", Color.Red));
combo.Items.Add(new ListItem("Green", Color.Green));
combo.Items.Add(new ListItem("Blue", Color.Blue));
grid.Widgets.Add(combo);

// Button
var button = new Button
{
  GridPositionX = 0,
  GridPositionY = 1,
  Text = "Show"
};

button.Down += (s, a) =>
{
  var messageBox = Dialog.CreateMessageBox("Message", "Some message!");
  messageBox.ShowModal(_host);
};

grid.Widgets.Add(button);

// Spin button
var spinButton = new SpinButton
{
  GridPositionX = 1,
  GridPositionY = 1,
  WidthHint = 100,
  Nullable = true
};
grid.Widgets.Add(spinButton);

// Add it to the desktop
_host = new Desktop();
_host.Widgets.Add(grid);
  1. Add following code to the Draw method for MonoGame/FNA project:
GraphicsDevice.Clear(Color.Black);

_host.Bounds = new Rectangle(0, 0, GraphicsDevice.PresentationParameters.BackBufferWidth, 
  GraphicsDevice.PresentationParameters.BackBufferHeight);
_host.Render();

Or following code for Xenko:

// Clear screen
GraphicsContext.CommandList.Clear(GraphicsDevice.Presenter.BackBuffer, Color.Black);
GraphicsContext.CommandList.Clear(GraphicsDevice.Presenter.DepthStencilBuffer, 
  DepthStencilClearOptions.DepthBuffer | DepthStencilClearOptions.Stencil);

// Set render target
GraphicsContext.CommandList.SetRenderTargetAndViewport(
  GraphicsDevice.Presenter.DepthStencilBuffer, 
  GraphicsDevice.Presenter.BackBuffer);

_host.Bounds = new Rectangle(0, 0, GraphicsDevice.Presenter.BackBuffer.ViewWidth, 
  GraphicsDevice.Presenter.BackBuffer.ViewHeight);
_host.Render();

It would result in following:

You can’t perform that action at this time.
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session.
Press h to open a hovercard with more details.