Button • Customizing buttons • Icon, Radius, Gradient

[uskiara]

Awesome extension !

[Joejsanz]

Thank you so much @uskiara

[HarshVardhanSolanki]

Nice extension, It will help us alot in UI enhancements.

[Joejsanz]

Thank you so much @HarshVardhanSolanki

[HarshVardhanSolanki]

I give you a suggestion, register button aside not with the main component, use id feature in the main block, it will help user to register button or buttons in two, but designs in a one.

1. Register single button block

2. Register Buttons list block

3. SetShadow for list

4. SetShadow for button

I hope you got my points.

[Usane]

Fantastic! Finally customized buttons. Thank you.

[Joejsanz]

@HarshVardhanSolanki

@Joejsanz

Note: This shadow is for the button text.
For the shadow that goes under the button, I'm still working on it.

I had already implemented the shadow behind the button, but I removed that function because when clicking the button, the shadow disappeared, then I managed to make it stay, but I had to remove the interaction of the button with the native events of App Inventor.
So for now the shadow will have to wait a bit.

• This is a look at what was done, the shading is very faint but it looks good.....

---

@HarshVardhanSolanki

use id feature in the main block

About using ID in the block, it would be nice if I created some events to identify which block was clicked, but I don't have any events created, since this extension works with App Inventor's native events.

Or I don't know if you mean something different and I misunderstood.

@HarshVardhanSolanki

• Register Buttons list block
• SetShadow for list

I imagine you suggest the list of buttons to put the same style on that list and not use too many blocks?

[Joejsanz]

Thank you so much @Usane

[HarshVardhanSolanki]

@Joejsanz

I imagine you suggest the list of buttons to put the same style on that list and not use too many blocks?

Yes

[Kevinkun]

it will be better if the color socket can accept AI2 color.

[Joejsanz]

@HarshVardhanSolanki Your suggestion sounds good, I'll check that out.

[HarshVardhanSolanki]

Sure, Also Kevin's suggestion will very helpful after sockets accepts the Ai2 colors.

[Joejsanz]

@Kevinkun You're right, I'm going to implement that.

[Joejsanz]

Update:

@Joejsanz

Function inputs have been completely changed, they now accept lists of buttons and each parameter also accepts lists to individually configure each button, if you have a list of buttons with more than 1 button and in the parameters only the first button is configured, the other buttons will take those settings.

Color inputs now accept native App Inventor colors and colors in hexadecimal.

---

Examples:

---

---

[uskiara]

Dear @Usane,
while this extension is still really awesome and powerful (@Joejsanz don't stop to develop yours !!!) please do not forget these two:
@gordonlu310 's com.gordonlu.buttonicons.aix
and
@TIMAI2 's uk.co.metricrat.buttonmaticon.aix

Now we have a "big choice" for customizing buttons.
Great !

[HarshVardhanSolanki]

Great you listen, best you built.

[Usane]

You are right but, those are not focusing on shaping the button itself. For example I really missed the radius of the fillets. Now we have it. Now I miss the triangle, hexagon and star shapes, haha.

[Maximo_Aguilar]

excelente

[TechInterest]

8.827912/10
Pros:

• Everything except cons
  Cons:
• No button shadow but text shadow

[Joejsanz]

Yes, it is a notable drawback since the shadow of the text is customized and not that of the button. It is already in the code, but I had to omit it due to a bug in the function. I will start working on it soon.