1
0
Fork 0
mirror of https://github.com/Ellpeck/MLEM.git synced 2024-11-25 22:18:34 +01:00

Allow for checkboxes and radio buttons to be disabled

This commit is contained in:
Ell 2021-12-24 12:10:04 +01:00
parent 5d9cccc9fd
commit 7e49eaef10
5 changed files with 49 additions and 9 deletions

View file

@ -16,6 +16,10 @@ Additions
Improvements Improvements
- Generify GenericFont's string drawing - Generify GenericFont's string drawing
### MLEM.Ui
Improvements
- Allow for checkboxes and radio buttons to be disabled
## 5.2.0 ## 5.2.0
### MLEM ### MLEM
Additions Additions

View file

@ -207,6 +207,7 @@ namespace Demos {
this.root.AddChild(new VerticalSpace(3)); this.root.AddChild(new VerticalSpace(3));
this.root.AddChild(new Button(Anchor.AutoLeft, new Vector2(1, 10), "Disabled button", "This button can't be clicked or moved to using automatic navigation") {IsDisabled = true}).PositionOffset = new Vector2(0, 1); this.root.AddChild(new Button(Anchor.AutoLeft, new Vector2(1, 10), "Disabled button", "This button can't be clicked or moved to using automatic navigation") {IsDisabled = true}).PositionOffset = new Vector2(0, 1);
this.root.AddChild(new Checkbox(Anchor.AutoLeft, new Vector2(1, 10), "Disabled checkbox") {IsDisabled = true}).PositionOffset = new Vector2(0, 1);
const string alignText = "Paragraphs can have <c CornflowerBlue><l Left>left</l></c> aligned text, <c CornflowerBlue><l Right>right</l></c> aligned text and <c CornflowerBlue><l Center>center</l></c> aligned text."; const string alignText = "Paragraphs can have <c CornflowerBlue><l Left>left</l></c> aligned text, <c CornflowerBlue><l Right>right</l></c> aligned text and <c CornflowerBlue><l Center>center</l></c> aligned text.";
this.root.AddChild(new VerticalSpace(3)); this.root.AddChild(new VerticalSpace(3));

View file

@ -13,7 +13,7 @@ namespace MLEM.Ui.Elements {
public class Checkbox : Element { public class Checkbox : Element {
/// <summary> /// <summary>
/// The texture that this checkbox uses for drawing /// The texture that this checkbox uses for drawing.
/// </summary> /// </summary>
public StyleProp<NinePatch> Texture; public StyleProp<NinePatch> Texture;
/// <summary> /// <summary>
@ -26,6 +26,15 @@ namespace MLEM.Ui.Elements {
/// </summary> /// </summary>
public StyleProp<Color> HoveredColor; public StyleProp<Color> HoveredColor;
/// <summary> /// <summary>
/// The texture that the checkbox uses when it <see cref="IsDisabled"/>.
/// If this is null, it uses its default <see cref="Texture"/>.
/// </summary>
public StyleProp<NinePatch> DisabledTexture;
/// <summary>
/// The color that the checkbox uses for drawing when it <see cref="IsDisabled"/>.
/// </summary>
public StyleProp<Color> DisabledColor;
/// <summary>
/// The texture that is rendered on top of this checkbox when it is <see cref="Checked"/>. /// The texture that is rendered on top of this checkbox when it is <see cref="Checked"/>.
/// </summary> /// </summary>
public StyleProp<TextureRegion> Checkmark; public StyleProp<TextureRegion> Checkmark;
@ -41,20 +50,33 @@ namespace MLEM.Ui.Elements {
/// Whether or not this checkbox is currently checked. /// Whether or not this checkbox is currently checked.
/// </summary> /// </summary>
public bool Checked { public bool Checked {
get => this.checced; get => this.isChecked;
set { set {
if (this.checced != value) { if (this.isChecked != value) {
this.checced = value; this.isChecked = value;
this.OnCheckStateChange?.Invoke(this, this.checced); this.OnCheckStateChange?.Invoke(this, this.isChecked);
} }
} }
} }
/// <summary> /// <summary>
/// Set this property to true to mark the checkbox as disabled.
/// A disabled checkbox cannot be moused over, selected or toggled.
/// </summary>
public bool IsDisabled {
get => this.isDisabled;
set {
this.isDisabled = value;
this.CanBePressed = !value;
this.CanBeSelected = !value;
}
}
/// <summary>
/// An event that is invoked when this checkbox's <see cref="Checked"/> property changes /// An event that is invoked when this checkbox's <see cref="Checked"/> property changes
/// </summary> /// </summary>
public CheckStateChange OnCheckStateChange; public CheckStateChange OnCheckStateChange;
private bool checced; private bool isChecked;
private bool isDisabled;
/// <summary> /// <summary>
/// Creates a new checkbox with the given settings /// Creates a new checkbox with the given settings
@ -64,7 +86,7 @@ namespace MLEM.Ui.Elements {
/// <param name="label">The checkbox's label text</param> /// <param name="label">The checkbox's label text</param>
/// <param name="defaultChecked">The default value of <see cref="Checked"/></param> /// <param name="defaultChecked">The default value of <see cref="Checked"/></param>
public Checkbox(Anchor anchor, Vector2 size, string label, bool defaultChecked = false) : base(anchor, size) { public Checkbox(Anchor anchor, Vector2 size, string label, bool defaultChecked = false) : base(anchor, size) {
this.checced = defaultChecked; this.isChecked = defaultChecked;
this.OnPressed += element => this.Checked = !this.Checked; this.OnPressed += element => this.Checked = !this.Checked;
if (label != null) { if (label != null) {
@ -87,7 +109,10 @@ namespace MLEM.Ui.Elements {
public override void Draw(GameTime time, SpriteBatch batch, float alpha, BlendState blendState, SamplerState samplerState, DepthStencilState depthStencilState, Effect effect, Matrix matrix) { public override void Draw(GameTime time, SpriteBatch batch, float alpha, BlendState blendState, SamplerState samplerState, DepthStencilState depthStencilState, Effect effect, Matrix matrix) {
var tex = this.Texture; var tex = this.Texture;
var color = Color.White * alpha; var color = Color.White * alpha;
if (this.IsMouseOver) { if (this.IsDisabled) {
tex = this.DisabledTexture.OrDefault(tex);
color = (Color) this.DisabledColor * alpha;
} else if (this.IsMouseOver) {
tex = this.HoveredTexture.OrDefault(tex); tex = this.HoveredTexture.OrDefault(tex);
color = (Color) this.HoveredColor * alpha; color = (Color) this.HoveredColor * alpha;
} }
@ -105,6 +130,8 @@ namespace MLEM.Ui.Elements {
this.Texture = this.Texture.OrStyle(style.CheckboxTexture); this.Texture = this.Texture.OrStyle(style.CheckboxTexture);
this.HoveredTexture = this.HoveredTexture.OrStyle(style.CheckboxHoveredTexture); this.HoveredTexture = this.HoveredTexture.OrStyle(style.CheckboxHoveredTexture);
this.HoveredColor = this.HoveredColor.OrStyle(style.CheckboxHoveredColor); this.HoveredColor = this.HoveredColor.OrStyle(style.CheckboxHoveredColor);
this.DisabledTexture = this.DisabledTexture.OrStyle(style.CheckboxDisabledTexture);
this.DisabledColor = this.DisabledColor.OrStyle(style.CheckboxDisabledColor);
this.Checkmark = this.Checkmark.OrStyle(style.CheckboxCheckmark); this.Checkmark = this.Checkmark.OrStyle(style.CheckboxCheckmark);
this.TextOffsetX = this.TextOffsetX.OrStyle(style.CheckboxTextOffsetX); this.TextOffsetX = this.TextOffsetX.OrStyle(style.CheckboxTextOffsetX);
} }

View file

@ -110,6 +110,14 @@ namespace MLEM.Ui.Style {
/// </summary> /// </summary>
public Color CheckboxHoveredColor = Color.LightGray; public Color CheckboxHoveredColor = Color.LightGray;
/// <summary> /// <summary>
/// The texture that the <see cref="Checkbox"/> element uses when it <see cref="Checkbox.IsDisabled"/>.
/// </summary>
public NinePatch CheckboxDisabledTexture;
/// <summary>
/// The color that the <see cref="Checkbox"/> element uses when it <see cref="Checkbox.IsDisabled"/>.
/// </summary>
public Color CheckboxDisabledColor = Color.Gray;
/// <summary>
/// The texture that the <see cref="Checkbox"/> element renders on top of its regular texture when it is <see cref="Checkbox.Checked"/> /// The texture that the <see cref="Checkbox"/> element renders on top of its regular texture when it is <see cref="Checkbox.Checked"/>
/// </summary> /// </summary>
public TextureRegion CheckboxCheckmark; public TextureRegion CheckboxCheckmark;

View file

@ -26,7 +26,7 @@ namespace MLEM.Font {
public const char Nbsp = '\u00A0'; public const char Nbsp = '\u00A0';
/// <summary> /// <summary>
/// This field holds the unicode representation of a zero-width space. /// This field holds the unicode representation of a zero-width space.
/// Whereas a regular <see cref="SpriteFont"/> would have to explicitly support this character for width calculations and string splitting, generic fonts implicitly support it in <see cref="MeasureString(string,bool)"/> and <see cref="SplitString"/>. /// Whereas a regular <see cref="SpriteFont"/> would have to explicitly support this character for width calculations and string splitting, generic fonts implicitly support it in <see cref="MeasureString(string,bool)"/> and <see cref="SplitString(string,float,float)"/>.
/// </summary> /// </summary>
public const char Zwsp = '\u200B'; public const char Zwsp = '\u200B';