diff --git a/.gitignore b/.gitignore index e474b09..54cb580 100644 --- a/.gitignore +++ b/.gitignore @@ -49,3 +49,6 @@ cacerts # Ocelot configuration file /ocelot.conf + +# Design sketches +/refs/ diff --git a/sprites/TabArrow.png b/sprites/TabArrow.png new file mode 100644 index 0000000..9ff7bbd Binary files /dev/null and b/sprites/TabArrow.png differ diff --git a/sprites/icons/SettingsSound.png b/sprites/icons/SettingsSound.png new file mode 100644 index 0000000..f8f45d9 Binary files /dev/null and b/sprites/icons/SettingsSound.png differ diff --git a/src/main/resources/ocelot/desktop/colorscheme.txt b/src/main/resources/ocelot/desktop/colorscheme.txt index 5d96277..282af69 100644 --- a/src/main/resources/ocelot/desktop/colorscheme.txt +++ b/src/main/resources/ocelot/desktop/colorscheme.txt @@ -71,9 +71,11 @@ HistogramGrid = #336633 HistogramFill = #73ff7360 HistogramEdge = #ccfdcc -VerticalMenuBackground = #222222cc -VerticalMenuEntryActive = #333333 -VerticalMenuEntryForeground = #bbbbbb +VerticalMenuBackground = #c6c6c6 +VerticalMenuEntryIcon = #888888 +VerticalMenuEntryActive = #dfdfdf +VerticalMenuEntryForeground = #333333 +VerticalMenuBorder = #dfdfdf SliderBackground = #aaaaaa SliderBorder = #888888 diff --git a/src/main/resources/ocelot/desktop/spritesheet.png b/src/main/resources/ocelot/desktop/spritesheet.png index d366592..2b5064f 100644 Binary files a/src/main/resources/ocelot/desktop/spritesheet.png and b/src/main/resources/ocelot/desktop/spritesheet.png differ diff --git a/src/main/resources/ocelot/desktop/spritesheet.txt b/src/main/resources/ocelot/desktop/spritesheet.txt index c950d0d..cfd8a65 100644 --- a/src/main/resources/ocelot/desktop/spritesheet.txt +++ b/src/main/resources/ocelot/desktop/spritesheet.txt @@ -1,5 +1,5 @@ BackgroundPattern 0 0 304 304 -BarSegment 415 105 16 4 +BarSegment 424 105 16 4 ComputerMotherboard 305 0 79 70 Empty 497 21 1 1 EmptySlot 441 147 18 18 @@ -8,6 +8,7 @@ KnobCenter 436 0 50 50 KnobLimits 305 71 50 50 ShadowBorder 487 0 1 24 ShadowCorner 424 122 24 24 +TabArrow 397 105 8 14 buttons/BottomDrawerClose 460 147 18 18 buttons/BottomDrawerOpen 479 147 18 18 buttons/PowerOff 424 180 18 18 @@ -25,6 +26,7 @@ icons/Memory 466 122 16 16 icons/NA 483 122 16 16 icons/RMB 385 105 11 14 icons/RackMountable 356 219 16 16 +icons/SettingsSound 498 147 12 17 icons/Tier0 373 219 16 16 icons/Tier1 390 219 16 16 icons/Tier2 407 219 16 16 @@ -110,8 +112,8 @@ screen/BorderB 492 0 2 8 screen/BorderT 489 0 2 10 screen/CornerBL 365 236 8 8 screen/CornerBR 374 236 8 8 -screen/CornerTL 397 105 8 10 -screen/CornerTR 406 105 8 10 +screen/CornerTL 406 105 8 10 +screen/CornerTR 415 105 8 10 window/BorderDark 509 16 1 4 window/BorderLight 509 11 1 4 window/CloseButton 383 236 7 6 diff --git a/src/main/scala/ocelot/desktop/ui/widget/SettingsDialog.scala b/src/main/scala/ocelot/desktop/ui/widget/SettingsDialog.scala index b58f6ca..c46e937 100644 --- a/src/main/scala/ocelot/desktop/ui/widget/SettingsDialog.scala +++ b/src/main/scala/ocelot/desktop/ui/widget/SettingsDialog.scala @@ -5,7 +5,7 @@ import ocelot.desktop.audio.SoundSource import ocelot.desktop.geometry.{Padding2D, Size2D} import ocelot.desktop.ui.layout.LinearLayout import ocelot.desktop.ui.widget.modal.ModalDialog -import ocelot.desktop.ui.widget.verticalmenu.{VerticalMenu, VerticalMenuButton} +import ocelot.desktop.ui.widget.verticalmenu.{VerticalMenu, VerticalMenuButton, VerticalMenuFiller} import ocelot.desktop.util.{Orientation, ResourceManager, SettingsData} class SettingsDialog extends ModalDialog { @@ -32,6 +32,7 @@ class SettingsDialog extends ModalDialog { children :+= new Widget { override val layout = new LinearLayout(this, orientation = Orientation.Vertical) children :+= menu + children :+= new VerticalMenuFiller() } children :+= new PaddingBox(new Widget { diff --git a/src/main/scala/ocelot/desktop/ui/widget/verticalmenu/VerticalMenu.scala b/src/main/scala/ocelot/desktop/ui/widget/verticalmenu/VerticalMenu.scala index 5aa3182..b54c3f5 100644 --- a/src/main/scala/ocelot/desktop/ui/widget/verticalmenu/VerticalMenu.scala +++ b/src/main/scala/ocelot/desktop/ui/widget/verticalmenu/VerticalMenu.scala @@ -14,7 +14,7 @@ class VerticalMenu extends Widget { override val layout = new LinearLayout(this, orientation = Orientation.Vertical) } - children :+= new PaddingBox(entries, Padding2D.equal(1f)) + children :+= entries def addEntry(w: Widget): Unit = entries.children :+= w diff --git a/src/main/scala/ocelot/desktop/ui/widget/verticalmenu/VerticalMenuButton.scala b/src/main/scala/ocelot/desktop/ui/widget/verticalmenu/VerticalMenuButton.scala index 69cecf8..ee05396 100644 --- a/src/main/scala/ocelot/desktop/ui/widget/verticalmenu/VerticalMenuButton.scala +++ b/src/main/scala/ocelot/desktop/ui/widget/verticalmenu/VerticalMenuButton.scala @@ -3,21 +3,32 @@ package ocelot.desktop.ui.widget.verticalmenu import ocelot.desktop.ColorScheme import ocelot.desktop.color.Color import ocelot.desktop.geometry.{Padding2D, Size2D} -import ocelot.desktop.graphics.Graphics +import ocelot.desktop.graphics.{Graphics, IconDef} import ocelot.desktop.ui.event.handlers.{ClickHandler, HoverHandler} import ocelot.desktop.ui.event.{ClickEvent, HoverEvent, MouseEvent} -import ocelot.desktop.ui.widget.{Label, PaddingBox, Widget} +import ocelot.desktop.ui.layout.LinearLayout +import ocelot.desktop.ui.widget.{Icon, Label, PaddingBox, Widget} +import ocelot.desktop.util.Orientation import ocelot.desktop.util.animation.ColorAnimation class VerticalMenuButton(label: String, handler: () => Unit = () => {}) extends Widget with ClickHandler with HoverHandler { val colorAnimation: ColorAnimation = new ColorAnimation(ColorScheme("VerticalMenuBackground"), 0.6f) - children :+= new PaddingBox(new Label { - override def text: String = label - override def color: Color = ColorScheme("VerticalMenuEntryForeground") - override def maximumSize: Size2D = Size2D(Float.PositiveInfinity, 16) - }, Padding2D(left = 8, right = 8, top = 1, bottom = 1)) + children :+= new PaddingBox(new Widget { + override val layout = new LinearLayout(this, orientation = Orientation.Horizontal) + + children :+= new PaddingBox( + new Icon(IconDef("icons/SettingsSound", 1f, color = ColorScheme("VerticalMenuEntryIcon"))), + Padding2D(right = 8) + ) + + children :+= new Label { + override def text: String = label + override def color: Color = ColorScheme("VerticalMenuEntryForeground") + override def maximumSize: Size2D = Size2D(Float.PositiveInfinity, 16) + } + }, Padding2D(left = 8, right = 24, top = 8, bottom = 8)) override def receiveMouseEvents: Boolean = true @@ -39,6 +50,8 @@ class VerticalMenuButton(label: String, handler: () => Unit = () => {}) override def draw(g: Graphics): Unit = { colorAnimation.update() g.rect(bounds, colorAnimation.color) + g.rect(bounds.x + bounds.w - 2f, bounds.y, 2f, bounds.h, ColorScheme("VerticalMenuBorder")) + g.sprite("TabArrow", bounds.x + bounds.w - 8f, bounds.y + bounds.h / 2f - 7f, 8, 14) drawChildren(g) } } diff --git a/src/main/scala/ocelot/desktop/ui/widget/verticalmenu/VerticalMenuFiller.scala b/src/main/scala/ocelot/desktop/ui/widget/verticalmenu/VerticalMenuFiller.scala new file mode 100644 index 0000000..9e4e032 --- /dev/null +++ b/src/main/scala/ocelot/desktop/ui/widget/verticalmenu/VerticalMenuFiller.scala @@ -0,0 +1,14 @@ +package ocelot.desktop.ui.widget.verticalmenu + +import ocelot.desktop.ColorScheme +import ocelot.desktop.geometry.Size2D +import ocelot.desktop.graphics.Graphics +import ocelot.desktop.ui.widget.Widget + +class VerticalMenuFiller extends Widget { + override def maximumSize: Size2D = Size2D.Inf + + override def draw(g: Graphics): Unit = { + g.rect(bounds.x + bounds.w - 2f, bounds.y, 2f, bounds.h, ColorScheme("VerticalMenuBorder")) + } +}