GOOi, an Android-Oriented GUI Library

[alberto_lara]

When you have any greater texture behind it, it might make more sense to simply put the background transparent and add some semi-transparent effect for clicking and such.

I see, you mean something to give the impression it's being clicked, right?

[Marty]

I see, you mean something to give the impression it's being clicked, right?

Yes.

Basically I have a complicated background. Maybe I designed a full window with nice texture that is in the background of my form. Your controls on my form should be able to be 100% transparent if I want to. Or I want the buttons only to be bordered and the rest is transparent so I see the background of my form. Since my buttons are re-arranged based on the resolution, I cannot simply design the whole button, but I need to be able to see the background texture through it. I haven't tested it, but I think putting a transparent image should already suit my needs.

Now what would be very helpful is to set a different image when the user is clicking / interacting with the control. Maybe I want to overlay some shadows or some white semi transparent film to the surface of the button. This would make your lib an allrounder when it comes to GUI on LÖVE.

I'm very exited to try your lib this week when everything works like expected on my end.


Keep up that good work!

[alberto_lara]

I see, well, you may want to see gooi.glass(), gooi.mode3d() and gooi.shadow() if you want to see different styles in action. For transparency, you just have to set bgColor like {255, 0, 0, 127}, for instance (for a red transparent color). If you want a totally transparent background with a solid border then just play with the corresponding properties.

As for the image set with :setBGImage(), there's not way of setting transparency for that, but there should be, I could add that functionality on the next version of GOOi (or you could add a PR for that )

[Marty]

I see, well, you may want to see gooi.glass(), gooi.mode3d() and gooi.shadow() if you want to see different styles in action. For transparency, you just have to set bgColor like {255, 0, 0, 127}, for instance (for a red transparent color). If you want a totally transparent background with a solid border then just play with the corresponding properties.

As for the image set with :setBGImage(), there's not way of setting transparency for that, but there should be, I could add that functionality on the next version of GOOi (or you could add a PR for that )

Thank you very much, I will look into such functions.

However, I just noticed that your lib is using a global variable called "component". This is a bit of goof for me, since I'm using a global variable component for accessing my ECS-components.

In my opinion any library should be nested in one global variable, which is "gooi" in this case. Now I could require the lib into a variable, but this will break, because you access your global variables from your code, everywhere. It's not just component, but even layout, label, slider, etc. Requiring those to be globally accessible sounds bad by design, because you'd have no idea with what you might name-conflict, and thus, easy implementation is not ensured, anymore.

It would be great if you could overthink the API of gooi, so you end up with only one global variable, called gooi?



EDIT: Also, please check out this design:


Its buttons are designed with 3 segments. The left and the right segment is for the each side (left/right) of the button. The middle segment of the texture is for all the space between the other two segments. So this part gets repeated on the x axis.

I could not find a way to build buttons like this. Is this possible? After trying a little I can clearly see that you stretch the image to fit the content. However on low res images this does not look good. I'd love to know how I can change that.



Overall I love the idea of your grid system, but I miss more features like independent padding in any cell of the grid, or did I miss it?
Also, how can I change the background of a button when it's getting clicked?

[alberto_lara]

I could not find a way to build buttons like this. Is this possible?

not really, but this could be added in future versions of GOOi, please feel free to make a PR or a feature request.

but I miss more features like independent padding in any cell of the grid, or did I miss it?

No independent padding either (this is easier to implement than the button thing though)

how can I change the background of a button when it's getting clicked?

you can use the onPress() and onRelease() callbacks (not really practical but it's how it can be done right now):

Code: Select all

btn = gooi.newButton({text = "my button"})
:onPress(function(c) c:bg(alternativeColor); end)
:onRelease(function(c) c:bg(initialColor); end)

EDIT: about the global variables thing, you're totally right, I'll have to change a few code for that.

[yetneverdone]

Panels (grids) should have the setting to draw outer border
In modals confirm, allow texts "okay" and "cancel" be modifiable, or just provide a way to make dialogue box.
Panel:add should allow in what col and row it be set into.

[yintercept]

Theres a *tiny* pull request waiting on github that allows users to specify the y positioning of text on a button.

Do you have any other small code tweaks/chores you'd be willing to farm out?

[memzen]

I worked on updating Gooi with the color range changes in Love 11. The colors are better but not 100%. Get here:

https://drive.google.com/open?id=1FpOmO ... o7X4taF4km

[alberto_lara]

Hey everyone, sorry for the delay, it's been some crazy times in the office.

In modals confirm, allow texts "okay" and "cancel" be modifiable, or just provide a way to make dialogue box.

I think it's possible to do it, here you can see the code which does that. There's no example (currently) for that in the Wiki, I'll keep it in mind while I fix some stuff here and there (like the lost images). I'll try to have some updates in a few days or a couple of weeks.

[alberto_lara]

Update #1: I've merged this PR (thanks to jmiskovic)

Update #2: Updated images on readme file and Wiki