mirror of
https://github.com/Ellpeck/MLEM.git
synced 2024-12-25 17:59:24 +01:00
improved text formatting demo
This commit is contained in:
parent
b69a2c4755
commit
d8314877c8
8 changed files with 216 additions and 10 deletions
|
@ -41,6 +41,27 @@
|
|||
/processorParam:TextureFormat=Compressed
|
||||
/build:Fonts/TestFontItalic.spritefont
|
||||
|
||||
#begin Fonts/Roboto.spritefont
|
||||
/importer:FontDescriptionImporter
|
||||
/processor:FontDescriptionProcessor
|
||||
/processorParam:PremultiplyAlpha=True
|
||||
/processorParam:TextureFormat=Compressed
|
||||
/build:Fonts/Roboto.spritefont
|
||||
|
||||
#begin Fonts/RobotoBold.spritefont
|
||||
/importer:FontDescriptionImporter
|
||||
/processor:FontDescriptionProcessor
|
||||
/processorParam:PremultiplyAlpha=True
|
||||
/processorParam:TextureFormat=Compressed
|
||||
/build:Fonts/RobotoBold.spritefont
|
||||
|
||||
#begin Fonts/RobotoItalic.spritefont
|
||||
/importer:FontDescriptionImporter
|
||||
/processor:FontDescriptionProcessor
|
||||
/processorParam:PremultiplyAlpha=True
|
||||
/processorParam:TextureFormat=Compressed
|
||||
/build:Fonts/RobotoItalic.spritefont
|
||||
|
||||
#begin Markdown.md
|
||||
/copy:Markdown.md
|
||||
|
||||
|
|
60
Demos/Content/Fonts/Roboto.spritefont
Normal file
60
Demos/Content/Fonts/Roboto.spritefont
Normal file
|
@ -0,0 +1,60 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!--
|
||||
This file contains an xml description of a font, and will be read by the XNA
|
||||
Framework Content Pipeline. Follow the comments to customize the appearance
|
||||
of the font in your game, and to change the characters which are available to draw
|
||||
with.
|
||||
-->
|
||||
<XnaContent xmlns:Graphics="Microsoft.Xna.Framework.Content.Pipeline.Graphics">
|
||||
<Asset Type="Graphics:FontDescription">
|
||||
|
||||
<!--
|
||||
Modify this string to change the font that will be imported.
|
||||
-->
|
||||
<FontName>RobotoRegular.ttf</FontName>
|
||||
|
||||
<!--
|
||||
Size is a float value, measured in points. Modify this value to change
|
||||
the size of the font.
|
||||
-->
|
||||
<Size>32</Size>
|
||||
|
||||
<!--
|
||||
Spacing is a float value, measured in pixels. Modify this value to change
|
||||
the amount of spacing in between characters.
|
||||
-->
|
||||
<Spacing>0</Spacing>
|
||||
|
||||
<!--
|
||||
UseKerning controls the layout of the font. If this value is true, kerning information
|
||||
will be used when placing characters.
|
||||
-->
|
||||
<UseKerning>true</UseKerning>
|
||||
|
||||
<!--
|
||||
Style controls the style of the font. Valid entries are "Regular", "Bold", "Italic",
|
||||
and "Bold, Italic", and are case sensitive.
|
||||
-->
|
||||
<Style>Regular</Style>
|
||||
|
||||
<!--
|
||||
If you uncomment this line, the default character will be substituted if you draw
|
||||
or measure text that contains characters which were not included in the font.
|
||||
-->
|
||||
<DefaultCharacter>*</DefaultCharacter>
|
||||
|
||||
<!--
|
||||
CharacterRegions control what letters are available in the font. Every
|
||||
character from Start to End will be built and made available for drawing. The
|
||||
default range is from 32, (ASCII space), to 126, ('~'), covering the basic Latin
|
||||
character set. The characters are ordered according to the Unicode standard.
|
||||
See the documentation for more information.
|
||||
-->
|
||||
<CharacterRegions>
|
||||
<CharacterRegion>
|
||||
<Start> </Start>
|
||||
<End>ɏ</End>
|
||||
</CharacterRegion>
|
||||
</CharacterRegions>
|
||||
</Asset>
|
||||
</XnaContent>
|
60
Demos/Content/Fonts/RobotoBold.spritefont
Normal file
60
Demos/Content/Fonts/RobotoBold.spritefont
Normal file
|
@ -0,0 +1,60 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!--
|
||||
This file contains an xml description of a font, and will be read by the XNA
|
||||
Framework Content Pipeline. Follow the comments to customize the appearance
|
||||
of the font in your game, and to change the characters which are available to draw
|
||||
with.
|
||||
-->
|
||||
<XnaContent xmlns:Graphics="Microsoft.Xna.Framework.Content.Pipeline.Graphics">
|
||||
<Asset Type="Graphics:FontDescription">
|
||||
|
||||
<!--
|
||||
Modify this string to change the font that will be imported.
|
||||
-->
|
||||
<FontName>RobotoBold.ttf</FontName>
|
||||
|
||||
<!--
|
||||
Size is a float value, measured in points. Modify this value to change
|
||||
the size of the font.
|
||||
-->
|
||||
<Size>32</Size>
|
||||
|
||||
<!--
|
||||
Spacing is a float value, measured in pixels. Modify this value to change
|
||||
the amount of spacing in between characters.
|
||||
-->
|
||||
<Spacing>0</Spacing>
|
||||
|
||||
<!--
|
||||
UseKerning controls the layout of the font. If this value is true, kerning information
|
||||
will be used when placing characters.
|
||||
-->
|
||||
<UseKerning>true</UseKerning>
|
||||
|
||||
<!--
|
||||
Style controls the style of the font. Valid entries are "Regular", "Bold", "Italic",
|
||||
and "Bold, Italic", and are case sensitive.
|
||||
-->
|
||||
<Style>Regular</Style>
|
||||
|
||||
<!--
|
||||
If you uncomment this line, the default character will be substituted if you draw
|
||||
or measure text that contains characters which were not included in the font.
|
||||
-->
|
||||
<DefaultCharacter>*</DefaultCharacter>
|
||||
|
||||
<!--
|
||||
CharacterRegions control what letters are available in the font. Every
|
||||
character from Start to End will be built and made available for drawing. The
|
||||
default range is from 32, (ASCII space), to 126, ('~'), covering the basic Latin
|
||||
character set. The characters are ordered according to the Unicode standard.
|
||||
See the documentation for more information.
|
||||
-->
|
||||
<CharacterRegions>
|
||||
<CharacterRegion>
|
||||
<Start> </Start>
|
||||
<End>ɏ</End>
|
||||
</CharacterRegion>
|
||||
</CharacterRegions>
|
||||
</Asset>
|
||||
</XnaContent>
|
BIN
Demos/Content/Fonts/RobotoBold.ttf
Normal file
BIN
Demos/Content/Fonts/RobotoBold.ttf
Normal file
Binary file not shown.
60
Demos/Content/Fonts/RobotoItalic.spritefont
Normal file
60
Demos/Content/Fonts/RobotoItalic.spritefont
Normal file
|
@ -0,0 +1,60 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!--
|
||||
This file contains an xml description of a font, and will be read by the XNA
|
||||
Framework Content Pipeline. Follow the comments to customize the appearance
|
||||
of the font in your game, and to change the characters which are available to draw
|
||||
with.
|
||||
-->
|
||||
<XnaContent xmlns:Graphics="Microsoft.Xna.Framework.Content.Pipeline.Graphics">
|
||||
<Asset Type="Graphics:FontDescription">
|
||||
|
||||
<!--
|
||||
Modify this string to change the font that will be imported.
|
||||
-->
|
||||
<FontName>RobotoItalic.ttf</FontName>
|
||||
|
||||
<!--
|
||||
Size is a float value, measured in points. Modify this value to change
|
||||
the size of the font.
|
||||
-->
|
||||
<Size>32</Size>
|
||||
|
||||
<!--
|
||||
Spacing is a float value, measured in pixels. Modify this value to change
|
||||
the amount of spacing in between characters.
|
||||
-->
|
||||
<Spacing>0</Spacing>
|
||||
|
||||
<!--
|
||||
UseKerning controls the layout of the font. If this value is true, kerning information
|
||||
will be used when placing characters.
|
||||
-->
|
||||
<UseKerning>true</UseKerning>
|
||||
|
||||
<!--
|
||||
Style controls the style of the font. Valid entries are "Regular", "Bold", "Italic",
|
||||
and "Bold, Italic", and are case sensitive.
|
||||
-->
|
||||
<Style>Regular</Style>
|
||||
|
||||
<!--
|
||||
If you uncomment this line, the default character will be substituted if you draw
|
||||
or measure text that contains characters which were not included in the font.
|
||||
-->
|
||||
<DefaultCharacter>*</DefaultCharacter>
|
||||
|
||||
<!--
|
||||
CharacterRegions control what letters are available in the font. Every
|
||||
character from Start to End will be built and made available for drawing. The
|
||||
default range is from 32, (ASCII space), to 126, ('~'), covering the basic Latin
|
||||
character set. The characters are ordered according to the Unicode standard.
|
||||
See the documentation for more information.
|
||||
-->
|
||||
<CharacterRegions>
|
||||
<CharacterRegion>
|
||||
<Start> </Start>
|
||||
<End>ɏ</End>
|
||||
</CharacterRegion>
|
||||
</CharacterRegions>
|
||||
</Asset>
|
||||
</XnaContent>
|
BIN
Demos/Content/Fonts/RobotoItalic.ttf
Normal file
BIN
Demos/Content/Fonts/RobotoItalic.ttf
Normal file
Binary file not shown.
BIN
Demos/Content/Fonts/RobotoRegular.ttf
Normal file
BIN
Demos/Content/Fonts/RobotoRegular.ttf
Normal file
Binary file not shown.
|
@ -20,13 +20,14 @@ namespace Demos {
|
|||
"You can also use animations like <a wobbly>a wobbly one</a>, as well as create custom ones using the <a wobbly>Code class</a>.\n\n" +
|
||||
"You can also display <i grass> icons in your text, and use super<sup>script</sup> or sub<sub>script</sub> formatting!\n\n" +
|
||||
"Additionally, the text formatter has various methods for interacting with the text, like custom behaviors when hovering over certain parts, and more.";
|
||||
private const float Scale = 0.5F;
|
||||
private const float Width = 0.9F;
|
||||
private const float DefaultScale = 0.5F;
|
||||
private const float WidthMultiplier = 0.9F;
|
||||
|
||||
private TextFormatter formatter;
|
||||
private TokenizedString tokenizedText;
|
||||
private GenericFont font;
|
||||
private bool drawBounds;
|
||||
private float scale = TextFormattingDemo.DefaultScale;
|
||||
|
||||
public TextFormattingDemo(MlemGame game) : base(game) {}
|
||||
|
||||
|
@ -38,9 +39,9 @@ namespace Demos {
|
|||
// GenericFont and its subtypes are wrappers around various font classes, including SpriteFont, MonoGame.Extended's BitmapFont and FontStashSharp
|
||||
// supplying a bold and italic version of the font here allows for the bold and italic formatting codes to be used
|
||||
this.font = new GenericSpriteFont(
|
||||
Demo.LoadContent<SpriteFont>("Fonts/TestFont"),
|
||||
Demo.LoadContent<SpriteFont>("Fonts/TestFontBold"),
|
||||
Demo.LoadContent<SpriteFont>("Fonts/TestFontItalic"));
|
||||
Demo.LoadContent<SpriteFont>("Fonts/Roboto"),
|
||||
Demo.LoadContent<SpriteFont>("Fonts/RobotoBold"),
|
||||
Demo.LoadContent<SpriteFont>("Fonts/RobotoItalic"));
|
||||
|
||||
// adding the image code used in the example to it
|
||||
var testTexture = Demo.LoadContent<Texture2D>("Textures/Test");
|
||||
|
@ -49,7 +50,7 @@ namespace Demos {
|
|||
// tokenizing our text and splitting it to fit the screen
|
||||
// we specify our text alignment here too, so that all data is cached correctly for display
|
||||
this.tokenizedText = this.formatter.Tokenize(this.font, TextFormattingDemo.Text, TextAlignment.Center);
|
||||
this.tokenizedText.Split(this.font, this.GraphicsDevice.Viewport.Width * TextFormattingDemo.Width, TextFormattingDemo.Scale, TextAlignment.Center);
|
||||
this.tokenizedText.Split(this.font, this.GraphicsDevice.Viewport.Width * TextFormattingDemo.WidthMultiplier, this.scale, TextAlignment.Center);
|
||||
}
|
||||
|
||||
public override void DoDraw(GameTime time) {
|
||||
|
@ -58,7 +59,7 @@ namespace Demos {
|
|||
|
||||
// we draw the tokenized text in the center of the screen
|
||||
// since the text is already center-aligned, we only need to align it on the y axis here
|
||||
var size = this.tokenizedText.GetArea(Vector2.Zero, TextFormattingDemo.Scale).Size;
|
||||
var size = this.tokenizedText.GetArea(Vector2.Zero, this.scale).Size;
|
||||
var pos = new Vector2(this.GraphicsDevice.Viewport.Width / 2, (this.GraphicsDevice.Viewport.Height - size.Y) / 2);
|
||||
|
||||
// draw bounds, which can be toggled with B in this demo
|
||||
|
@ -66,13 +67,13 @@ namespace Demos {
|
|||
var blank = this.SpriteBatch.GetBlankTexture();
|
||||
this.SpriteBatch.Draw(blank, new RectangleF(pos - new Vector2(size.X / 2, 0), size), Color.Red * 0.25F);
|
||||
foreach (var token in this.tokenizedText.Tokens) {
|
||||
foreach (var area in token.GetArea(pos, TextFormattingDemo.Scale))
|
||||
foreach (var area in token.GetArea(pos, this.scale))
|
||||
this.SpriteBatch.Draw(blank, area, Color.Black * 0.25F);
|
||||
}
|
||||
}
|
||||
|
||||
// draw the text itself
|
||||
this.tokenizedText.Draw(time, this.SpriteBatch, pos, this.font, Color.White, TextFormattingDemo.Scale, 0);
|
||||
this.tokenizedText.Draw(time, this.SpriteBatch, pos, this.font, Color.White, this.scale, 0);
|
||||
|
||||
this.SpriteBatch.End();
|
||||
}
|
||||
|
@ -90,9 +91,13 @@ namespace Demos {
|
|||
}
|
||||
|
||||
private void OnResize(object sender, EventArgs e) {
|
||||
// scale our text based on window size
|
||||
var viewport = new Rectangle(0, 0, this.Game.Window.ClientBounds.Width, this.Game.Window.ClientBounds.Height);
|
||||
this.scale = TextFormattingDemo.DefaultScale * Math.Min(viewport.Width / 1280F, viewport.Height / 720F);
|
||||
|
||||
// re-split our text if the window resizes, since it depends on the window size
|
||||
// this doesn't require re-tokenization of the text, since TokenizedString also stores the un-split version
|
||||
this.tokenizedText.Split(this.font, this.GraphicsDevice.Viewport.Width * TextFormattingDemo.Width, TextFormattingDemo.Scale, TextAlignment.Center);
|
||||
this.tokenizedText.Split(this.font, this.GraphicsDevice.Viewport.Width * TextFormattingDemo.WidthMultiplier, this.scale, TextAlignment.Center);
|
||||
}
|
||||
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue