{"type":"doc","content":[{"type":"paragraph","content":[{"type":"inlineExtension","attrs":{"extensionType":"com.atlassian.confluence.macro.core","extensionKey":"multiexcerpt-include-macro","parameters":{"macroParams":{"_parentId":{"value":"2143958327"},"macro_uuid":{"value":"846f10d6-3459-462c-8ce9-b12bb0b90265"},"name":{"value":"Technical Documentation"},"templateData":{"value":"eJyLjgUAARUAuQ=="},"page":{"value":"CommCare Help Site Design Guidance"},"addpanel":{"value":"false"}},"macroMetadata":{"macroId":{"value":"2ae60e0e-6dd5-48d8-9c62-9b1eb9e80784"},"schemaVersion":{"value":"1"},"placeholder":[{"type":"icon","data":{"url":"https://raw.githubusercontent.com/fuegokit/appfire-design-systems-brand-svg/main/single-color-brand-icons/af-logo-multi-excerpt-24.svg"}}],"title":"MultiExcerpt Include"}},"localId":"75dc1d1c-44eb-41a8-9697-24af5ea382f1"}},{"type":"hardBreak"},{"text":"Table of Contents:","type":"text","marks":[{"type":"strong"}]}]},{"type":"extension","attrs":{"layout":"default","extensionType":"com.atlassian.confluence.macro.core","extensionKey":"toc","parameters":{"macroParams":{"minLevel":{"value":"1"},"maxLevel":{"value":"3"},"outline":{"value":"false"},"_parentId":{"value":"2143958327"},"style":{"value":"none"},"type":{"value":"list"},"printable":{"value":"true"}},"macroMetadata":{"macroId":{"value":"250e5deb-1f54-487f-ab75-40682d924e96"},"schemaVersion":{"value":"1"},"title":"Table of Contents"}},"localId":"45bb786f-0184-4392-b584-5540d8f6a89f"}},{"type":"paragraph","content":[{"text":"Items on this page are useful for formatting in CommCare apps and are described below. Most of them require you to edit an \"Advanced\" field of your question. The Advanced section of the ","type":"text"},{"type":"inlineCard","attrs":{"url":"https://dimagi.atlassian.net/wiki/x/PDHKfw"}},{"text":" is by default collapsed/hidden since most fields are not relevant; however it can be displayed via the form builder by selecting Advanced from the drop down menu immediately to the right of the red Delete button. ","type":"text"}]},{"type":"heading","attrs":{"level":2},"content":[{"text":"A few things to keep in mind","type":"text"}]},{"type":"paragraph","content":[{"text":"Some of these appearances must be configured by advanced modification of forms. You can request better form builder support for these formatting options by reaching out to ","type":"text"},{"text":"support@dimagi.com.","type":"text","marks":[{"type":"link","attrs":{"href":"mailto:support@dimagi.com"}}]},{"text":" All supported formatting options are listed on this page. If you use a formatting option found in XLSForms, we cannot guarantee compatibility with CommCare. ","type":"text"}]},{"type":"paragraph","content":[{"text":"Please note that these configurations apply to CommCare mobile apps, and some do not work with ","type":"text"},{"type":"inlineCard","attrs":{"url":"https://dimagi.atlassian.net/wiki/x/sgHKfw"}},{"text":" or ","type":"text"},{"type":"inlineCard","attrs":{"__confluenceMetadata":{"isRenamedTitle":true,"linkType":"page","contentTitle":"Web Applications","versionAtSave":"27"},"url":"https://dimagi.atlassian.net/wiki/spaces/commcarepublic/pages/2143955161"}},{"text":". To see comparable formatting options for Web Apps, go to ","type":"text"},{"type":"inlineCard","attrs":{"url":"https://dimagi.atlassian.net/wiki/x/rQTKfw"}},{"text":". In order to confirm that these advanced formatting attributes are working, you will need to test the application in the appropriate place for your project, whether that is a mobile device or Web Apps.","type":"text"}]},{"type":"heading","attrs":{"level":2},"content":[{"text":"Appearance Attribute - Overview","type":"text"}]},{"type":"paragraph","content":[{"text":"By editing the appearance attribute or making other advanced changes in the ","type":"text"},{"type":"inlineCard","attrs":{"__confluenceMetadata":{"isRenamedTitle":true,"linkType":"page","contentTitle":"Form Builder","versionAtSave":"135"},"url":"https://dimagi.atlassian.net/wiki/spaces/commcarepublic/pages/2143957308"}},{"text":", you can do some very nice things with your form structure while working in CommCare for Android and Web Apps. The options listed here are supported as of CommCare 2.9","type":"text"}]},{"type":"paragraph","content":[{"text":"In the form builder the Appearance Attribute field can be found near the bottom of the Advanced section of the Question Properties: ","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center","width":760,"widthType":"pixel"},"content":[{"type":"media","attrs":{"__fileSize":57728,"__fileMimeType":"image/png","width":1042,"id":"46c2502f-d5a9-459d-9bc1-cbb5bccebd2d","collection":"contentId-2143958327","type":"file","__fileName":"image2017-8-14 10:7:27.png","height":379}}]},{"type":"heading","attrs":{"level":2},"content":[{"text":"Appearance Attribute Examples and Instructions","type":"text"}]},{"type":"heading","attrs":{"level":3},"content":[{"text":"Audio Widgets","type":"text"}]},{"type":"paragraph","content":[{"text":"Not supported on App Preview","type":"text","marks":[{"type":"strong"}]}]},{"type":"paragraph","content":[{"text":"Beginning in CommCare 2.50, a new audio widget is used. This widget does not standardly include the ability to upload audio; however, this can be accomplished in two ways.","type":"text"}]},{"type":"orderedList","attrs":{"order":1},"content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Set an Audio question's ","type":"text"},{"text":"Appearance Attribute","type":"text","marks":[{"type":"em"}]},{"text":" to: ","type":"text"},{"text":"acquire-or-upload","type":"text","marks":[{"type":"strong"}]}]},{"type":"orderedList","attrs":{"order":1},"content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"This will allow the user to choose between selecting audio or recording it.","type":"text"}]}]}]}]}]},{"type":"mediaSingle","attrs":{"layout":"center","width":173,"widthType":"pixel"},"content":[{"type":"media","attrs":{"__fileSize":57857,"__fileMimeType":"image/png","width":1080,"alt":"Screenshot_20241023-203404.png","id":"259fa55f-c53d-4dea-86bb-ac31e68d3179","collection":"contentId-2143958327","type":"file","__fileName":"Screenshot_20241023-203404.png","height":2340}}]},{"type":"orderedList","attrs":{"order":2},"content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Set an Audio question's ","type":"text"},{"text":"Appearance Attribute","type":"text","marks":[{"type":"em"}]},{"text":" to: ","type":"text"},{"text":"legacy","type":"text","marks":[{"type":"strong"}]}]},{"type":"orderedList","attrs":{"order":1},"content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"This will use the previous audio widget and retain the old functionality","type":"text"}]}]}]}]}]},{"type":"rule"},{"type":"heading","attrs":{"level":3},"content":[{"text":"Automatic Advancing","type":"text"}]},{"type":"paragraph","content":[{"text":"Not supported on App Preview","type":"text","marks":[{"type":"strong"}]}]},{"type":"paragraph","content":[{"text":"You can have your form advanced to the next screen automatically upon choosing an answer. This works for single select multiple choice questions only (not for checkbox / multiple-select).","type":"text"}]},{"type":"paragraph","content":[{"text":"Be careful when deciding to use this because if the user accidentally chooses an answer they will be advanced to the next screen and will need to be comfortable swiping back to make the change/correction.","type":"text"}]},{"type":"heading","attrs":{"level":4},"content":[{"text":"How to do it","type":"text"}]},{"type":"paragraph","content":[{"text":"In the Advanced section of the Question Properties, set the","type":"text","marks":[{"type":"textColor","attrs":{"color":"#222222"}}]},{"text":" field ","type":"text"},{"text":"Appearance Attribute","type":"text","marks":[{"type":"em"}]},{"text":" to: ","type":"text"},{"type":"inlineExtension","attrs":{"extensionType":"com.atlassian.confluence.macro.core","extensionKey":"anchor","parameters":{"macroParams":{"":{"value":"quick"},"legacyAnchorId":{"value":"AdvancedCommCareAndroidFormatting-quick"},"_parentId":{"value":"2143958327"}},"macroMetadata":{"macroId":{"value":"e1108bd8-e124-4246-bc8f-8a2e4f07b276"},"schemaVersion":{"value":"1"},"title":"Anchor"}},"localId":"13d26e08-8d93-4f6a-893d-f0bcc603f149"}},{"text":"quick","type":"text","marks":[{"type":"strong"}]}]},{"type":"paragraph","content":[{"text":"Note: As of CommCare 2.45, you cannot use the appearance attribute \"quick\" with the last question of a form to auto-submit a form.","type":"text","marks":[{"type":"em"}]}]},{"type":"rule"},{"type":"heading","attrs":{"level":3},"content":[{"text":"Automatic Advancing with Images","type":"text"}]},{"type":"paragraph","content":[{"text":"Not supported on App Preview","type":"text","marks":[{"type":"strong"}]}]},{"type":"paragraph","content":[{"text":"You can have your form advanced to the next screen automatically upon choosing an answer. This works for single select multiple choice questions only (not for checkbox / multiple-select).","type":"text"}]},{"type":"paragraph","content":[{"text":"Consider making this a required question, so that a button must be selected to continue. ","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center","width":250,"widthType":"pixel"},"content":[{"type":"media","attrs":{"__fileSize":60391,"__fileMimeType":"image/jpeg","width":576,"id":"d0bd47d6-17af-43bd-88ee-970d5e55f2ed","collection":"contentId-2143958327","type":"file","__fileName":"Screenshot_20220323-101822_CommCare.jpg","height":1280}}]},{"type":"heading","attrs":{"level":4},"content":[{"text":"How to do it","type":"text"}]},{"type":"paragraph","content":[{"text":"In the Advanced section of the Question Properties, set the","type":"text","marks":[{"type":"textColor","attrs":{"color":"#222222"}}]},{"text":" field ","type":"text"},{"text":"Appearance Attribute","type":"text","marks":[{"type":"em"}]},{"text":" to: ","type":"text"},{"type":"inlineExtension","attrs":{"extensionType":"com.atlassian.confluence.macro.core","extensionKey":"anchor","parameters":{"macroParams":{"":{"value":"quick compact123"},"legacyAnchorId":{"value":"AdvancedCommCareAndroidFormatting-quickcompact123"},"_parentId":{"value":"2143958327"}},"macroMetadata":{"macroId":{"value":"7a3e4932-cfe2-481a-ba89-453d0ecb3681"},"schemaVersion":{"value":"1"},"title":"Anchor"}},"localId":"6fe921d8-9751-4b9e-a332-f8b76b00a2e5"}},{"text":"quick compact","type":"text","marks":[{"type":"strong"}]},{"type":"hardBreak"}]},{"type":"paragraph","content":[{"text":"For a screen, two images wide use: compact-2.","type":"text"}]},{"type":"paragraph","content":[{"text":"For a screen. three images wide use: compact-3.","type":"text"}]},{"type":"rule"},{"type":"heading","attrs":{"level":3},"content":[{"text":"Editable Barcode Scan Result","type":"text"}]},{"type":"paragraph","content":[{"text":"Not supported on App Preview","type":"text","marks":[{"type":"strong"}]}]},{"type":"paragraph","content":[{"text":"The barcode question widget allows you to scan a barcode and store the result as a string. At times it is useful to be able to edit that string after scanning.","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center","width":250,"widthType":"pixel"},"content":[{"type":"media","attrs":{"__fileSize":141687,"__fileMimeType":"image/png","width":720,"id":"92b9ce19-bc81-4712-8943-ad484b625b30","collection":"contentId-2143958327","type":"file","__fileName":"screen.png","height":1280}}]},{"type":"heading","attrs":{"level":4},"content":[{"text":"How to do it","type":"text"}]},{"type":"paragraph","content":[{"text":"In the Advanced section of the Question Properties section set the ","type":"text","marks":[{"type":"textColor","attrs":{"color":"#222222"}}]},{"text":" ","type":"text"},{"text":"Appearance Attribute","type":"text","marks":[{"type":"em"}]},{"text":" to: ","type":"text"},{"type":"inlineExtension","attrs":{"extensionType":"com.atlassian.confluence.macro.core","extensionKey":"anchor","parameters":{"macroParams":{"":{"value":"editable"},"legacyAnchorId":{"value":"AdvancedCommCareAndroidFormatting-editable"},"_parentId":{"value":"2143958327"}},"macroMetadata":{"macroId":{"value":"0cd9abe6-dfb1-4bd1-9252-668c0da234bd"},"schemaVersion":{"value":"1"},"title":"Anchor"}},"localId":"1c1fedd9-0c41-4590-8ba5-9ea6a855fb2f"}},{"text":"editable","type":"text","marks":[{"type":"strong"}]}]},{"type":"rule"},{"type":"heading","attrs":{"level":3},"content":[{"text":"Force capture for audio/video/image widgets","type":"text"}]},{"type":"paragraph","content":[{"text":"Not supported on App Preview","type":"text","marks":[{"type":"strong"}]}]},{"type":"paragraph","content":[{"text":"The audio/video/image capture widgets by default allow you to either capture new media or select a file from your device. In some situations one might want force the user to capture new media and not have the option to choose a media file. This is possible by following the directions below.","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center","width":515,"widthType":"pixel"},"content":[{"type":"media","attrs":{"__fileSize":42873,"__fileMimeType":"image/png","width":675,"alt":"image-20240418-231459.png","id":"d92a013b-9f0f-4a58-a5bf-49b887853356","collection":"contentId-2143958327","type":"file","__fileName":"image-20240418-231459.png","height":591}}]},{"type":"heading","attrs":{"level":4},"content":[{"text":"How to do it","type":"text"}]},{"type":"paragraph","content":[{"text":"In the Advanced section of the Question Properties section set the ","type":"text","marks":[{"type":"textColor","attrs":{"color":"#222222"}}]},{"text":" ","type":"text"},{"text":"Appearance Attribute","type":"text","marks":[{"type":"em"}]},{"text":" to: ","type":"text"},{"type":"inlineExtension","attrs":{"extensionType":"com.atlassian.confluence.macro.core","extensionKey":"anchor","parameters":{"macroParams":{"":{"value":"acquire123"},"legacyAnchorId":{"value":"AdvancedCommCareAndroidFormatting-acquire123"},"_parentId":{"value":"2143958327"}},"macroMetadata":{"macroId":{"value":"c43423a7-6f15-4151-b7b2-ed5dda364cd8"},"schemaVersion":{"value":"1"},"title":"Anchor"}},"localId":"d3674b5a-f037-41ca-8b60-b31bc579f462"}},{"text":"acquire","type":"text","marks":[{"type":"strong"}]}]},{"type":"rule"},{"type":"heading","attrs":{"level":3},"content":[{"text":"GPS Capture using Google Map","type":"text"}]},{"type":"paragraph","content":[{"text":"Not supported on App Preview","type":"text","marks":[{"type":"strong"}]}]},{"type":"paragraph","content":[{"text":"GPS question can be configured to:","type":"text"}]},{"type":"orderedList","attrs":{"order":1},"content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Allow user to select their location on Google maps by clicking on \"Record Location\" button.","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Allow user to see the recorded location on Google maps by clicking on \"Show Location\" button.","type":"text"}]}]}]},{"type":"mediaSingle","attrs":{"layout":"center","width":250,"widthType":"pixel"},"content":[{"type":"media","attrs":{"__fileSize":378664,"__fileMimeType":"image/png","width":636,"id":"7027f202-3d0e-4630-8b08-35ac53a05425","collection":"contentId-2143958327","type":"file","__fileName":"Screen Shot 2020-04-21 at 4.03.18 PM.png","height":1134}}]},{"type":"heading","attrs":{"level":4},"content":[{"text":"How to do it","type":"text"}]},{"type":"paragraph","content":[{"text":"In the Advanced section of the Question Properties section set the ","type":"text","marks":[{"type":"textColor","attrs":{"color":"#222222"}}]},{"text":" ","type":"text"},{"text":"Appearance Attribute","type":"text","marks":[{"type":"em"}]},{"text":" to:","type":"text"},{"type":"inlineExtension","attrs":{"extensionType":"com.atlassian.confluence.macro.core","extensionKey":"anchor","parameters":{"macroParams":{"":{"value":"maps"},"legacyAnchorId":{"value":"AdvancedCommCareAndroidFormatting-maps"},"_parentId":{"value":"2143958327"}},"macroMetadata":{"macroId":{"value":"69bcfcb7-558c-4656-bb24-1b7b29898110"},"schemaVersion":{"value":"1"},"title":"Anchor"}},"localId":"0d17dcba-3174-4af3-b0a3-edf131eead10"}},{"text":" ","type":"text"},{"text":"maps","type":"text","marks":[{"type":"strong"}]}]},{"type":"rule"},{"type":"heading","attrs":{"level":3},"content":[{"text":"Grid View","type":"text"}]},{"type":"paragraph","content":[{"text":"Not supported on App Preview","type":"text","marks":[{"type":"strong"}]}]},{"type":"paragraph","content":[{"text":"You can create a grid of possible answers using only images and have the user just click on the image. This works for multiple choice questions that are either single or multiple answer. You can see an example of this at the ","type":"text"},{"text":"ODK website","type":"text","marks":[{"type":"link","attrs":{"href":"http://opendatakit.org/help/form-design/examples/#select_prompts"}}]},{"text":".","type":"text"}]},{"type":"heading","attrs":{"level":4},"content":[{"text":"How to do it","type":"text"}]},{"type":"paragraph","content":[{"text":"In the Advanced section of the Question Properties, set the","type":"text","marks":[{"type":"textColor","attrs":{"color":"#222222"}}]},{"text":" field ","type":"text"},{"text":"Appearance Attribute","type":"text","marks":[{"type":"em"}]},{"text":" to: ","type":"text"},{"type":"inlineExtension","attrs":{"extensionType":"com.atlassian.confluence.macro.core","extensionKey":"anchor","parameters":{"macroParams":{"":{"value":"compact"},"legacyAnchorId":{"value":"AdvancedCommCareAndroidFormatting-compact"},"_parentId":{"value":"2143958327"}},"macroMetadata":{"macroId":{"value":"983f98c5-6030-4225-b401-36c0acd60bd0"},"schemaVersion":{"value":"1"},"title":"Anchor"}},"localId":"ccf3e6e3-8080-42fe-be4f-f2b7ea1cb493"}},{"text":" ","type":"text"},{"text":"compact","type":"text","marks":[{"type":"strong"}]}]},{"type":"paragraph","content":[{"text":"If, for example, you want the grid to be two items across you can add \"-2\" so it will look like: ","type":"text"},{"text":"compact-2","type":"text","marks":[{"type":"strong"}]}]},{"type":"rule"},{"type":"heading","attrs":{"level":3},"content":[{"text":"Notification Label","type":"text"}]},{"type":"paragraph","content":[{"text":"Not supported on App Preview","type":"text","marks":[{"type":"strong"}]}]},{"type":"paragraph","content":[{"text":"Notification labels are a special type of label text which is displayed at the bottom of the screen.","type":"text"}]},{"type":"paragraph","content":[{"text":"It can appear in 3 different colors. It will appear based on what display condition you set in the label. ","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center","width":250,"widthType":"pixel"},"content":[{"type":"media","attrs":{"__fileSize":35723,"__fileMimeType":"image/png","width":320,"id":"2de95fae-b2a6-484f-a932-2c12c67c303f","collection":"contentId-2143958327","type":"file","__fileName":"image2016-4-29 14:36:23.png","height":480}}]},{"type":"mediaSingle","attrs":{"layout":"center","width":250,"widthType":"pixel"},"content":[{"type":"media","attrs":{"__fileSize":34311,"__fileMimeType":"image/png","width":320,"id":"3b437063-bd71-4c5b-a370-f9b090a9864e","collection":"contentId-2143958327","type":"file","__fileName":"image2016-4-29 14:36:45.png","height":480}}]},{"type":"heading","attrs":{"level":4},"content":[{"text":"How to do it","type":"text"}]},{"type":"orderedList","attrs":{"order":1},"content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"You need to put all of the questions in a Question List Group.","type":"text","marks":[{"type":"textColor","attrs":{"color":"#222222"}}]},{"type":"hardBreak"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"On each label, access the Advanced section of the Question Properties. Then set the","type":"text","marks":[{"type":"textColor","attrs":{"color":"#222222"}}]},{"text":" field ","type":"text"},{"text":"Appearance Attribute","type":"text","marks":[{"type":"em"}]},{"text":" to: ","type":"text"}]},{"type":"orderedList","attrs":{"order":1},"content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"inlineExtension","attrs":{"extensionType":"com.atlassian.confluence.macro.core","extensionKey":"anchor","parameters":{"macroParams":{"":{"value":"floating"},"legacyAnchorId":{"value":"AdvancedCommCareAndroidFormatting-floating"},"_parentId":{"value":"2143958327"}},"macroMetadata":{"macroId":{"value":"e629fee9-99e8-4b27-99ad-83598542f6b8"},"schemaVersion":{"value":"1"},"title":"Anchor"}},"localId":"95835d0d-34d0-442c-9b7a-ae3b8a908e18"}},{"text":"floating-good ","type":"text","marks":[{"type":"strong"}]},{"text":"- for a ","type":"text"},{"text":"green","type":"text","marks":[{"type":"textColor","attrs":{"color":"#00ff00"}},{"type":"strong"}]},{"text":" ","type":"text","marks":[{"type":"strong"}]},{"text":"label message","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"floating-caution ","type":"text","marks":[{"type":"strong"}]},{"text":"- for a ","type":"text"},{"text":"yellow/orange","type":"text","marks":[{"type":"textColor","attrs":{"color":"#ffcc00"}},{"type":"strong"}]},{"text":" ","type":"text","marks":[{"type":"textColor","attrs":{"color":"#ffcc00"}}]},{"text":"label message","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"floating-bad ","type":"text","marks":[{"type":"strong"}]},{"text":"- for a ","type":"text"},{"text":"red","type":"text","marks":[{"type":"textColor","attrs":{"color":"#ff0000"}},{"type":"strong"}]},{"text":" ","type":"text","marks":[{"type":"textColor","attrs":{"color":"#ff0000"}}]},{"text":" label message","type":"text"}]}]}]}]}]},{"type":"rule"},{"type":"heading","attrs":{"level":3},"content":[{"text":"Radio Buttons Aligned with Label","type":"text"}]},{"type":"paragraph","content":[{"text":"Not supported on App Preview","type":"text","marks":[{"type":"strong"}]}]},{"type":"paragraph","content":[{"text":"This is a way of displaying the values of a select list of circular radio buttons horizontally instead of in a vertical list.","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center","width":250,"widthType":"pixel"},"content":[{"type":"media","attrs":{"__fileSize":27760,"__fileMimeType":"image/png","width":540,"id":"0db0d2c2-53e5-4aa5-9344-325ca311c301","collection":"contentId-2143958327","type":"file","__fileName":"Screenshot_2015-10-13-10-34-28.png","height":960}}]},{"type":"heading","attrs":{"level":4},"content":[{"text":"How to do it","type":"text"}]},{"type":"paragraph","content":[{"text":"Create a Single Select list question. In the Advanced section of the question properties set the ","type":"text"},{"text":"Appearance Attribute","type":"text","marks":[{"type":"em"}]},{"text":" to ","type":"text"},{"type":"inlineExtension","attrs":{"extensionType":"com.atlassian.confluence.macro.core","extensionKey":"anchor","parameters":{"macroParams":{"":{"value":"list"},"legacyAnchorId":{"value":"AdvancedCommCareAndroidFormatting-list"},"_parentId":{"value":"2143958327"}},"macroMetadata":{"macroId":{"value":"df465cfe-58db-4d89-aad6-5837dc1cb098"},"schemaVersion":{"value":"1"},"title":"Anchor"}},"localId":"236550de-6ed4-426d-95cc-5ccb4e56d25a"}},{"text":"list.","type":"text","marks":[{"type":"strong"}]}]},{"type":"rule"},{"type":"heading","attrs":{"level":3},"content":[{"text":"Combined Multiple Choice Using a Question List Group","type":"text"}]},{"type":"paragraph","content":[{"text":"This is a way of combining questions that have the same answers. It requires creating a \"throw-away\" question that is used to set the header (i.e. in the example below, \"Chose for each: Yes No\" is a single select question for which data is not captured).","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center","width":250,"widthType":"pixel"},"content":[{"type":"media","attrs":{"__fileSize":58623,"__fileMimeType":"image/png","width":720,"id":"4d0bcd31-aaff-4cd1-9e3d-c043e831d8d2","collection":"contentId-2143958327","type":"file","__fileName":"Screenshot_20160418-161214.png","height":1280}}]},{"type":"heading","attrs":{"level":4},"content":[{"text":"How to do it","type":"text"}]},{"type":"paragraph","content":[{"text":"You need to put all of the questions in a Question List Group.","type":"text"}]},{"type":"paragraph","content":[{"text":"The first question will define the headers (so you will not be able to actually record data for it). For that first question, i","type":"text"},{"text":"n the Advanced section of the Question Properties, set the","type":"text","marks":[{"type":"textColor","attrs":{"color":"#222222"}}]},{"text":" field ","type":"text"},{"text":"Appearance Attribute","type":"text","marks":[{"type":"em"}]},{"text":" to: ","type":"text"},{"type":"inlineExtension","attrs":{"extensionType":"com.atlassian.confluence.macro.core","extensionKey":"anchor","parameters":{"macroParams":{"":{"value":"label"},"legacyAnchorId":{"value":"AdvancedCommCareAndroidFormatting-label"},"_parentId":{"value":"2143958327"}},"macroMetadata":{"macroId":{"value":"b64b46ab-e9ad-4463-b701-7e2d9823ac1c"},"schemaVersion":{"value":"1"},"title":"Anchor"}},"localId":"9f2e8f4d-6d8d-45be-9218-e907af30e7ac"}},{"text":"label","type":"text","marks":[{"type":"strong"}]}]},{"type":"paragraph","content":[{"text":"The subsequent questions in the group should have appearance set to: ","type":"text"},{"type":"inlineExtension","attrs":{"extensionType":"com.atlassian.confluence.macro.core","extensionKey":"anchor","parameters":{"macroParams":{"":{"value":"list-nolabel"},"legacyAnchorId":{"value":"AdvancedCommCareAndroidFormatting-list-nolabel"},"_parentId":{"value":"2143958327"}},"macroMetadata":{"macroId":{"value":"6b11511d-9bd9-45e4-b38b-609babd969be"},"schemaVersion":{"value":"1"},"title":"Anchor"}},"localId":"26fa8ce3-8aae-4c49-904a-dd88b4d00ab0"}},{"text":"list-nolabel","type":"text","marks":[{"type":"strong"}]}]},{"type":"paragraph","content":[{"type":"hardBreak"},{"text":"Below is an example of what this looks like in the form builder:","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center","width":558,"widthType":"pixel"},"content":[{"type":"media","attrs":{"__fileSize":14609,"__fileMimeType":"image/png","width":497,"id":"30362eab-3d8a-40dc-8cba-386a6851dc2a","collection":"contentId-2143958327","type":"file","__fileName":"image2019-6-7_13-44-42.png","height":445}}]},{"type":"paragraph"},{"type":"expand","attrs":{"title":"View Example XML"},"content":[{"type":"paragraph","content":[{"text":"Below is an example of the xml.","type":"text"}]},{"type":"paragraph","content":[{"text":"For the first question:","type":"text"}]},{"type":"codeBlock","attrs":{"language":"html/xml"},"content":[{"text":" \n\t\t\t\t\n\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\tyes\n\t\t\t\t\n\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\tno\n\t\t\t\t\n\t\t\t","type":"text"}]},{"type":"paragraph","content":[{"text":"For the subsequent questions:","type":"text"}]},{"type":"codeBlock","attrs":{"language":"html/xml"},"content":[{"text":" \n\t\t\t\t\n\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\tyes\n\t\t\t\t\n\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\tno\n\t\t\t\t\n\t\t\t","type":"text"}]},{"type":"paragraph","content":[{"type":"hardBreak"}]}]},{"type":"rule"},{"type":"heading","attrs":{"level":3},"content":[{"text":"Selectable Label Text","type":"text"}]},{"type":"paragraph","content":[{"text":"Not supported on App Preview","type":"text","marks":[{"type":"strong"}]}]},{"type":"paragraph","content":[{"text":"By default, label text cannot be selected when filling out a form. This is to make the user interface simple and to avoid confusing mobile workers that unintentionally long-press during form entry. However, this also means that it is not possible to select and copy label text into another location.","type":"text"}]},{"type":"paragraph","content":[{"text":"It is possible to enable selectability of label text by changing the appearance attribute in the form builder.","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center","width":250,"widthType":"pixel"},"content":[{"type":"media","attrs":{"__fileSize":71654,"__fileMimeType":"image/png","width":720,"id":"f1c33f97-da70-415a-b535-a3d7129c2224","collection":"contentId-2143958327","type":"file","__fileName":"selectable.png","height":1280}}]},{"type":"heading","attrs":{"level":4},"content":[{"text":"How to do it","type":"text"}]},{"type":"paragraph","content":[{"text":"In the Advanced section of the Question Properties section set the ","type":"text","marks":[{"type":"textColor","attrs":{"color":"#222222"}}]},{"text":" ","type":"text"},{"text":"Appearance Attribute","type":"text","marks":[{"type":"em"}]},{"text":" to: ","type":"text"},{"type":"inlineExtension","attrs":{"extensionType":"com.atlassian.confluence.macro.core","extensionKey":"anchor","parameters":{"macroParams":{"":{"value":"selectable123"},"legacyAnchorId":{"value":"AdvancedCommCareAndroidFormatting-selectable123"},"_parentId":{"value":"2143958327"}},"macroMetadata":{"macroId":{"value":"49a4fbe8-9e44-4ca1-afa4-d5693f9f520a"},"schemaVersion":{"value":"1"},"title":"Anchor"}},"localId":"68c1f5b7-a708-4d2b-94bc-7294b3c99f11"}},{"text":"selectable","type":"text","marks":[{"type":"strong"}]}]},{"type":"rule"},{"type":"heading","attrs":{"level":3},"content":[{"text":"Short Text Entry Widget","type":"text"}]},{"type":"paragraph","content":[{"text":"Not supported on App Preview","type":"text","marks":[{"type":"strong"}]}]},{"type":"paragraph","content":[{"text":"The text input widget, by default, would give users an option to enter new line in the soft keyboard. But in some situations like question list, you might wanna restrict the new line behaviour and configure the enter key of soft keyboard to either jump user to the next input question or simply close the keyboard if there aren't any more input questions. ","type":"text"}]},{"type":"paragraph","marks":[{"type":"alignment","attrs":{"align":"center"}}],"content":[{"type":"inlineExtension","attrs":{"extensionType":"com.atlassian.confluence.migration","extensionKey":"inline-media-image","parameters":{"width":"300","id":"a359d875-66bb-4e09-a025-771c59b02a92","collection":"contentId-2143958327","height":""}}},{"text":". ","type":"text"},{"type":"inlineExtension","attrs":{"extensionType":"com.atlassian.confluence.migration","extensionKey":"inline-media-image","parameters":{"width":"300","id":"b0bec3b3-f04d-4156-84d6-d75c6808404a","collection":"contentId-2143958327","height":""}}}]},{"type":"heading","attrs":{"level":4},"content":[{"text":"How to do it","type":"text"}]},{"type":"paragraph","content":[{"text":"In the Advanced section of the Question Properties section set the ","type":"text","marks":[{"type":"textColor","attrs":{"color":"#222222"}}]},{"text":" ","type":"text"},{"text":"Appearance Attribute","type":"text","marks":[{"type":"em"}]},{"text":" to: ","type":"text"},{"type":"inlineExtension","attrs":{"extensionType":"com.atlassian.confluence.macro.core","extensionKey":"anchor","parameters":{"macroParams":{"":{"value":"short"},"legacyAnchorId":{"value":"AdvancedCommCareAndroidFormatting-short"},"_parentId":{"value":"2143958327"}},"macroMetadata":{"macroId":{"value":"e6b69946-5fb0-4955-9149-cbfc1a6f36f3"},"schemaVersion":{"value":"1"},"title":"Anchor"}},"localId":"9ed7500d-0049-43c6-ab85-313c06e9693e"}},{"text":"short","type":"text","marks":[{"type":"strong"}]}]},{"type":"rule"},{"type":"heading","attrs":{"level":3},"content":[{"text":"Single Line Numeric Entry","type":"text"}]},{"type":"paragraph","content":[{"text":"Not supported on App Preview","type":"text","marks":[{"type":"strong"}]}]},{"type":"paragraph","content":[{"text":"CommCare by default displays the questions input box in the next line below the label. However, you can configure the questions input to be displayed inline with the question label as shown in the image below -","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center","width":250,"widthType":"pixel"},"content":[{"type":"media","attrs":{"__fileSize":86022,"__fileMimeType":"image/png","width":320,"alt":"image-20240418-230459.png","id":"d897c14b-94d8-4eeb-b3cb-7b085e6b1be0","collection":"contentId-2143958327","type":"file","__fileName":"image-20240418-230459.png","height":658}}]},{"type":"heading","attrs":{"level":4},"content":[{"type":"hardBreak"},{"text":"How to do it","type":"text"}]},{"type":"paragraph","content":[{"text":"This behavior is achieved by putting all the questions inside the Question List Group, then grouping the Question List inside a Group and setting its ","type":"text"},{"text":"Appearance Attribute","type":"text","marks":[{"type":"em"}]},{"text":" to: ","type":"text"},{"type":"inlineExtension","attrs":{"extensionType":"com.atlassian.confluence.macro.core","extensionKey":"anchor","parameters":{"macroParams":{"":{"value":"compact"},"legacyAnchorId":{"value":"AdvancedCommCareAndroidFormatting-compact"},"_parentId":{"value":"2143958327"}},"macroMetadata":{"macroId":{"value":"3ebb4df9-4bd2-421c-8afa-d785dd2032c0"},"schemaVersion":{"value":"1"},"title":"Anchor"}},"localId":"8b030542-74df-4e25-9dfe-01e83d4cf129"}},{"text":"compact","type":"text","marks":[{"type":"strong"}]}]},{"type":"paragraph","content":[{"text":"Below is an example of what this looks like in the form builder:","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center","width":650,"widthType":"pixel"},"content":[{"type":"media","attrs":{"__fileSize":41318,"__fileMimeType":"image/png","width":685,"id":"48c0823b-7292-429c-881f-3d8cfa729f67","collection":"contentId-2143958327","type":"file","__fileName":"Screen Shot 2019-10-03 at 6.29.36 PM.png","height":425}}]},{"type":"paragraph","content":[{"text":"Note","type":"text","marks":[{"type":"strong"}]},{"text":": Make sure to add the appearance attribute ","type":"text"},{"text":"minimal","type":"text","marks":[{"type":"strong"}]},{"text":" for all the label questions","type":"text"}]},{"type":"heading","attrs":{"level":4},"content":[{"text":"Limitations","type":"text"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"It only works for questions with numeric input i.e. either an Integer or Decimal. ","type":"text"},{"text":"From CommCare 2.51 onwards, we'll also support text input questions. ","type":"text","marks":[{"type":"strong"},{"type":"em"}]}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"All other question components apart from question label and input doesn't show up in single line data entry. Ex- Multimedia, help text, hint text etc. ","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Question label truncates itself if it doesn't fit in the available space and there is no way to see the whole text of the question currently.","type":"text"}]}]}]},{"type":"rule"},{"type":"heading","attrs":{"level":3},"content":[{"text":"Single Select \"Dropdown\"","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center","width":250,"widthType":"pixel"},"content":[{"type":"media","attrs":{"__fileSize":52999,"__fileMimeType":"image/png","width":720,"id":"817079b9-8bbf-4ae3-aa58-a688d630e3d8","collection":"contentId-2143958327","type":"file","__fileName":"Screenshot_20160418-161145.png","height":1280}}]},{"type":"heading","attrs":{"level":4},"content":[{"text":"How to do it","type":"text"}]},{"type":"paragraph","content":[{"text":" ","type":"text"},{"text":"In the Advanced section of the Question Properties, set the","type":"text","marks":[{"type":"textColor","attrs":{"color":"#222222"}}]},{"text":" field ","type":"text"},{"text":"Appearance Attribute","type":"text","marks":[{"type":"em"}]},{"text":" to: ","type":"text"},{"type":"inlineExtension","attrs":{"extensionType":"com.atlassian.confluence.macro.core","extensionKey":"anchor","parameters":{"macroParams":{"":{"value":"minimal"},"legacyAnchorId":{"value":"AdvancedCommCareAndroidFormatting-minimal"},"_parentId":{"value":"2143958327"}},"macroMetadata":{"macroId":{"value":"324519b1-bb5d-48c8-9957-a3b4bb800be9"},"schemaVersion":{"value":"1"},"title":"Anchor"}},"localId":"c50329e7-74b2-4016-86aa-58bddddf3501"}},{"text":"minimal","type":"text","marks":[{"type":"strong"}]}]},{"type":"mediaSingle","attrs":{"layout":"center","width":760,"widthType":"pixel"},"content":[{"type":"media","attrs":{"__fileSize":18882,"__fileMimeType":"image/png","width":717,"id":"00fc0815-2b3b-42c2-ab67-c03c37483568","collection":"contentId-2143958327","type":"file","__fileName":"image2017-8-14 10:11:52.png","height":294}}]},{"type":"expand","attrs":{"title":"View Example XML"},"content":[{"type":"paragraph","content":[{"text":"Here is an example of the xml:","type":"text"}]},{"type":"codeBlock","attrs":{"language":"html/xml"},"content":[{"text":"\n\t\t\t\n\t\t\t\n\t\t\t\t\n\t\t\t\t1\n\t\t\t\n\t\t\t\n\t\t\t\t\n\t\t\t\t2\n\t\t\t\n\t\t\t\n\t\t\t\t\n\t\t\t\t3\n\t\t\t\n\t\t\t\n\t\t\t\t\n\t\t\t\t4\n\t\t\t\n\t\t","type":"text"}]}]},{"type":"heading","attrs":{"level":4},"content":[{"text":"Notes","type":"text"}]},{"type":"paragraph","content":[{"text":"If the label text of a choice is very long it may be cut off in the dropdown view. The basic rule is that the text can only be as long as the width of your device. The text will not wrap onto a second line.","type":"text"}]},{"type":"rule"},{"type":"heading","attrs":{"level":3},"content":[{"text":"Single Select \"Combo Box\"","type":"text"}]},{"type":"paragraph","content":[{"text":"This is similar to the single select dropdown, but it also allows you to filter the dropdown list by typing in a text box. When possible, it will also try to prevent users from entering text that is not part of a valid answer.","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center","width":250,"widthType":"pixel"},"content":[{"type":"media","attrs":{"__fileSize":89700,"__fileMimeType":"image/png","width":800,"id":"49cb0e33-eaa7-428d-8674-503122e403f8","collection":"contentId-2143958327","type":"file","__fileName":"Screenshot_2017-01-12-05-01-42.png","height":1280}}]},{"type":"mediaSingle","attrs":{"layout":"center","width":250,"widthType":"pixel"},"content":[{"type":"media","attrs":{"__fileSize":83882,"__fileMimeType":"image/png","width":800,"id":"12d1c5e3-357c-4670-b419-9e99062180b4","collection":"contentId-2143958327","type":"file","__fileName":"Screenshot_2017-01-12-05-01-52.png","height":1280}}]},{"type":"heading","attrs":{"level":4},"content":[{"text":"How to do it","type":"text"}]},{"type":"paragraph","content":[{"text":"There are 3 different variations of a combo box available, which use different rules for how they filter answer choices in the dropdown menu based upon the text that the user has entered:","type":"text","marks":[{"type":"textColor","attrs":{"color":"#222222"}}]}]},{"type":"orderedList","attrs":{"order":1},"content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Standard - This option is recommended for if your question has simple, mostly one-word answer choices. The filter matches on prefixes, i.e. entering the text \"ap\" would show \"Apple\" and \"Apply\", but not \"Cape\"","type":"text","marks":[{"type":"textColor","attrs":{"color":"#222222"}}]}]},{"type":"orderedList","attrs":{"order":1},"content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"In the Advanced section of the Question Properties, set the field ","type":"text"},{"text":"Appearance Attribute","type":"text","marks":[{"type":"em"}]},{"text":" to:","type":"text"},{"type":"inlineExtension","attrs":{"extensionType":"com.atlassian.confluence.macro.core","extensionKey":"anchor","parameters":{"macroParams":{"":{"value":"combobox"},"legacyAnchorId":{"value":"AdvancedCommCareAndroidFormatting-combobox"},"_parentId":{"value":"2143958327"}},"macroMetadata":{"macroId":{"value":"6e02ac7b-4cbe-4317-9c21-06a39ddcdd13"},"schemaVersion":{"value":"1"},"title":"Anchor"}},"localId":"3bd07fc8-4e0e-40a2-8db1-d5960aa4d806"}},{"text":"combobox","type":"text","marks":[{"type":"strong"}]}]}]}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Multiple Words - This option is recommended for if your question has more complicated, mostly multiple-word answer choices. The filter checks for matches on individual words that appear anywhere within the entered text. On Web Apps, the fuzzy matching approach typically yields better results than Multiple Words.","type":"text","marks":[{"type":"textColor","attrs":{"color":"#222222"}}]}]},{"type":"orderedList","attrs":{"order":1},"content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"In the Advanced section of the Question Properties, set the field ","type":"text"},{"text":"Appearance Attribute","type":"text","marks":[{"type":"em"}]},{"text":" to: ","type":"text"},{"type":"inlineExtension","attrs":{"extensionType":"com.atlassian.confluence.macro.core","extensionKey":"anchor","parameters":{"macroParams":{"":{"value":"combobox multiword"},"legacyAnchorId":{"value":"AdvancedCommCareAndroidFormatting-comboboxmultiword"},"_parentId":{"value":"2143958327"}},"macroMetadata":{"macroId":{"value":"0917b6fb-a275-4996-8b5b-60a19b451689"},"schemaVersion":{"value":"1"},"title":"Anchor"}},"localId":"676fbcf8-ec29-4813-8e32-521dfc9758d3"}},{"text":"combobox multiword","type":"text","marks":[{"type":"strong"}]}]}]}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Fuzzy Matching - This option is recommended for if your question has more complicated answer choices that you expect users might misspell or mistype. The filter is more permissive and will show answer choices that are deemed similar to the entered text.","type":"text"}]},{"type":"orderedList","attrs":{"order":1},"content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"In the Advanced section of the Question Properties, set the field ","type":"text"},{"text":"Appearance Attribute","type":"text","marks":[{"type":"em"}]},{"text":" to: ","type":"text"},{"type":"inlineExtension","attrs":{"extensionType":"com.atlassian.confluence.macro.core","extensionKey":"anchor","parameters":{"macroParams":{"":{"value":"combobox fuzzy"},"legacyAnchorId":{"value":"AdvancedCommCareAndroidFormatting-comboboxfuzzy"},"_parentId":{"value":"2143958327"}},"macroMetadata":{"macroId":{"value":"b86a9cd2-b046-4869-8be9-e066fefdd419"},"schemaVersion":{"value":"1"},"title":"Anchor"}},"localId":"e8b83490-e665-4b16-a278-5fca069f555b"}},{"text":"combobox fuzzy","type":"text","marks":[{"type":"strong"}]}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Technical note: \"fuzziness\" is largely based on ","type":"text"},{"text":"edit distance","type":"text","marks":[{"type":"link","attrs":{"href":"https://en.wikipedia.org/wiki/Edit_distance"}}]},{"text":", which calculates how similar the search string is to the options. CommCare also does some special case handling, in particular to handle searches that match the beginning of one or more of the options (as when the user has started typing out a long option).","type":"text"}]}]}]}]}]},{"type":"rule"},{"type":"heading","attrs":{"level":3},"content":[{"text":"Multiple Select Dropdown","type":"text"}]},{"type":"paragraph","content":[{"text":"This is similar the the single select dropdown above, but for a multiple select question. In the example below you can see two multiple select dropdown questions that are in a question list group. The user pushes \"select answer\" and then chooses from the pop-up menu. The selected answers are then recorded on the question screen. This may work well to enable users to \"confirm\" the answers they have selected.","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center","width":250,"widthType":"pixel"},"content":[{"type":"media","attrs":{"__fileSize":46472,"__fileMimeType":"image/png","width":720,"id":"aebcb85c-c168-4165-95af-fc9f323f080d","collection":"contentId-2143958327","type":"file","__fileName":"Screenshot_20160418-161155.png","height":1280}}]},{"type":"mediaSingle","attrs":{"layout":"center","width":250,"widthType":"pixel"},"content":[{"type":"media","attrs":{"__fileSize":59538,"__fileMimeType":"image/png","width":720,"id":"4dcd1e68-9417-422c-a9ab-775cff921b3e","collection":"contentId-2143958327","type":"file","__fileName":"Screenshot_20160418-161203.png","height":1280}}]},{"type":"mediaSingle","attrs":{"layout":"center","width":250,"widthType":"pixel"},"content":[{"type":"media","attrs":{"__fileSize":53187,"__fileMimeType":"image/png","width":720,"id":"b849d05e-dfd6-496d-8ccc-9d1422c3919d","collection":"contentId-2143958327","type":"file","__fileName":"Screenshot_20160418-161206.png","height":1280}}]},{"type":"heading","attrs":{"level":4},"content":[{"text":"How to do it","type":"text"}]},{"type":"paragraph","content":[{"text":" ","type":"text"},{"text":"In the Advanced section of the Question Properties, set the","type":"text","marks":[{"type":"textColor","attrs":{"color":"#222222"}}]},{"text":" field ","type":"text"},{"text":"Appearance Attribute","type":"text","marks":[{"type":"em"}]},{"text":" to: ","type":"text"},{"text":"minimal","type":"text","marks":[{"type":"strong"}]},{"text":".","type":"text"}]},{"type":"heading","attrs":{"level":3},"content":[{"text":"Date formatting option that enables adding a nullable date","type":"text"}]},{"type":"paragraph","content":[{"text":"You can use this functionality to have a nullable date in your form.","type":"text"}]},{"type":"paragraph","content":[{"text":"The date question appears as shown below. The User will have to click on ","type":"text"},{"type":"inlineExtension","attrs":{"extensionType":"com.atlassian.confluence.migration","extensionKey":"inline-media-image","parameters":{"width":"25","id":"5eea7b24-ec26-47b0-b247-a841339d68b5","collection":"contentId-2143958327","height":""}}},{"text":" for the date to be saved as null.","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center","width":515,"widthType":"pixel"},"content":[{"type":"media","attrs":{"__fileSize":83133,"__fileMimeType":"image/png","width":637,"alt":"image-20240418-231203.png","id":"e6d337cf-8735-4db9-b3b2-e7f7e30a7f2c","collection":"contentId-2143958327","type":"file","__fileName":"image-20240418-231203.png","height":627}}]},{"type":"paragraph","marks":[{"type":"alignment","attrs":{"align":"center"}}],"content":[{"text":" ","type":"text"}]},{"type":"heading","attrs":{"level":4},"content":[{"text":"How to do it","type":"text"}]},{"type":"paragraph","content":[{"text":" ","type":"text"},{"text":"In the Advanced section of the (Date) Question Properties, set the","type":"text","marks":[{"type":"textColor","attrs":{"color":"#222222"}}]},{"text":" field ","type":"text"},{"text":"Appearance Attribute","type":"text","marks":[{"type":"em"}]},{"text":" to: ","type":"text"},{"text":"gregorian_cancel. ","type":"text","marks":[{"type":"strong"}]},{"text":"(Separately, for just using this UI for the date question, set the field ","type":"text"},{"text":"Appearance Attribute","type":"text","marks":[{"type":"em"}]},{"text":" to: ","type":"text"},{"text":"gregorian","type":"text","marks":[{"type":"strong"}]},{"text":")","type":"text"}]},{"type":"paragraph","content":[{"text":"Limitations","type":"text","marks":[{"type":"strong"}]}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"The name of the day will continue to show on the UI even after clicking on: ","type":"text"}]}]}]},{"type":"mediaSingle","attrs":{"layout":"center","width":300,"widthType":"pixel"},"content":[{"type":"media","attrs":{"__fileSize":2917,"__fileMimeType":"image/png","width":129,"id":"5eea7b24-ec26-47b0-b247-a841339d68b5","collection":"contentId-2143958327","type":"file","__fileName":"cross.png","height":108}}]},{"type":"paragraph","content":[{"text":" - although it won't be saved.","type":"text"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"If the user does not wish to answer the question or misses the question, the default value of the question will be saved as today's date.","type":"text"}]}]}]},{"type":"rule"},{"type":"heading","attrs":{"level":2},"content":[{"text":"Hint and Help Text","type":"text"}]},{"type":"paragraph","content":[{"text":"Hint Message","type":"text"}]},{"type":"paragraph","content":[{"text":"Hint message is a special type of label text which is displayed below the label text. It appears slightly smaller and is meant to provide clarification to the question. Only the first 1-2 lines of a hint message is displayed by default, just click on the text once to see the full text. ","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center","width":250,"widthType":"pixel"},"content":[{"type":"media","attrs":{"__fileSize":65840,"__fileMimeType":"image/png","width":720,"id":"3bfd55fd-794f-407a-96e3-23d4d66814c5","collection":"contentId-2143958327","type":"file","__fileName":"Screenshot_20160418-153327.png","height":1280}}]},{"type":"paragraph","content":[{"type":"hardBreak"},{"text":"Help Message","type":"text","marks":[{"type":"strong"}]}]},{"type":"paragraph","content":[{"text":"Help text is similar to Hint Text, exactly that you can view the text by clicking on a small information icon which appears next to the question:","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center","width":329,"widthType":"pixel"},"content":[{"type":"media","attrs":{"type":"external","url":"https://confluence.dimagi.com/download/attachments/4719543/Screenshot_20160418-153643.png?version=1&modificationDate=1461008491652&api=v2"}}]},{"type":"mediaSingle","attrs":{"layout":"center","width":250,"widthType":"pixel"},"content":[{"type":"media","attrs":{"__fileSize":68386,"__fileMimeType":"image/png","width":720,"id":"7b00d5e4-f4f7-444b-83e8-f723d6f69d46","collection":"contentId-2143958327","type":"file","__fileName":"Screenshot_20160418-153646.png","height":1280}}]},{"type":"paragraph","content":[{"text":" ","type":"text"}]},{"type":"rule"},{"type":"heading","attrs":{"level":2},"content":[{"text":"Media Options","type":"text"}]},{"type":"paragraph","content":[{"text":"CommCare has some advanced options for how to display media that you include in your mobile app.","type":"text"}]},{"type":"heading","attrs":{"level":3},"content":[{"text":"In-line Video","type":"text"}]},{"type":"paragraph","content":[{"text":"Not supported on App Preview","type":"text","marks":[{"type":"strong"}]}]},{"type":"paragraph","content":[{"text":"Generally when adding a video to a question in CommCare, a small play button is added to the upper right corner. Clicking on this play button opens the video in the device's media player:","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center","width":250,"widthType":"pixel"},"content":[{"type":"media","attrs":{"__fileSize":42015,"__fileMimeType":"image/png","width":720,"id":"b1b36ab5-e66a-442d-a75a-65c21771eee0","collection":"contentId-2143958327","type":"file","__fileName":"Screenshot_20160413-133027.png","height":1280}}]},{"type":"paragraph","content":[{"text":"However it is also possible to play a video in-line within CommCare. This means the user never leaves CommCare and switches to the media player. However it also means that the video may be smaller:","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center","width":250,"widthType":"pixel"},"content":[{"type":"media","attrs":{"__fileSize":43689,"__fileMimeType":"image/png","width":720,"id":"0d1de72b-c223-43e7-b298-ed2b4734ea6b","collection":"contentId-2143958327","type":"file","__fileName":"Screenshot_20160413-133032.png","height":1280}}]},{"type":"heading","attrs":{"level":4},"content":[{"text":"How to do it","type":"text"}]},{"type":"orderedList","attrs":{"order":1},"content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Find the question/label with the place where you want the video to be.","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Under Media click video-inline.","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Upload the video using the pop up.","type":"text"}]}]}]},{"type":"rule"},{"type":"heading","attrs":{"level":2},"content":[{"text":"Text Formatting","type":"text"}]},{"type":"paragraph","content":[{"text":"You can make text on CommCare Android and Web Apps display in bold, italics, strikethrough, and various sizes. For more information see ","type":"text"},{"type":"inlineCard","attrs":{"__confluenceMetadata":{"isRenamedTitle":true,"linkType":"page","contentTitle":"Text Formatting (Markdown)","versionAtSave":"35"},"url":"https://dimagi.atlassian.net/wiki/spaces/commcarepublic/pages/2143958337"}},{"text":".","type":"text"}]},{"type":"rule"},{"type":"heading","attrs":{"level":2},"content":[{"text":"Text To Speech","type":"text"}]},{"type":"paragraph","content":[{"text":"Not supported on App Preview","type":"text","marks":[{"type":"strong"}]}]},{"type":"paragraph","content":[{"text":"CommCare 2.51 introduces Text-To-Speech functionality. When used, CommCare will add a button next to each question (except for audio questions), tapping on which it'll convert that text to speech. This button is not shown by default, but can be shown in two ways. ","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center","width":250,"widthType":"pixel"},"content":[{"type":"media","attrs":{"__fileSize":37154,"__fileMimeType":"image/jpeg","width":576,"id":"35e22973-7f10-446f-9116-65460d9be92b","collection":"contentId-2143958327","type":"file","__fileName":"tts.jpg","height":1280}}]},{"type":"orderedList","attrs":{"order":1},"content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Users can enable the ","type":"text"},{"text":"Text To Speech","type":"text","marks":[{"type":"strong"}]},{"text":" settings from the CommCare Settings menu. In this case the text-to-speech engine will convert the question text to speech. ","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"App Builders can add a ","type":"text"},{"text":"tts ","type":"text","marks":[{"type":"strong"}]},{"text":"field to the questions in the ","type":"text"},{"text":"Add Other Content","type":"text","marks":[{"type":"strong"}]},{"text":" section in HQ. In this case the text-to-speech engine will convert the ","type":"text"},{"text":"tts","type":"text","marks":[{"type":"strong"}]},{"text":" field value to speech. ","type":"text"}]}]}]},{"type":"paragraph"}],"version":1}