Buttons not using styles font for alignment of text about gooi

[trelemar]

I've noticed that comp:setAlign("center") throws it off as well, but sometimes using component.align = "center" or just calling center in gooi.newButton({align = "center"}) agruments works. Sometimes... Not always

[gustavostuff]

The issue about the buttons not fitting the text is now fixed in version 0.0.2, I was unable to reproduce the second issue about the text alignment, a small snippet reproducing the issue may help me.

I had to make some decisions about how the buttons react to changes in the font size, take a look at this example (and run it if you have a chance):

require "gooi"

function love.load()
	gr = love.graphics
	kb = love.keyboard
	mo = love.mouse

	bigFont = gr.newFont(18)

	btn1 = gooi.newButton("gooi.alert()"):onRelease(function()
		gooi.alert("alert!");
	end)

	btn2 = gooi.newButton("gooi.confirm()"):onRelease(function()
		gooi.confirm("Choose", function()
			gooi.alert("You clicked yes! :)");
		end, function()
			gooi.confirm("Are you sure? :(", function()
				gooi.alert("I'M CRYIIIIING")
			end, function()
				gooi.alert("Good, I have a chance :)")
			end)
		end)
	end)

	btn3 = gooi.newButton("button 3")

	joyGame = gooi.newJoy()
	btnShoot = gooi.newButton("Shoot")
	lblLife = gooi.newLabel("Life:")
	lblLife.w = 60
	barLife = gooi.newBar(0.9)

	gridPanel = gooi.newPanel(320, 140, 450, 100, "grid 3x3"):add(btn1, btn2):add(btn3, "3,2")
	gamePanel = gooi.newPanel(320, 260, 350, 250, "game")
	gamePanel:add(joyGame, "b-l")
	gamePanel:add(btnShoot, "b-r")
	gamePanel:add(lblLife, "t-l")
	gamePanel:add(barLife, "t-l")

	comps = {
		gooi.newLabel("this is a label", 10, 10):setOpaque(true),
		gooi.newButton("Tooltip button", 10, 60, 300, 20):setTooltip("this is a tooltip"),
		gooi.newSlider(.75, 10, 110),
		gooi.newCheck("this is a check box", 10, 160),
		gooi.newRadio("this is a radio", "rg1", 10, 210),
		gooi.newText("this is a text box", 10, 260),
		gooi.newBar(.7, 10, 310),
		gooi.newSpinner(0, 200000, 150, 10, 360),
		gooi.newJoy(10, 410),
		gooi.newKnob(.9, 320, 10),
		gridPanel,
		btn1,
		btn2,
		btn3,
		gooi.newButton("Change style", 320, 520):onRelease(function()
			for i = 1, #comps do
				comps[i]:setStyle({
					font = bigFont,
					bgColor = "#FF8800AA"
				})
			end
		end):bg("#00FF0088"),
		joyGame,
		btnShoot,
		lblLife,
		barLife,
	}

	-- This enables tooltips and make dialogs smaller:
	gooi.desktopMode()
end
function love.update(dt)
	gooi.update(dt)
end
function love.draw()
	gr.rectangle("line", gridPanel.x, gridPanel.y, gridPanel.w, gridPanel.h)
	gr.rectangle("line", gamePanel.x, gamePanel.y, gamePanel.w, gamePanel.h)
	
	gooi.draw()
	gr.print("FPS: "..love.timer.getFPS())
end

function love.mousereleased(x, y, button) gooi.released() end
function love.mousepressed(x, y, button)  gooi.pressed() end

function love.textinput(text)
	gooi.textinput(text)
end
function love.keypressed(key)
	gooi.keypressed(key)
	if key == "escape" then
		quit()
	end
end

function quit()
	love.event.quit()
end

Before pressing "Change style":

After:

Note:

• Components inside a panel don't change their proportions
• Free components with no text attribute (Joysticks, Progress bars, etc.) keep their bounds too
• Only free elements with a text component react to font size changes
• The component bounds fit the text of the new font