[ODK Community] Changing font size / not squishing labels

Support
1

You could have the labels be images (with the text in the image). Then you
can control the width of the columns.

Note that the list-nolabel and label appearances are intended for a series
of selections underneath one common label heading.

You might instead consider the grid layout (appearance="compact-5") with an
explicit 5-column wide display.

In the latest ODK Collect, this will render 5 equal-width columns with the
value choices.

··· On Sun, Jun 9, 2013 at 11:13 PM, Andrew Dinkel wrote:

Hi all,

I have a question about designing an ODK form with a specific layout. I
hope the answer is not too obvious! But here goes:

Basically, I want to design a survey that consists of one page in the form
of a field list. The question would be stated at the top. It’s a survey
about emotions, so I want to ask people how they feel at a given moment and
then present them with a set of emotions (angry, calm, happy...), each of
which is reported on a 5-point Likert scale.

Currently I have implemented this as a group with appearance=”field-list”
and then a set of select1 questions with horizontal radio buttons. The
select1 questions don’t have question labels, they only have item labels.
However, I ran into a problem: There are 5 radio buttons, and I only want
to label the first and the last (the two extreme anchor points). But the
label text gets “squished” such that the labels cannot be read anymore. My
solution was to create two separate select1 questions, one for the label
(with only two options) and one for the radio buttons (with no labels), but
that seems clunky and it does not look nice. I've provided a code snippet
below.

Here are my two questions:

  • Is there a way to change the font size of the choice labels and the
    group label and to make them boldface?
  • Is there any more elegant way of achieving what I am trying to do
    without squishing the choice labels to be unreadable?

Thank you very much!!

How do you feel right now? 1 Unhappy -1 0 Happy 1 0 1 2 3 4

... [More questions of this type] ...

--

Post: opendatakit@googlegroups.com
Unsubscribe: opendatakit+unsubscribe@googlegroups.com
Options: http://groups.google.com/group/opendatakit?hl=en

You received this message because you are subscribed to the Google Groups
"ODK Community" group.
To unsubscribe from this group and stop receiving emails from it, send an
email to opendatakit+unsubscribe@googlegroups.com.
For more options, visit https://groups.google.com/groups/opt_out.

--
Mitch Sundt
Software Engineer
University of Washington
mitchellsundt@gmail.com

2

Hi Mitch,

Thank you so much for the helpful tip. I am working on the same project and
we have made great progress using image labels.

I am wondering, is there a way we can control the space between objects on
the screen? In the screenshots below, all the text is held within images we
inserted as labels. We have cropped these image labels very tightly, yet
there are large white spaces between the image labels and the text.

To make it clear what I am talking about, I have highlighted two of these
white spaces in blue. Below the image is an Xform sample.

https://lh5.googleusercontent.com/-W3EogWOr5dI/UejBcoFC8SI/AAAAAAAAARY/Bq3vzkIqfOo/s1600/screenshot.png

c1 
  <select1 appearance="list-nolabel" ref="/NewWidgets/group_B1/q_B1_1">
    <label/>
    <item>
      <label></label>
      <value>0</value>
    </item>
    <item>
      <label></label>
      <value>1</value>
    </item>
    <item>
      <label></label>
      <value>2</value>
    </item>
    <item>
      <label></label>
      <value>3</value>
    </item>
    <item>
      <label></label>
      <value>4</value>
    </item>
  </select1>

This repeats for every emotion we query.

Once again, thank you for the help.

-Andrew

··· On Monday, June 10, 2013 10:54:38 AM UTC-7, Mitch Sundt wrote: > > You could have the labels be images (with the text in the image). Then you > can control the width of the columns. > > Note that the list-nolabel and label appearances are intended for a series > of selections underneath one common label heading. > > You might instead consider the grid layout (appearance="compact-5") with > an explicit 5-column wide display. > > In the latest ODK Collect, this will render 5 equal-width columns with the > value choices. > > > > On Sun, Jun 9, 2013 at 11:13 PM, Andrew Dinkel <andrew...@gmail.com wrote: > >> Hi all, >> >> I have a question about designing an ODK form with a specific layout. I >> hope the answer is not too obvious! But here goes: >> >> Basically, I want to design a survey that consists of one page in the >> form of a field list. The question would be stated at the top. It’s a >> survey about emotions, so I want to ask people how they feel at a given >> moment and then present them with a set of emotions (angry, calm, >> happy...), each of which is reported on a 5-point Likert scale. >> >> Currently I have implemented this as a group with appearance=”field-list” >> and then a set of select1 questions with horizontal radio buttons. The >> select1 questions don’t have question labels, they only have item labels. >> However, I ran into a problem: There are 5 radio buttons, and I only want >> to label the first and the last (the two extreme anchor points). But the >> label text gets “squished” such that the labels cannot be read anymore. My >> solution was to create two separate select1 questions, one for the label >> (with only two options) and one for the radio buttons (with no labels), but >> that seems clunky and it does not look nice. I've provided a code snippet >> below. >> >> Here are my two questions: >> - Is there a way to change the font size of the choice labels and the >> group label and to make them boldface? >> - Is there any more elegant way of achieving what I am trying to do >> without squishing the choice labels to be unreadable? >> >> Thank you very much!! >> >> >> >> >> >> >> >> >> How do you feel right now? >> 1 >> >> >> >> >> >> >> >> Unhappy >> -1 >> >> >> >> 0 >> >> >> Happy >> 1 >> >> >> >> >> >> >> >> 0 >> >> >> >> 1 >> >> >> >> 2 >> >> >> >> 3 >> >> >> >> 4 >> >> >> >> ... [More questions of this type] ... >> >> >> >> -- >> -- >> Post: opend...@googlegroups.com >> Unsubscribe: opendatakit...@googlegroups.com >> Options: http://groups.google.com/group/opendatakit?hl=en >> >> --- >> You received this message because you are subscribed to the Google Groups >> "ODK Community" group. >> To unsubscribe from this group and stop receiving emails from it, send an >> email to opendatakit...@googlegroups.com . >> For more options, visit https://groups.google.com/groups/opt_out. >> >> >> > > > -- > Mitch Sundt > Software Engineer > University of Washington > mitche...@gmail.com >
3

