/ Development  

Discover how to revolutionize your action buttons with Unicode icons

Hi there AppWorks fans,

Welcome to a new installment of AppWorks tips.

I always like to speak with others about AppWorks; It opens up new insights, brings new creativity, you learn from each other, and now it’s brought online via this post. It’s not a difficult thing to do, but if you never made the connection in your brain by someone else telling you, it’s a missed opportunity on improving your skills! So, continue the read and let’s learn new stuff…


Let get right into it…

Boot up the AppWorks machine and login to your favorite organization and workspace. I always start with a new fresh (restored) image with a fresh and clean folder-structure in a standard project. Create yourself a nice entity with just one property (can be anything that comes up your mind), generate all the default BBs, do a publication and make sure you can create a first instance in runtime.

Next…Have a new action type of ‘Rule’ BB, make it simple and effective like this (name a_hit_me and label “Hit me!”):

unicode_001

Let’s be clear…Never build such action to set a property by itself, but for this post we’re allowed! 😁

Where are you waiting for!? Publish and…

unicode_002

Nice and great fun, but what if we would like to make that button shinier with an icon!? Ohwww…Now we’re talking! Is this possible? Well, with CSS we can probably make it work, but let’s try something else here! For this we first move our focus to the always interesting W3Schools website; Specifically, in the “Unicode” character set and “UTF-8” encoding section; Why? Well, I move into the ‘Arrows’ subsection where I make a copy of one selectable icon:

unicode_003

Don’t copy the numbers, but the real icon!

Get back into design-time and update the action button label pasting the icon in front of the text:

unicode_004

Do a second publication and check to outcome:

unicode_005

How nice! 😀 This immediately raises my “What else?” question…


Q/A (what else?) section

What about sparkles?

unicode_006

Or a checkmark? Well, CHECK…It works!

A smiley? WORKS!! Ha-ha…I never thought this would work!

And what about ISO-8859-1 encoding samples? Well, have a look:

unicode_007

Including from a list perspective:

unicode_008

Does this also work for labels in ‘Boolean’ selections?

unicode_009

I’ll be damned:

unicode_010

No way…

unicode_011

Get out of here…

unicode_012


That’s a total unexpected and amazing “DONE” 🤓! I would never have thought of this myself and would never have been exposed as it would not for my connected guru; who remains…
⬜⬜⬜⬜⬜⬜⬛⬛⬛⬛⬛⬛⬛⬛⬜⬜⬜⬜⬜⬜
⬜⬜⬜⬛⬛⬛⬜⬜⬜⬜⬜⬜⬜⬜⬛⬛⬛⬜⬜⬜
⬜⬜⬛⬜⬜⬜⬜⬜⬜⬜⬜⬜⬜⬜⬜⬜⬜⬛⬜⬜
⬜⬛⬜⬜⬜⬜⬜⬜⬜⬜⬜⬜⬜⬜⬜⬜⬜⬜⬛⬜
⬛⬜⬜⬜⬜⬜⬜⬜⬜⬜⬜⬜⬜⬜⬜⬜⬜⬜⬜⬛
⬛⬜⬜⬛⬛⬛⬛⬜⬜⬜⬜⬜⬜⬛⬛⬛⬛⬜⬜⬛
⬛⬜⬛⬜⬜⬛⬛⬛⬜⬜⬜⬜⬛⬛⬛⬜⬜⬛⬜⬛
⬛⬛⬜⬜⬜⬜⬜⬛⬛⬜⬜⬛⬛⬜⬜⬜⬜⬜⬛⬛
⬛⬜⬜⬜⬜⬜⬜⬜⬜⬜⬜⬜⬜⬜⬜⬜⬜⬜⬜⬛
⬛⬛⬜⬛⬛⬛⬛⬜⬜⬜⬜⬜⬜⬛⬛⬛⬛⬜⬛⬛
⬛⬜⬛⬛⬛⬛⬛⬛⬜⬜⬜⬜⬛⬛⬛⬛⬛⬛⬜⬛
⬛⬜⬜⬜⬜⬜⬜⬜⬛⬜⬜⬛⬜⬜⬜⬜⬜⬜⬜⬛
⬛⬜🏼🏼⬜⬜⬜⬜⬛⬜⬜⬛⬜⬜⬜⬜🏼🏼⬜⬛
⬛🏼🏼🏼🏼⬜⬜⬜⬛⬜⬜⬛⬜⬜⬜🏼🏼🏼🏼⬛
⬛⬜🏼🏼⬜⬜⬜⬛⬜⬜⬜⬜⬛⬜⬜⬜🏼🏼⬜⬛
⬛⬜⬛⬜⬜⬜⬜⬛⬜⬜⬜⬜⬛⬜⬜⬜⬜⬛⬜⬛
⬛⬜⬛⬛⬜⬜⬜⬜⬛⬜⬜⬛⬜⬜⬜⬜⬛⬛⬜⬛
⬛⬜⬜⬛⬛⬛⬛⬛⬛⬛⬛⬛⬛⬛⬛⬛⬛⬜⬜⬛
⬛⬜⬜🏽⬛⬛⬛⬛⬛⬜⬜⬛⬛⬛⬛⬛🏽⬜⬜⬛
⬜⬛⬜⬜🏽🏽🏽⬜⬜⬜⬜⬜⬜🏽🏽🏽⬜⬜⬛⬜
⬜⬜⬛⬜⬜⬜🏽🏽🏽🏽🏽🏽🏽🏽⬜⬜⬜⬛⬜⬜
⬜⬜⬛⬜⬜⬜⬜⬜⬜⬛⬛⬜⬜⬜⬜⬜⬜⬛⬜⬜
⬜⬜⬜⬛⬜⬜⬜⬜⬜⬛⬛⬜⬜⬜⬜⬜⬛⬜⬜⬜
⬜⬜⬜⬜⬛⬜⬜⬜⬜⬛⬛⬜⬜⬜⬜⬛⬜⬜⬜⬜
⬜⬜⬜⬜⬜⬛⬜⬜⬜⬛⬛⬜⬜⬜⬛⬜⬜⬜⬜⬜
⬜⬜⬜⬜⬜⬜⬛⬜⬜⬛⬛⬜⬜⬛⬜⬜⬜⬜⬜⬜
⬜⬜⬜⬜⬜⬜⬜⬛⬛⬛⬛⬛⬛⬜⬜⬜⬜⬜⬜⬜
Resource anonymous-mask

This demonstrates again that you can solve the most complex things with a simple action…As long as you know how! Now you know…broadcast it further, and we’ll grow in our experience and knowledge. Have a great weekend and till the next one.

Don’t forget to subscribe to get updates on the activities happening on this site. Have you noticed the quiz where you find out if you are also “The AppWorks guy”?