Implementing a dropdown menu

[hak33m16]

Hi, I'm trying to implement a dropdown menu, similar to something you'd see here: https://www.w3schools.com/howto/tryit.asp?filename=tryhow_css_js_dropdown

I've got some basic code working for clicking the button/functionality, but I'm confused on how the actual layout portion would work. It seems like I'd need something similar to the position: absolute concept built into the library? How would you recommend going about this in the frame of furex?

As a starting point, this is the code I have for the button I'd like to have "children" buttons inside:

type TextBoxButton struct {
	BoxColor         color.Color
	HoverBoxColor    color.Color
	PressedBoxColor  color.Color
	TextColor        color.Color
	HoverTextColor   color.Color
	PressedTextColor color.Color
	Text             string
	FontFileName     string
	resourceManager  *managers.ResourceManager
	mouseover        bool
	pressed          bool
}

func (tbb *TextBoxButton) HandleDraw(screen *ebiten.Image, frame image.Rectangle) {
	var currentBoxColor color.Color
	var currentTextColor color.Color
	if tbb.mouseover {
		currentBoxColor = tbb.HoverBoxColor
		currentTextColor = tbb.HoverTextColor
	} else {
		currentBoxColor = tbb.BoxColor
		currentTextColor = tbb.TextColor
	}

	if tbb.pressed {
		currentBoxColor = tbb.PressedBoxColor
		currentTextColor = tbb.PressedTextColor
	}

	ebitenutil.DrawRect(
		screen,
		float64(frame.Min.X),
		float64(frame.Min.Y),
		float64(frame.Size().X),
		float64(frame.Size().Y),
		currentBoxColor,
	)

	textBounds := text.BoundString(*tbb.resourceManager.GetFont(tbb.FontFileName), tbb.Text)
	text.Draw(
		screen,
		tbb.Text,
		*tbb.resourceManager.GetFont(tbb.FontFileName),
		int((frame.Min.X+frame.Max.X)/2)-(textBounds.Dx()/2),
		int((frame.Min.Y+frame.Max.Y)/2)+textBounds.Size().Y-(textBounds.Dy()/2),
		currentTextColor,
	)
}

func (tbb *TextBoxButton) HandleMouseEnter(x, y int) bool {
	tbb.mouseover = true
	return true
}

func (tbb *TextBoxButton) HandleMouseLeave() {
	tbb.mouseover = false
}

func (tbb *TextBoxButton) HandlePress(x, y int, t ebiten.TouchID) {
	tbb.pressed = true
}

func (tbb *TextBoxButton) HandleRelease(x, y int, isCancel bool) {
	tbb.pressed = false
}

And what it looks like when I render it:

This is another example:

[yottahmd]

Hi @hak33m16 👋 Thank you for the detailed question! The View already has the Position property and you can specify AbsolutePosition to it. For example:

&View{
  Position: furex.PositionAbsolute,
  Left: 20,
  Top: 20,
  // ...
}

Could you check if it works in your program?