Can you zip up and send me your form and image files?

( directly to mitchellsundt@gmail.com )

I think I have a fix for this, but need something to test it with.

Basically, the blue space is for the text label, which, in this case is
blank. If we check for it being blank, and hide the text label widget, we
should eliminate that blue space.

··· On Thu, Jul 18, 2013 at 9:36 PM, Andrew Campbell wrote:

Hi Mitch,

Thank you so much for the helpful tip. I am working on the same project
and we have made great progress using image labels.

I am wondering, is there a way we can control the space between objects on
the screen? In the screenshots below, all the text is held within images we
inserted as labels. We have cropped these image labels very tightly, yet
there are large white spaces between the image labels and the text.

To make it clear what I am talking about, I have highlighted two of these
white spaces in blue. Below the image is an Xform sample.

https://lh5.googleusercontent.com/-W3EogWOr5dI/UejBcoFC8SI/AAAAAAAAARY/Bq3vzkIqfOo/s1600/screenshot.png

c1 
  <select1 appearance="list-nolabel" ref="/NewWidgets/group_B1/q_B1_1">
    <label/>
    <item>
      <label></label>
      <value>0</value>
    </item>
    <item>
      <label></label>
      <value>1</value>
    </item>
    <item>
      <label></label>
      <value>2</value>
    </item>
    <item>
      <label></label>
      <value>3</value>
    </item>
    <item>
      <label></label>
      <value>4</value>
    </item>
  </select1>

This repeats for every emotion we query.

Once again, thank you for the help.

-Andrew

On Monday, June 10, 2013 10:54:38 AM UTC-7, Mitch Sundt wrote:

You could have the labels be images (with the text in the image). Then
you can control the width of the columns.

Note that the list-nolabel and label appearances are intended for a
series of selections underneath one common label heading.

You might instead consider the grid layout (appearance="compact-5") with
an explicit 5-column wide display.

In the latest ODK Collect, this will render 5 equal-width columns with
the value choices.

On Sun, Jun 9, 2013 at 11:13 PM, Andrew Dinkel andrew...@gmail.comwrote:

Hi all,

I have a question about designing an ODK form with a specific layout. I
hope the answer is not too obvious! But here goes:

Basically, I want to design a survey that consists of one page in the
form of a field list. The question would be stated at the top. It’s a
survey about emotions, so I want to ask people how they feel at a given
moment and then present them with a set of emotions (angry, calm,
happy...), each of which is reported on a 5-point Likert scale.

Currently I have implemented this as a group with
appearance=”field-list” and then a set of select1 questions with horizontal
radio buttons. The select1 questions don’t have question labels, they only
have item labels.
However, I ran into a problem: There are 5 radio buttons, and I only
want to label the first and the last (the two extreme anchor points). But
the label text gets “squished” such that the labels cannot be read anymore.
My solution was to create two separate select1 questions, one for the label
(with only two options) and one for the radio buttons (with no labels), but
that seems clunky and it does not look nice. I've provided a code snippet
below.

Here are my two questions:

  • Is there a way to change the font size of the choice labels and the
    group label and to make them boldface?
  • Is there any more elegant way of achieving what I am trying to do
    without squishing the choice labels to be unreadable?

Thank you very much!!

How do you feel right now? 1 Unhappy -1 0 Happy 1 0 1 2 3 4

... [More questions of this type] ...

--

Post: opend...@googlegroups.com
Unsubscribe: opendatakit...@**googlegroups.com

Options: http://groups.google.com/**group/opendatakit?hl=enhttp://groups.google.com/group/opendatakit?hl=en

You received this message because you are subscribed to the Google
Groups "ODK Community" group.
To unsubscribe from this group and stop receiving emails from it, send
an email to opendatakit...@**googlegroups.com.

For more options, visit https://groups.google.com/**groups/opt_outhttps://groups.google.com/groups/opt_out
.

--
Mitch Sundt
Software Engineer
University of Washington
mitche...@gmail.com

--

Post: opendatakit@googlegroups.com
Unsubscribe: opendatakit+unsubscribe@googlegroups.com
Options: http://groups.google.com/group/opendatakit?hl=en

You received this message because you are subscribed to the Google Groups
"ODK Community" group.
To unsubscribe from this group and stop receiving emails from it, send an
email to opendatakit+unsubscribe@googlegroups.com.
For more options, visit https://groups.google.com/groups/opt_out.

--
Mitch Sundt
Software Engineer
University of Washington
mitchellsundt@gmail.com

4

OK. The changes will be in the update to the 1.4 Release Candidate.