Add hover styling to some objects

This commit is contained in:
Sasha Koshka 2023-08-12 15:06:02 -04:00
parent 6eacdf5ccf
commit 2bd5a4a66b
1 changed files with 41 additions and 6 deletions

View File

@ -36,11 +36,13 @@ var outerShadow = border(0xa4afc0FF, 0xa4afc0FF, 0xa4afc0ff, 0xa4afc0ff, 0, 1
var buttonColor = hex(0xe9eaeaFF)
var buttonColorPressed = hex(0xe3e4e4FF)
var buttonColorFocused = hex(0xe4e6e8FF)
var buttonColorHovered = hex(0xf1f3f5FF)
var dotColor = hex(0xa4b1c6FF)
var inputColor = hex(0xe3e4e4FF)
var textColor = hex(0x000000FF)
var backgroundColor = hex(0xd6d6d6FF)
var gutterColor = hex(0xbfc6d1FF)
var gutterColorHovered = hex(0xc5cbd6FF)
type Theme struct { }
@ -71,7 +73,8 @@ func (Theme) Apply (object tomo.Object, role theme.Role) event.Cookie {
switch role.Object {
case "Button":
mouseDown := false
pressed := false
hovered := false
updateStyle := func () {
border := []tomo.Border {
@ -87,10 +90,12 @@ func (Theme) Apply (object tomo.Object, role theme.Role) event.Cookie {
box.SetColor(buttonColorFocused)
border[1] = focusedBorder
}
if mouseDown {
if pressed {
box.SetColor(buttonColorPressed)
border[2] = sunkenShadow
box.SetPadding(tomo.I(5, 8, 4, 9))
} else if hovered {
box.SetColor(buttonColorHovered)
}
box.SetBorder(border...)
}
@ -98,16 +103,24 @@ func (Theme) Apply (object tomo.Object, role theme.Role) event.Cookie {
return event.MultiCookie (
box.OnMouseDown(func (button input.Button) {
if button != input.ButtonLeft { return }
mouseDown = true
pressed = true
updateStyle()
}),
box.OnMouseUp(func (button input.Button) {
if button != input.ButtonLeft { return }
mouseDown = false
pressed = false
updateStyle()
}),
box.OnFocusEnter(updateStyle),
box.OnFocusLeave(updateStyle))
box.OnFocusLeave(updateStyle),
box.OnMouseEnter(func () {
hovered = true
updateStyle()
}),
box.OnMouseLeave(func () {
hovered = false
updateStyle()
}))
case "TextInput", "NumberInput":
box.SetPadding(tomo.I(5, 4, 4, 5))
@ -145,6 +158,9 @@ func (Theme) Apply (object tomo.Object, role theme.Role) event.Cookie {
box.SetMinimumSize(image.Pt(2, 2))
case "Slider":
pressed := false
hovered := false
updateStyle := func () {
border := []tomo.Border {
engravedBorder,
@ -156,13 +172,32 @@ func (Theme) Apply (object tomo.Object, role theme.Role) event.Cookie {
if box.Focused() {
border[1] = focusedBorder
}
if hovered && !pressed {
box.SetColor(gutterColorHovered)
}
box.SetBorder(border...)
}
updateStyle()
return event.MultiCookie (
box.OnFocusEnter(updateStyle),
box.OnFocusLeave(updateStyle))
box.OnFocusLeave(updateStyle),
box.OnMouseDown(func (button input.Button) {
pressed = true
updateStyle()
}),
box.OnMouseUp(func (button input.Button) {
pressed = false
updateStyle()
}),
box.OnMouseEnter(func () {
hovered = true
updateStyle()
}),
box.OnMouseLeave(func () {
hovered = false
updateStyle()
}))
case "SliderHandle":
box.SetMinimumSize(image.Pt(12, 12))