Radio button and checkbox - reduce bounding box size
May 11, 2016
Hi, I'm trying to manually build an accurate simulation of online forms within a system which contains radio buttons, checkboxes etc. I can reproduce all the actions /responses I need with triggers, buttons sets etc. However I have one issue.
I'm using the smallest radio button and smallest checkbox available which are a perfect match for the client's system. However there are large bounding boxes around the actual clickable objects. If the radio buttons or checkboxes are put in a row on the slide close together the bounding boxes overlap the adjoining buttons or checkboxes. When you test the buttons or checkboxes you don't always select or deselect the correct object due to the overlap as the top bounding box is covering part of the object below. Is there a way of reducing the size of the bounding boxes to about the size of the actual button or checkbox? I have tried in the format tab but any pixel changes are ignored. I don't want to change the size of the button/checkbox, just the bounding box.
I did have the idea of building my own custom radio buttons/checkboxes with states however I can't then toggle the select/deselect behaviour like the provided objects.
19 Replies
OK, I can get the toggling effect by using the Operator = NOT assignment so I could build my own radio buttons and check boxes to get around the problem.
I would however like to know if the bounding box sizes can be changed.
Hi Trevor,
Thanks for reaching out here - and there isn't a way to change the bounding box overall size but I'm curious how much overlap you saw? If it seems beyond the "normal" it's something we could have our team take a look at. If you've got a screenshot or .story file to share here we're happy to take a look.
Hi Ashley, As I'm using the smallest of the radio button and checkbox options the bounding boxes are more of an issue than the standard question type size. These smaller ones are excellent for advanced system simulations as they match IE and Chrome browser sizes but it does mean they are likely to be close together as in an online form. I'll post you a story file tomorrow.
If the bounding boxes don't have to be that large it would be great if they could be made smaller in a later release.
Hi Trevor,
I'd leave the decision and rationale behind their size up to our Product team, but happy to take a look at your sample and compare it to mine to see if there is anything different happening. If it's determined the be that size by default it's certainly something we can share as a feature idea.
Two thoughts, You could put an invisible shape over the boxes that would prevent them from being clicked. Then put small invisible shapes over each button that could be clicked on. That may be a lot easier than building the buttons from scratch. Alternatively, you could replace the buttons with copies of them that do not have the too-large border.
The point is, that however you do it, if you use states named Selected and Normal, you will get those behaviors without having to write your own triggers. Select the appropriate group of buttons, right click, and make them a button set, and you will have all the exact same behaviors as the built-in buttons.
And no, it is not you; the built-in borders on radio and check buttons are unreasonable oversized.
Hi Walt, The Selected and Normal states in a button group works fine for radio buttons as they will deselect a different previously selected radio button. However with checkboxes where you need to allow multiple selected boxes and also be able to deselect a box by clicking it again the only solution is the use triggers and a toggle behaviour.
Hi Ashley, attached is a single slide story file where the radio buttons and checkboxes are placed over a background from a system screen. You will see that the bounding boxes cause major overlapping.
Thanks Trevor - I'll take a look at this file and let you know if I spot something out of order or if it looks to be as expected based on the bounding boxes.
Thanks. This is a simple file with the basic objects, no triggers etc. But you should see that in preview when trying to click specific radio buttons or checkboxes you are actually selecting different objects based on the stacking order.
Thanks Trevor - you really put those close together!
I took a look and confirmed with a few others (it matched a brand new file too) and it seems that the box can't be shrunk smaller than 49 x 61 and the bounding box will scale around it, but won't go smaller than you're seeing. Typically the bounding box is set as such to include the text associated with a potential answer as well - in a standard set up it seems I could insert one 12pt character before the box expands/wraps the text.
So it seems that you'll either need to look at spacing the buttons out further or turn each button into an image so that you can crop fully down to the size required and then add the associated states of selected - you should only have to do one button and then duplicate it. You can still use the images as buttons in terms of submitting a user's answer to a question using a freeform style question and if needing the user to only pick one, create a button set out of your images.
By longstanding computer custom, only one of a group of radio buttons can be selected, while any number of checkboxes in a group can be selected. The nature of the selected state for a checkbox in SL2 is that if the user clicks it, it changes to the selected state, and if the user clicks again, it toggles back to normal state. If you have a state named "Selected", this behavior is hard-wired to that checkbox.
Writing your own triggers that mimic the built-in states can cause them to come into conflict, with results that are frequently interesting, but seldom useful or benign.
hi
Difference Between radio Buttons And Checkbox Buttons?
Thanks
By longstanding computer custom, only one of a group of radio buttons can be selected, while any number of checkboxes in a group can be selected.
Radio buttons are round, checkboxes are rectangular (usually square).
Thanks
Hello! - I'm wondering if there have been any developments to this question.
I am creating a storyline where someone assesses something - they have to check off their selection Gold, Silver or Bronze. However, I am having difficulties with the checkbox borders overlapping and affecting the answer that ends up selected.
Just wondering if there has been any work done on this feature in the past two years or if it would be considered in the future. I understand the checkboxes are designed to input text following the box, but this doesn't work for the project I am working on. Hoping for an easier fix than making images etc because this activity is being used extensively for the project I am working on.
Thanks in advance!
Hi Nicole!
Thanks for checking in! I don't have an update on this feature and we don't have a similar feature on our current roadmap.
In the meantime, our community members might have a workaround for this! Would you mind sharing your file so we can see what you've built so far?
You can share your file by using the Add Attachment button in this discussion.
Hello everyone,
I'd like to post my solution as it may be helpful for any future-visitors.
First, my case is to place checkboxes over a screenshot that was snipped from a web page so I don't need text, just the checkbox.
No matter what I try to do it keeps having a very-big bounding area, by coincidence I typed something while the checkbox was selected and once there's text the bounding area got much smaller, it's still relatively big but this solved my problem. So all I did was to type blank text there and viola .. it all works like charm.
Here's a snip that helps you understand how much smaller it got, I hope my comment helps.
Minha contribuição.
Pra você não precisar digitar nada da cor para esconder, digite Alt+0160 (ele vai inserir um espaço)
É inacreditável que em 10 anos isso ainda não foi solucionado.