From e68daeb479f5d29c47351010a1b13d59f904984c Mon Sep 17 00:00:00 2001 From: Ellpeck Date: Sun, 24 Nov 2024 14:49:45 +0100 Subject: [PATCH] Added the ability for Dropdown to display an arrow texture based on its open state --- CHANGELOG.md | 1 + Demos/Content/Textures/Test.png | Bin 896 -> 953 bytes Demos/UiDemo.cs | 5 ++- MLEM.Ui/Elements/Dropdown.cs | 58 ++++++++++++++++++++++++++++++++ MLEM.Ui/Style/UiStyle.cs | 16 +++++++++ 5 files changed, 79 insertions(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index e48fcbe..9a71dbb 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -35,6 +35,7 @@ Additions - Added Panel.IsVisible method to check if a child element is visible - Added TextField.OnEnterPressed event - Added Tooltip.IgnoreViewport and allow overriding the default viewport using Tooltip.Viewport +- Added the ability for Dropdown to display an arrow texture based on its open state Fixes - Fixed tooltips not being bounded correctly for viewports that don't start at the origin diff --git a/Demos/Content/Textures/Test.png b/Demos/Content/Textures/Test.png index 7d88c33500f8b645481467247adf547c8218eba0..1259537b75ed6bacc1176579438ad7066ac2b74e 100644 GIT binary patch delta 851 zcmV-Z1FZaj2e}83F@JMOL_t(|obB38Zres2hVges^haAr0JF#22RkCN90al>hJxB2Cl1BI|0KPN!}flhkg9@2{##U(1c&zndTR z0sTTke2H^zCs?TtwF$hht!bB}s;b(3B*|JUV=75f>iuT$ExLvl#MKS~zx;Hes;b&z zDA$#ot$)KzMz*s}lGbGh~@UGgKo7@j6^&eZ`rr>m=pUW|V} zy3@s9pCr|11)Me;j_px8we{H{W}g^FI}I$>o9Fx-cqTTysEeUF^$*cE;_AE`c&s6Y z6$~S3#_QNeD@Xr%u>RC9YR7hvlM5mnB&Fu)=YK44`UV>UB+dfopdA9Db~<2DA+Gii zjd=~gH1K@11rReVrh(_9y%`icEWe=gqTt5PiP~Eb5=&E1+|NI4gI%U``achYP6KiJ z2AKxpd<-%T4A%|fbS3^ezvaVc{qyhN^4AIWP3I0R7Hx(VehEB%Nl})Pq_X+(X1&>2 z*)MDVU+d?GEvd6G{565b7#VQ}ICaUF^=28b`^o z^x@l5-KQ*DDqqfKMv_iPqosB(rc)zH=jZ3^n!lH`v$L(P$A4zFt8$ngOOpPSH+6Y1 z(8=MU|NPa#fnEmX)6vMKhldJZVM3&7x{_pFb>s2ajmP7)35ocubQ|#Iy|})A15NNH zX&Ag-2T73Uxd{WFrm4&G+=T6ffhP$bkCp0x57T2G_@?JS#PE*K^E@|A58o90O?8OR zN_D`C>;DUU41crP>|S+<&#wXc4t|=ZZZese$z)>M^M96QCJgv&HdB^mW~C8Cx3UOq z)&Ze|!C;`;Ns`jwp20(OO)ZGaPXRBU9jK}*pA6-^ zlCyO%lY#B5lcafB$yzICt?&897?q3Vq`GUH*d^cMAH)45&bc~(>lAq?6(Ets9;E z_%5j)6@ReXYGPe002ovPDHLkV1gzQl~(`& diff --git a/Demos/UiDemo.cs b/Demos/UiDemo.cs index 7e6062a..8855fc1 100644 --- a/Demos/UiDemo.cs +++ b/Demos/UiDemo.cs @@ -50,7 +50,10 @@ namespace Demos { 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), - AdditionalFonts = {{"Monospaced", new GenericSpriteFont(Demo.LoadContent("Fonts/MonospacedFont"))}} + AdditionalFonts = {{"Monospaced", new GenericSpriteFont(Demo.LoadContent("Fonts/MonospacedFont"))}}, + DropdownClosedArrowTexture = new TextureRegion(this.testTexture, 40, 0, 8, 8), + DropdownOpenedArrowTexture = new TextureRegion(this.testTexture, 48, 0, 8, 8), + DropdownArrowPadding = new Padding(0, 4, 0, 0) }; var untexturedStyle = new UntexturedStyle(this.SpriteBatch) { TextScale = style.TextScale, diff --git a/MLEM.Ui/Elements/Dropdown.cs b/MLEM.Ui/Elements/Dropdown.cs index bf6f805..ab839c8 100644 --- a/MLEM.Ui/Elements/Dropdown.cs +++ b/MLEM.Ui/Elements/Dropdown.cs @@ -1,6 +1,8 @@ using System.Linq; using Microsoft.Xna.Framework; using MLEM.Maths; +using MLEM.Textures; +using MLEM.Ui.Style; namespace MLEM.Ui.Elements { /// @@ -14,12 +16,17 @@ namespace MLEM.Ui.Elements { /// public Panel Panel { get; private set; } /// + /// The that contains the currently active arrow texture for this dropdown, which is either or . + /// + public Image Arrow { get; private set; } + /// /// This property stores whether the dropdown is currently opened or not /// public bool IsOpen { get => !this.Panel.IsHidden; set { this.Panel.IsHidden = !value; + this.UpdateArrowStyle(); this.OnOpenedOrClosed?.Invoke(this); } } @@ -28,6 +35,41 @@ namespace MLEM.Ui.Elements { /// public GenericCallback OnOpenedOrClosed; + /// + /// A style property containing the that should be passed to the child element. + /// + public StyleProp ArrowPadding { + get => this.arrowPadding; + set { + this.arrowPadding = value; + this.UpdateArrowStyle(); + } + } + /// + /// A style property containing the that should be displayed on this dropdown's when the dropdown is closed ( is ). + /// + public StyleProp ClosedArrowTexture { + get => this.closedArrowTexture; + set { + this.closedArrowTexture = value; + this.UpdateArrowStyle(); + } + } + /// + /// A style property containing the that should be displayed on this dropdown's when the dropdown is open ( is ). + /// + public StyleProp OpenedArrowTexture { + get => this.openedArrowTexture; + set { + this.openedArrowTexture = value; + this.UpdateArrowStyle(); + } + } + + private StyleProp openedArrowTexture; + private StyleProp closedArrowTexture; + private StyleProp arrowPadding; + /// /// Creates a new dropdown with the given settings and no text or tooltip. /// @@ -125,6 +167,8 @@ namespace MLEM.Ui.Elements { this.Panel = this.AddChild(new Panel(Anchor.TopCenter, Vector2.Zero, panelHeight == 0, scrollPanel, autoHidePanelScrollbar) { IsHidden = true }); + this.Arrow = this.AddChild(new Image(Anchor.CenterRight, new Vector2(-1, 1), this.ClosedArrowTexture)); + this.UpdateArrowStyle(); this.OnAreaUpdated += e => { this.Panel.Size = new Vector2(e.Area.Width / e.Scale, panelHeight); this.Panel.PositionOffset = new Vector2(0, e.Area.Height / e.Scale); @@ -148,5 +192,19 @@ namespace MLEM.Ui.Elements { }; } + /// + protected override void InitStyle(UiStyle style) { + base.InitStyle(style); + this.ArrowPadding = this.ArrowPadding.OrStyle(style.DropdownArrowPadding); + this.ClosedArrowTexture = this.ClosedArrowTexture.OrStyle(style.DropdownClosedArrowTexture); + this.OpenedArrowTexture = this.OpenedArrowTexture.OrStyle(style.DropdownOpenedArrowTexture); + this.UpdateArrowStyle(); + } + + private void UpdateArrowStyle() { + this.Arrow.Padding = this.Arrow.Padding.OrStyle(this.ArrowPadding, 1); + this.Arrow.Texture = this.IsOpen ? this.OpenedArrowTexture : this.ClosedArrowTexture; + } + } } diff --git a/MLEM.Ui/Style/UiStyle.cs b/MLEM.Ui/Style/UiStyle.cs index 36b73ff..cb37e48 100644 --- a/MLEM.Ui/Style/UiStyle.cs +++ b/MLEM.Ui/Style/UiStyle.cs @@ -242,6 +242,22 @@ namespace MLEM.Ui.Style { /// This value is passed to . /// public Color? LinkColor = Color.CornflowerBlue; + /// + /// The default padding that a 's should have. + /// This value is passed to . + /// + public Padding DropdownArrowPadding; + /// + /// The texture that a 's should display when the dropdown is closed. + /// This value is passed to . + /// + public TextureRegion DropdownClosedArrowTexture; + /// + /// The texture that a 's should display when the dropdown is open. + /// This value is passed to . + /// + public TextureRegion DropdownOpenedArrowTexture; + /// /// A set of additional fonts that can be used for the <f FontName> formatting code ///