2019-08-07 22:25:33 +02:00
using System ;
2019-08-11 18:02:21 +02:00
using System.Collections.Generic ;
using Coroutine ;
2019-08-07 22:25:33 +02:00
using Microsoft.Xna.Framework ;
2019-08-09 15:15:22 +02:00
using Microsoft.Xna.Framework.Graphics ;
2019-08-09 19:28:48 +02:00
using MLEM.Font ;
2019-08-07 22:25:33 +02:00
using MLEM.Input ;
2019-08-07 21:26:16 +02:00
using MLEM.Startup ;
2019-08-09 15:15:22 +02:00
using MLEM.Textures ;
2019-08-09 18:26:28 +02:00
using MLEM.Ui ;
using MLEM.Ui.Elements ;
2019-08-10 21:37:10 +02:00
using MLEM.Ui.Style ;
2019-08-07 21:26:16 +02:00
2019-08-14 14:15:07 +02:00
namespace Demos {
/// <remarks>
/// NOTE: This ui demo derives from <see cref="MlemGame"/>. To use MLEM.Ui, it's not required to use MLEM.Startup (which MlemGame is a part of).
/// If using your own game class that derives from <see cref="Game"/>, however, you will have to do a few additional things to get MLEM.Ui up and running:
/// - Create an instance of <see cref="UiSystem"/>
/// - Call the instance's Update method in your game's Update method
/// - Call the instance's Draw method in your game's Draw method
/// </remarks>
public class UiDemo : MlemGame {
2019-08-07 21:26:16 +02:00
2019-08-09 15:15:22 +02:00
private Texture2D testTexture ;
private NinePatch testPatch ;
2019-08-09 18:26:28 +02:00
2019-08-14 14:15:07 +02:00
public UiDemo ( ) {
2019-08-09 22:04:26 +02:00
this . IsMouseVisible = true ;
}
2019-08-09 15:15:22 +02:00
protected override void LoadContent ( ) {
this . testTexture = LoadContent < Texture2D > ( "Textures/Test" ) ;
this . testPatch = new NinePatch ( new TextureRegion ( this . testTexture , 0 , 8 , 24 , 24 ) , 8 ) ;
2019-08-10 21:37:10 +02:00
base . LoadContent ( ) ;
2019-08-09 18:26:28 +02:00
2019-08-14 14:15:07 +02:00
// create a new style
// this one derives form UntexturedStyle so that stuff like the hover colors don't have to be set again
2019-08-12 19:44:16 +02:00
var style = new UntexturedStyle ( this . SpriteBatch ) {
2019-08-14 14:15:07 +02:00
// when using a SpriteFont, use GenericSpriteFont. When using a MonoGame.Extended BitmapFont, use GenericBitmapFont.
// Wrapping fonts like this allows for both types to be usable within MLEM.Ui easily
2019-08-10 21:37:10 +02:00
Font = new GenericSpriteFont ( LoadContent < SpriteFont > ( "Fonts/TestFont" ) ) ,
2019-08-13 21:23:20 +02:00
TextScale = 0.1F ,
2019-08-10 21:37:10 +02:00
PanelTexture = this . testPatch ,
ButtonTexture = new NinePatch ( new TextureRegion ( this . testTexture , 24 , 8 , 16 , 16 ) , 4 ) ,
TextFieldTexture = new NinePatch ( new TextureRegion ( this . testTexture , 24 , 8 , 16 , 16 ) , 4 ) ,
2019-08-13 23:54:29 +02:00
ScrollBarBackground = new NinePatch ( new TextureRegion ( this . testTexture , 12 , 0 , 4 , 8 ) , 1 , 1 , 2 , 2 ) ,
ScrollBarScrollerTexture = new NinePatch ( new TextureRegion ( this . testTexture , 8 , 0 , 4 , 8 ) , 1 , 1 , 2 , 2 ) ,
2019-08-13 21:23:20 +02:00
CheckboxTexture = new NinePatch ( new TextureRegion ( this . testTexture , 24 , 8 , 16 , 16 ) , 4 ) ,
CheckboxCheckmark = new TextureRegion ( this . testTexture , 24 , 0 , 8 , 8 ) ,
RadioTexture = new NinePatch ( new TextureRegion ( this . testTexture , 16 , 0 , 8 , 8 ) , 3 ) ,
RadioCheckmark = new TextureRegion ( this . testTexture , 32 , 0 , 8 , 8 )
2019-08-10 21:37:10 +02:00
} ;
var untexturedStyle = this . UiSystem . Style ;
2019-08-14 14:15:07 +02:00
// set the defined style as the current one
2019-08-10 21:37:10 +02:00
this . UiSystem . Style = style ;
2019-08-14 14:15:07 +02:00
// scale every ui up by 5
2019-08-11 21:24:09 +02:00
this . UiSystem . GlobalScale = 5 ;
2019-08-09 18:26:28 +02:00
2019-08-14 14:15:07 +02:00
// create the root panel that all the other components sit on and add it to the ui system
2019-08-13 23:54:29 +02:00
var root = new Panel ( Anchor . Center , new Vector2 ( 80 , 100 ) , Vector2 . Zero , false , true , new Point ( 5 , 10 ) ) ;
2019-08-10 21:37:10 +02:00
this . UiSystem . Add ( "Test" , root ) ;
2019-08-13 21:23:20 +02:00
root . AddChild ( new Paragraph ( Anchor . AutoLeft , 1 , "This is a small demo for MLEM.Ui, a user interface library that is part of (M)LEM (L)ibrary by (E)llpeck for (M)onoGame." ) ) ;
2019-08-13 21:27:27 +02:00
var image = root . AddChild ( new Image ( Anchor . AutoCenter , new Vector2 ( 50 , 50 ) , new TextureRegion ( this . testTexture , 0 , 0 , 8 , 8 ) ) { IsHidden = true , Padding = new Point ( 3 ) } ) ;
2019-08-13 23:54:29 +02:00
root . AddChild ( new Button ( Anchor . AutoCenter , new Vector2 ( 1 , 10 ) , "Toggle Test Image" , "This button shows a grass tile as a test image to show the automatic anchoring of objects." ) {
2019-08-11 18:02:21 +02:00
OnClicked = ( element , button ) = > {
2019-08-09 22:04:26 +02:00
if ( button = = MouseButton . Left )
2019-08-09 22:23:16 +02:00
image . IsHidden = ! image . IsHidden ;
2019-08-09 22:04:26 +02:00
}
} ) ;
2019-08-13 21:27:27 +02:00
root . AddChild ( new VerticalSpace ( 3 ) ) ;
root . AddChild ( new Paragraph ( Anchor . AutoLeft , 1 , "Note that the default style does not contain any textures or font files and, as such, is quite bland. However, the default style is quite easy to override." ) ) ;
2019-08-13 21:23:20 +02:00
root . AddChild ( new Button ( Anchor . AutoCenter , new Vector2 ( 1 , 10 ) , "Change Style" ) {
2019-08-11 18:02:21 +02:00
OnClicked = ( element , button ) = > {
2019-08-10 21:37:10 +02:00
if ( button = = MouseButton . Left )
2019-08-12 19:44:16 +02:00
this . UiSystem . Style = this . UiSystem . Style = = untexturedStyle ? style : untexturedStyle ;
2019-08-10 21:37:10 +02:00
} ,
2019-08-13 23:54:29 +02:00
PositionOffset = new Vector2 ( 0 , 1 ) ,
2019-08-14 14:15:07 +02:00
// set HasCustomStyle to true before changing style information so that, when changing the style globally
// (like above), these custom values don't get undone
2019-08-10 21:37:10 +02:00
HasCustomStyle = true ,
Texture = this . testPatch ,
HoveredColor = Color . LightGray
} ) ;
2019-08-11 18:02:21 +02:00
root . AddChild ( new VerticalSpace ( 3 ) ) ;
2019-08-13 21:23:20 +02:00
root . AddChild ( new Paragraph ( Anchor . AutoCenter , 1 , "Text input:" , true ) ) ;
2019-08-13 23:54:29 +02:00
root . AddChild ( new TextField ( Anchor . AutoLeft , new Vector2 ( 1 , 10 ) ) { PositionOffset = new Vector2 ( 0 , 1 ) } ) ;
2019-08-13 21:23:20 +02:00
root . AddChild ( new VerticalSpace ( 3 ) ) ;
root . AddChild ( new Paragraph ( Anchor . AutoLeft , 1 , "Zoom in or out:" ) ) ;
root . AddChild ( new Button ( Anchor . AutoLeft , new Vector2 ( 10 ) , "+" ) {
2019-08-11 18:02:21 +02:00
OnClicked = ( element , button ) = > {
if ( element . Root . Scale < 2 )
element . Root . Scale + = 0.1F ;
}
} ) ;
2019-08-13 21:23:20 +02:00
root . AddChild ( new Button ( Anchor . AutoInline , new Vector2 ( 10 ) , "-" ) {
2019-08-11 18:02:21 +02:00
OnClicked = ( element , button ) = > {
if ( element . Root . Scale > 0.5F )
element . Root . Scale - = 0.1F ;
2019-08-13 21:23:20 +02:00
} ,
2019-08-13 23:54:29 +02:00
PositionOffset = new Vector2 ( 1 , 0 )
2019-08-11 21:24:09 +02:00
} ) ;
2019-08-13 21:23:20 +02:00
root . AddChild ( new VerticalSpace ( 3 ) ) ;
root . AddChild ( new Checkbox ( Anchor . AutoLeft , new Vector2 ( 1 , 10 ) , "Checkbox 1!" ) ) ;
2019-08-13 23:54:29 +02:00
root . AddChild ( new Checkbox ( Anchor . AutoLeft , new Vector2 ( 1 , 10 ) , "Checkbox 2!" ) { PositionOffset = new Vector2 ( 0 , 1 ) } ) ;
2019-08-13 21:23:20 +02:00
root . AddChild ( new VerticalSpace ( 3 ) ) ;
root . AddChild ( new RadioButton ( Anchor . AutoLeft , new Vector2 ( 1 , 10 ) , "Radio button 1!" ) ) ;
2019-08-13 23:54:29 +02:00
root . AddChild ( new RadioButton ( Anchor . AutoLeft , new Vector2 ( 1 , 10 ) , "Radio button 2!" ) { PositionOffset = new Vector2 ( 0 , 1 ) } ) ;
2019-08-07 22:25:33 +02:00
}
2019-08-07 21:26:16 +02:00
2019-08-09 15:15:22 +02:00
protected override void Draw ( GameTime gameTime ) {
this . GraphicsDevice . Clear ( Color . Black ) ;
2019-08-09 23:43:50 +02:00
base . Draw ( gameTime ) ;
2019-08-09 15:15:22 +02:00
}
2019-08-07 21:26:16 +02:00
}
}