diff --git a/resources/images/moon.png b/resources/images/moon.png new file mode 100644 index 0000000..9aebd53 Binary files /dev/null and b/resources/images/moon.png differ diff --git a/resources/images/sun.png b/resources/images/sun.png new file mode 100644 index 0000000..d1d27e4 Binary files /dev/null and b/resources/images/sun.png differ diff --git a/resources/images/sunAndMoon.fla b/resources/images/sunAndMoon.fla new file mode 100644 index 0000000..bd52e8f Binary files /dev/null and b/resources/images/sunAndMoon.fla differ diff --git a/src/br/com/davidbuzatto/jsge/examples/basic/IMGUIExample.java b/src/br/com/davidbuzatto/jsge/examples/basic/IMGUIExample.java index 257121b..a6baeb1 100644 --- a/src/br/com/davidbuzatto/jsge/examples/basic/IMGUIExample.java +++ b/src/br/com/davidbuzatto/jsge/examples/basic/IMGUIExample.java @@ -18,6 +18,7 @@ import br.com.davidbuzatto.jsge.collision.CollisionUtils; import br.com.davidbuzatto.jsge.core.engine.EngineFrame; +import br.com.davidbuzatto.jsge.image.Image; import br.com.davidbuzatto.jsge.imgui.GuiButton; import br.com.davidbuzatto.jsge.imgui.GuiButtonGroup; import br.com.davidbuzatto.jsge.imgui.GuiCheckBox; @@ -134,6 +135,9 @@ public class IMGUIExample extends EngineFrame { private GuiTheme currentTheme; private ChangeThemeButton changeThemeButton; + private Image sunIcon; + private Image moonIcon; + /** * Cria o exemplo. */ @@ -296,7 +300,12 @@ public void create() { checkVisible = new GuiCheckBox( x, y += vSpacing, 100, 20, "Visible" ); checkVisible.setSelected( true ); checkDrawBounds = new GuiCheckBox( x, y += vSpacing, 100, 20, "Draw bounds" ); - changeThemeButton = new ChangeThemeButton( getScreenWidth() - 60, getScreenHeight() - 60, 50, 50 ); + + changeThemeButton = new ChangeThemeButton( + getScreenWidth() - 60, getScreenHeight() - 60, 50, 50, + loadImage( "resources/images/sun.png" ), + loadImage( "resources/images/moon.png" ) + ); toolTipLabel1 = new GuiToolTip( label1, "Top and Left Label" ); toolTipLabel2 = new GuiToolTip( label2, "Middle and Center Label" ); @@ -316,7 +325,6 @@ public void create() { interactionComponents.add( checkDrawBounds ); interactionComponents.add( changeThemeButton ); - } @Override @@ -495,14 +503,13 @@ public void update( double delta ) { if ( changeThemeButton.isMousePressed() ) { changeThemeButton.darkThemeActive = !changeThemeButton.darkThemeActive; if ( changeThemeButton.darkThemeActive ) { - darkTheme.install( components ); - darkTheme.install( interactionComponents ); currentTheme = darkTheme; } else { - lightTheme.install( components ); - lightTheme.install( interactionComponents ); currentTheme = lightTheme; } + currentTheme.apply( components ); + currentTheme.apply( interactionComponents ); + currentTheme.install(); } if ( isMouseButtonPressed( MOUSE_BUTTON_RIGHT ) ) { @@ -657,17 +664,29 @@ private void drawColoredRectangle( double x, double y, Color color ) { private class ChangeThemeButton extends GuiComponent { private boolean darkThemeActive; + private Image sunIcon; + private Image moonIcon; - public ChangeThemeButton( double x, double y, double width, double height ) { + public ChangeThemeButton( double x, double y, double width, double height, Image sunIcon, Image moonIcon ) { super( x, y, width, height ); + this.sunIcon = sunIcon; + this.moonIcon = moonIcon; } - public ChangeThemeButton( double x, double y, double width, double height, EngineFrame engine ) { + public ChangeThemeButton( double x, double y, double width, double height, Image sunIcon, Image moonIcon, EngineFrame engine ) { super( x, y, width, height, engine ); + this.sunIcon = sunIcon; + this.moonIcon = moonIcon; } @Override public void draw() { + fillRectangle( bounds, backgroundColor ); + if ( darkThemeActive ) { + drawImage( moonIcon, bounds.x, bounds.y ); + } else { + drawImage( sunIcon, bounds.x, bounds.y ); + } drawRectangle( bounds, borderColor ); } diff --git a/src/br/com/davidbuzatto/jsge/imgui/GuiDropdownList.java b/src/br/com/davidbuzatto/jsge/imgui/GuiDropdownList.java index fa15e19..9bafbed 100644 --- a/src/br/com/davidbuzatto/jsge/imgui/GuiDropdownList.java +++ b/src/br/com/davidbuzatto/jsge/imgui/GuiDropdownList.java @@ -19,7 +19,6 @@ import br.com.davidbuzatto.jsge.core.engine.EngineFrame; import br.com.davidbuzatto.jsge.geom.Rectangle; import br.com.davidbuzatto.jsge.math.MathUtils; -import br.com.davidbuzatto.jsge.math.Vector2; import java.awt.Color; import java.util.List; @@ -205,7 +204,7 @@ private void drawDropdownList( Color borderColor, Color containerColor, Color te @Override public void setEnabled( boolean enabled ) { super.setEnabled( enabled ); - itemsList.setEnabled( enabled ); + //itemsList.setEnabled( enabled ); } /** diff --git a/src/br/com/davidbuzatto/jsge/imgui/GuiTheme.java b/src/br/com/davidbuzatto/jsge/imgui/GuiTheme.java index ec022d6..98b0ba7 100644 --- a/src/br/com/davidbuzatto/jsge/imgui/GuiTheme.java +++ b/src/br/com/davidbuzatto/jsge/imgui/GuiTheme.java @@ -22,7 +22,7 @@ import java.util.List; /** - * Classe para criação de temas. + * Classe para criação, gerenciamento e instalação de temas. * * @author Prof. Dr. David Buzatto */ @@ -179,56 +179,128 @@ public static GuiTheme buildDarkTheme() { GuiTheme theme = new GuiTheme(); - theme.backgroundColor = new Color( 201, 201, 201 ); - theme.borderColor = new Color( 131, 131, 131 ); - theme.textColor = new Color( 104, 104, 104 ); + theme.backgroundColor = new Color( 60, 63, 65 ); + theme.borderColor = new Color( 97, 99, 101 ); + theme.textColor = new Color( 187, 187, 187 ); - theme.mouseOverBackgroundColor = new Color( 201, 239, 254 ); - theme.mouseOverBorderColor = new Color( 91, 178, 217 ); - theme.mouseOverTextColor = new Color( 108, 155, 188 ); + theme.mouseOverBackgroundColor = new Color( 80, 83, 85 ); + theme.mouseOverBorderColor = new Color( 118, 120, 122 ); + theme.mouseOverTextColor = new Color( 190, 190, 190 ); - theme.mouseDownBackgroundColor = new Color( 151, 232, 255 ); - theme.mouseDownBorderColor = new Color( 4, 146, 199 ); - theme.mouseDownTextColor = new Color( 54, 139, 175 ); + theme.mouseDownBackgroundColor = new Color( 103, 107, 109 ); + theme.mouseDownBorderColor = new Color( 142, 145, 147 ); + theme.mouseDownTextColor = new Color( 190, 190, 190 ); - theme.disabledBackgroundColor = new Color( 230, 233, 233 ); - theme.disabledBorderColor = new Color( 181, 193, 194 ); - theme.disabledTextColor = new Color( 174, 183, 184 ); + theme.disabledBackgroundColor = new Color( 136, 141, 145 ); + theme.disabledBorderColor = new Color( 159, 165, 168 ); + theme.disabledTextColor = new Color( 199, 201, 203 ); - theme.containerBackgroundColor = new Color( 245, 245, 245 ); - theme.containerBorderColor = new Color( 144, 171, 181 ); - theme.containerTextColor = new Color( 144, 171, 181 ); - theme.containerTitleBarBackgroundColor = new Color( 201, 201, 201 ); - theme.containerTitleBarBorderColor = new Color( 131, 131, 131 ); - theme.containerTitleBarTextColor = new Color( 104, 104, 104 ); + theme.containerBackgroundColor = new Color( 23, 23, 23 ); + theme.containerBorderColor = new Color( 110, 110, 110 ); + theme.containerTextColor = new Color( 110, 110, 110 ); + theme.containerTitleBarBackgroundColor = new Color( 20, 20, 20 ); + theme.containerTitleBarBorderColor = new Color( 80, 80, 80 ); + theme.containerTitleBarTextColor = new Color( 160, 160, 160 ); - theme.disabledContainerBackgroundColor = new Color( 230, 233, 233 ); - theme.disabledContainerBorderColor = new Color( 181, 193, 194 ); - theme.disabledContainerTextColor = new Color( 181, 193, 194 ); - theme.disabledContainerTitleBarBackgroundColor = new Color( 230, 233, 233 ); - theme.disabledContainerTitleBarBorderColor = new Color( 181, 193, 194 ); - theme.disabledContainerTitleBarTextColor = new Color( 181, 193, 194 ); + theme.disabledContainerBackgroundColor = new Color( 136, 141, 145 ); + theme.disabledContainerBorderColor = new Color( 159, 165, 168 ); + theme.disabledContainerTextColor = new Color( 199, 201, 203 ); + theme.disabledContainerTitleBarBackgroundColor = new Color( 136, 141, 145 ); + theme.disabledContainerTitleBarBorderColor = new Color( 159, 165, 168 ); + theme.disabledContainerTitleBarTextColor = new Color( 199, 201, 203 ); - theme.progressBarProgressFillColor = new Color( 151, 232, 255 ); + theme.progressBarProgressFillColor = new Color( 180, 180, 180 ); - theme.listContainerBackgroundColor = new Color( 245, 245, 245 ); - theme.disabledListContainerBackgroundColor = new Color( 245, 245, 245 ); + theme.listContainerBackgroundColor = new Color( 60, 63, 65 ); + theme.disabledListContainerBackgroundColor = new Color( 121, 128, 132 ); - theme.scrollBarTrackColor = new Color( 220, 220, 220 ); - theme.disabledScrollBarTrackColor = new Color( 220, 220, 220 ); + theme.scrollBarTrackColor = new Color( 180, 180, 180 ); + theme.disabledScrollBarTrackColor = new Color( 180, 180, 180 ); theme.colorPickerDisabledOverlayColor = ColorUtils.fade( EngineFrame.LIGHTGRAY, 0.5 ); theme.dialogOverlayColor = new Color( 0, 0, 0, 100 ); - theme.toolTipBackgroundColor = new Color( 230, 233, 233 ); - theme.toolTipBorderColor = new Color( 181, 193, 194 ); - theme.toolTipTextColor = new Color( 130, 130, 130 ); + theme.toolTipBackgroundColor = new Color( 30, 32, 33 ); + theme.toolTipBorderColor = new Color( 130, 130, 130 ); + theme.toolTipTextColor = new Color( 187, 187, 187 ); return theme; } + /** + * Cria um novo tema usando uma cor básica e sua inversa para destaques. + * + * @param color A cor. + * @return Um tema de cor base. + */ + public static GuiTheme buildColoredTheme( Color color ) { + + GuiTheme theme = new GuiTheme(); + Color inv = ColorUtils.colorInvert( color ); + Color cw = ColorUtils.lerp( color, Color.WHITE, 0.5 ); + Color cb = ColorUtils.lerp( color, Color.BLACK, 0.5 ); + + theme.backgroundColor = ColorUtils.colorBrightness( color, .1 ); + theme.borderColor = ColorUtils.colorBrightness( color, -.2 ); + theme.textColor = ColorUtils.colorBrightness( color, -.3 ); + + theme.mouseOverBackgroundColor = ColorUtils.colorBrightness( inv, .2 ); + theme.mouseOverBorderColor = ColorUtils.colorBrightness( inv, -.3 ); + theme.mouseOverTextColor = ColorUtils.colorBrightness( inv, .7 ); + + theme.mouseDownBackgroundColor = ColorUtils.colorBrightness( inv, -.1 ); + theme.mouseDownBorderColor = ColorUtils.colorBrightness( inv, -.25 ); + theme.mouseDownTextColor = ColorUtils.colorBrightness( inv, .7 ); + + theme.disabledBackgroundColor = ColorUtils.colorBrightness( cw, -.1 ); + theme.disabledBorderColor = ColorUtils.colorBrightness( cw, -.2 ); + theme.disabledTextColor = ColorUtils.colorBrightness( cw, .8 ); + + theme.containerBackgroundColor = ColorUtils.colorBrightness( cw, .1 ); + theme.containerBorderColor = ColorUtils.colorBrightness( cw, -.2 );; + theme.containerTextColor = ColorUtils.colorBrightness( cw, -.4 ); + theme.containerTitleBarBackgroundColor = ColorUtils.colorBrightness( cb, .1 ); + theme.containerTitleBarBorderColor = ColorUtils.colorBrightness( cb, -.2 ); + theme.containerTitleBarTextColor = ColorUtils.colorBrightness( cw, .2 ); + + theme.disabledContainerBackgroundColor = ColorUtils.colorBrightness( cw, -.1 ); + theme.disabledContainerBorderColor = ColorUtils.colorBrightness( cw, -.2 ); + theme.disabledContainerTextColor = ColorUtils.colorBrightness( cw, .8 ); + theme.disabledContainerTitleBarBackgroundColor = ColorUtils.colorBrightness( cw, -.3 ); + theme.disabledContainerTitleBarBorderColor = ColorUtils.colorBrightness( cw, -.4 ); + theme.disabledContainerTitleBarTextColor = ColorUtils.colorBrightness( cw, .8 ); + + theme.progressBarProgressFillColor = ColorUtils.colorBrightness( inv, -.1 ); + + theme.listContainerBackgroundColor = ColorUtils.colorBrightness( color, .3 ); + theme.disabledListContainerBackgroundColor = ColorUtils.colorBrightness( cw, -.1 ); + + theme.scrollBarTrackColor = ColorUtils.colorBrightness( cw, -.1 ); + theme.disabledScrollBarTrackColor = ColorUtils.colorBrightness( cw, -.1 ); + + theme.colorPickerDisabledOverlayColor = ColorUtils.fade( EngineFrame.LIGHTGRAY, 0.5 ); + + theme.dialogOverlayColor = new Color( 0, 0, 0, 100 ); + + theme.toolTipBackgroundColor = ColorUtils.colorBrightness( cb, .1 ); + theme.toolTipBorderColor = ColorUtils.colorBrightness( cb, -.2 ); + theme.toolTipTextColor = ColorUtils.colorBrightness( cw, .2 ); + + return theme; + + } + + /** + * Cria um tema "vazio", usando a cor cinza. + * + * @return O tema cinza. + */ + public static GuiTheme buildEmptyTheme() { + return buildColoredTheme( EngineFrame.LIGHTGRAY ); + } + /** * Instala o tema globalmente. Deve ser usado antes de se inciciar a criação * dos componentes. @@ -284,50 +356,66 @@ public void install() { } /** - * Instala o tema globalmente, para os novos componentes que forem criados, - * e nos componentes passados que já foram criados. + * Aplica o tema nos componentes passados. * * @param components Os componentes. */ - public void install( List components ) { - install(); + public void apply( List components ) { for ( GuiComponent c : components ) { - install( c ); + apply( c ); } } /** - * Instala o tema globalmente, para os novos componentes que forem criados, - * e nos componentes passados que já foram criados. + * Aplica o tema nos componentes passados. * * @param components Os componentes. */ - public void install( GuiComponent... components ) { - install(); + public void apply( GuiComponent... components ) { for ( GuiComponent c : components ) { - install( c ); + apply( c ); } } /** - * Instala o tema em um componente e em seus subcomponentes se necessário. + * Instala o tema globalmente e o aplica nos componentes passados. + * + * @param components Os componentes. + */ + public void installAndApply( List components ) { + install(); + apply( components ); + } + + /** + * Instala o tema globalmente e o aplica nos componentes passados. + * + * @param components Os componentes. + */ + public void installAndApply( GuiComponent... components ) { + install(); + apply( components ); + } + + /** + * Aplica o tema em um componente e em seus subcomponentes se necessário. * * @param component O componente. */ - private void install( GuiComponent component ) { + public void apply( GuiComponent component ) { component.setBackgroundColor( backgroundColor ); component.setBorderColor( borderColor ); component.setTextColor( textColor ); if ( component instanceof GuiColorPicker c ) { - install( c.hueSlider ); - install( c.alphaSlider ); + apply( c.hueSlider ); + apply( c.alphaSlider ); } else if ( component instanceof GuiDropdownList c ) { - install( c.itemsList ); + apply( c.itemsList ); } else if ( component instanceof GuiGlue c ) { - install( c.baseComponent ); - install( c.children ); + apply( c.baseComponent ); + GuiTheme.this.installAndApply( c.children ); } else if ( component instanceof GuiGroup c ) { c.setBorderColor( containerBorderColor ); c.setTextColor( containerTextColor ); @@ -337,7 +425,7 @@ private void install( GuiComponent component ) { } else if ( component instanceof GuiList c ) { c.setBackgroundColor( listContainerBackgroundColor ); c.setScrollBarTrackColor( scrollBarTrackColor ); - install( c.scrollBar ); + apply( c.scrollBar ); } else if ( component instanceof GuiPanel c ) { c.setBackgroundColor( containerBackgroundColor ); c.setBorderColor( containerBorderColor ); @@ -349,11 +437,11 @@ private void install( GuiComponent component ) { } else if ( component instanceof GuiSlider c ) { c.setBackgroundColor( containerBackgroundColor ); c.setTrackFillColor( mouseOverBackgroundColor ); - install( c.sliderButton ); + apply( c.sliderButton ); } else if ( component instanceof GuiSpinner c ) { c.setBackgroundColor( containerBackgroundColor ); - install( c.leftButton ); - install( c.rightButton ); + apply( c.leftButton ); + apply( c.rightButton ); } else if ( component instanceof GuiTextField c ) { c.setBackgroundColor( containerBackgroundColor ); } else if ( component instanceof GuiToolTip c ) { @@ -361,25 +449,25 @@ private void install( GuiComponent component ) { c.setBorderColor( toolTipBorderColor ); c.setTextColor( toolTipTextColor ); } else if ( component instanceof GuiWindow c ) { - install( c.closeButton ); + apply( c.closeButton ); c.setBackgroundColor( containerBackgroundColor ); c.setBorderColor( containerBorderColor ); c.setTitleBarBackgroundColor( containerTitleBarBackgroundColor ); c.setTitleBarBorderColor( containerTitleBarBorderColor ); c.setTitleBarTextColor( containerTitleBarTextColor ); if ( c instanceof GuiConfirmDialog d ) { - install( d.messageLabel ); - install( d.button1 ); - install( d.button2 ); - install( d.button3 ); + apply( d.messageLabel ); + apply( d.button1 ); + apply( d.button2 ); + apply( d.button3 ); } else if ( c instanceof GuiInputDialog d ) { - install( d.messageLabel ); - install( d.okButton ); - install( d.cancelButton ); - install( d.textField ); + apply( d.messageLabel ); + apply( d.okButton ); + apply( d.cancelButton ); + apply( d.textField ); } else if ( c instanceof GuiMessageDialog d ) { - install( d.messageLabel ); - install( d.okButton ); + apply( d.messageLabel ); + apply( d.okButton ); } }