Löve Frames - A GUI Library

[Mercurialol]

From what I've seen ImageButton doesn't have the ability to use a different image for highlighted and pressed state ?

[Nikolai Resokav]

Is there any specific reason why the text object's method "DrawText" is in the object file rather than in the skin?

I guess I wanted the text to be drawn internally when I initially wrote the object, I'm not really sure though. Regardless, that code should probably be moved to the skin files to make text rendering easier to customize.

From what I've seen ImageButton doesn't have the ability to use a different image for highlighted and pressed state ?

Correct, though that kind of functionality would not be difficult to implement.

[Abisso]

Using different images for the normal, hover and clicked state is just a matter of checking the Imagebutton.hover variable and love.mouse.isDown() and change the image accordingly. This is how I did it and it works.

Code: Select all

		if object.hover then
			if love.mouse.isDown("l") == false and object:GetImage() ~= hover then object:SetImage(hover)
			elseif object:GetImage() ~= clicked then object:SetImage(clicked)
			end
		elseif object:GetImage() ~= normal then object:SetImage(normal)
		end

Of course, you have to call this inside the Update(object, dt) function relative to the Imagebutton.

Speaking of ImageButton, it would be also very useful if we could set the size (scale) of the button itself.
Being in need of such a thing, I tried to implement an alternative way by using Images and the same workaround above to check hover and clicked states. All works fine, but unfortunately, while I was doing this I noticed an unexpected behaviour: if you scale down (and probably also if you scale up) the Image, the actual dimension of the object remains unchanged. e.g. if you assign a tooltip to the scaled down image, you can clearly see that it still uses the original image size to decide if it should be displayed or not; and same goes for the hovering state. Is there a relatively easy workaround to this? Or at least a way to have scaled Imagebuttons right from the creation? I'm basically trying to create a clickable thumbnails list from a set of external images.

And now that it can't be misjudged any more as a "captatio benevolentiae", let me spend at least a few words to thank you for your excellent work, Nikolai. Not only I would have never got this far without your Loveframes, but, to be frank, I wouldn't have probably even started. You offered an incredibly useful and versatile set of functions, and combined that with a good documentation and support here on the boards.
You have my utmost gratitude and profound respect for that.

[Nikolai Resokav]

Speaking of ImageButton, it would be also very useful if we could set the size (scale) of the button itself.

Good idea. I'll look into implementing that when I have some spare time.

And now that it can't be misjudged any more as a "captatio benevolentiae", let me spend at least a few words to thank you for your excellent work, Nikolai. Not only I would have never got this far without your Loveframes, but, to be frank, I wouldn't have probably even started. You offered an incredibly useful and versatile set of functions, and combined that with a good documentation and support here on the boards.
You have my utmost gratitude and profound respect for that.

Thank you for the kind words.

[Zarty55]

I'm trying to implement your library with gamera; I've maded some slighty changes on the code, and it works nice, but there is just one problem. It seems that there is something limiting some objects into the window size, so every object that has a x < 0 stays at 0. I remember that I saw something related in the documentation, but it's really late here where I live, and I'm literally 2 entire hours trying to find this. I really have to sleep, can someone help me? Thanks! hahaha

I'm going to sleep now

Edit: So, I've managed to make it work, it's fine now. My problem now is that I wanted to have multiple instances of the GUI system, one to be placed on the world, and another on the window. Is there any way to be able to do this easily?

Great library btw. It's freaking awesome! haha :p

[Positive07]

Good idea. I'll look into implementing that when I have some spare time.

I made this function for scaling images in different modes, there is:

• Fill: Tries to fill the space without distorting the image,
• Fit: Fit the image in the space without distorting it,
• Center: Centers the image, doesn't scale it at all
• Expand: Expands the image to fit the space, distorting it.

Code: Select all

imagen = function (typ, image, vx, vy, w, h)
	local typ = typ:lower()
	local width, height = image:getDimensions()
	local scale, offset
	if not(typ == "expand" or typ == "center") then
		local scl
		if h/height > w/width then 
			if typ == "fit" then scl = w/width elseif typ == "fill" then scl = h/height end
		else 
			if typ == "fit" then scl = h/height elseif typ == "fill" then scl = w/width end
		end
		scale = {x = scl, y = scl}
		offset = {
			x = (w - width*scale.x) / 2;
			y = (h - height*scale.y) / 2
		}
	elseif typ == "expand" then
		scale = {
			x = w/width;
			y = h/height
		}
		offset = {x = 0, y = 0}
	elseif typ == "center" then
		scale = {x = 1, y = 1}
		offset = {
			x = (w - width) / 2;
			y = (h - width) / 2
		}
	end
	if not (offset and scale) then return end
	return function(r, sx, sy, ox, oy, kx, ky)
		local r, ox, oy, sx, sy, kx, ky = r or 0, ox or 0, oy or 0, sx or 1, sy or 1, kx or 0, ky or 0
		love.graphics.draw(image, vx + offset.x, vy + offset.y, r, scale.x * sx, scale.y * sy, ox, oy, kx, ky) 
	end
end

The use is simple, just do imagen(type,image, x, y, w, h)

type (string) "fill", "fit", "expand" or "center"
image (Image) the image object to use
x (number) the x position
y (number) the y position
w (number) the width of the area
h (number) the height of the area

Returns a function that draws the image (This way you dont have to create the same object many times)

Here is an example

[khamarr3524]

Is this library still being maintained or planned to be updated to 0.9.1?

[Abisso]

Is this library still being maintained or planned to be updated to 0.9.1?

As you can see, Loveframes' author writes in this thread very often (he's Nikolai Resokav). Last time he did (29th of April) he said:

Speaking of ImageButton, it would be also very useful if we could set the size (scale) of the button itself.

Good idea. I'll look into implementing that when I have some spare time.

So, of course it's still maintained. As per the update, as far as I know there's no need to upgrade anything: the library should work out of the box with 0.9.1.

@Positive07: interesting idea you had there. It doesn't suit my current needs but I'm sure a lot of people will find it useful (and maybe me as well, in the future).

Speaking of Image and Imagebutton and scaling, I've found it was quite easy to modify the objects to suit my needs: I've fixed the issue with the scaled Image still considered as non scaled in terms of width and height, and added the possibility to scale Imagebuttons and easily implement alternative images for the hovered and clicked state (as well as controlling other aspects of them with custom functions). I'm going to share something in the next few days, as soon as I refine it a bit more.

[AlexYeCu]

Any plans of making Android version?

[Positive07]

Any plans of making Android version?

This is a LÖVE library compatible with LÖVE for PC, MAC and Linux, it should easily be adapted (if necessary at all) to work with the android port of LÖVE