How to make checkbox control transparent


#1

Hi,

I want to make the checkbox transparent.

Also, I am sharing the kind of interaction I am trying to develop is:

There is a multi-select dropdown ( not a smart search multi-select).

Selection item 1 ( 20 pixel space) √
Selection item 2 ( 20 pixel space)
Selection item 3 (20 pixel space)
Selection item 4 (20 pixel space)
Selection item 5 (20 pixel space)

Now, that check-mark should only be visible and can be used as toggle on/off.
Based on toggle, I want to show-hide branching condition. User will have an ability to toggle on all the options at a time. On hover, I would like to show border of the entire row.

So, basically if I could make the check-box transparent, then probably I can able to achieve something from the above interaction.

Kindly help.


#2

Hi! Hmm, if you’re aiming to have the border of the checkbox be transparent but still have the checkmark be visible then I believe building a custom checkbox would be easiest. Axure RP 8 and earlier don’t allow customization of the checkbox widget’s style, and while Axure RP 9 does it doesn’t quite do what you want; the checkbox’s border can be made transparent, however doing so also makes the checkmark transparent. If you were to build a custom checkbox then you would separate those elements and style them independently. The Axure RP 8 tutorial below should help with that if you’re interested:

http://archive.axure.com/support/training/custom-checkbox-radio-button-tutorial


#3

Alyssa:

Thank you so much. Yes you were right, I wanted to customize the control. And the tutorial link you shared does helped. Thank you so much. I implemented and its working perfectly as expected.

BTW when we search online on google the same requirement, why such links are not displayed in google search? As you are the admin to Axure, just checking this from you.

Anyways, thank you so much for your help!!

I have another ticket opened yesterday it self, if you can share your advice on that as well, will be a great help.

Regards


#4

Glad that helped! Good question about the documentation; I believe it’s not listed in Google searches because the Axure RP 8 website as a whole has been archived, but I can pass the feedback along to our documentation team letting them know that some of the tutorials on the archived site are still useful resources that users look for. Thank you!


closed #5

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.