Background image for a form

Question

Hi, I am trying to add a customized background image for a form with text boxes, dropdowns, check boxes, and radio buttons. a!billboardLayout is there but it does not support text boxes, dropdowns, or checkboxes. Is there any other way to achieve this?

Konduru Chaitanya · Answer

Hello ShaliniD , 
 Appian does not have such features as of now. But instead you can try different approaches using color styles and etc. But using Image as a background cannot be done. Billboard Layout does not support input fields so you cannot use it for text fields, radio buttons or any kind of input values. It is only for display purpose. 
 Instead you can use cardLayout, headerContentLayout where you can use input fields. 
 below is an example 
 
 a!headerContentLayout(
 header: a!cardLayout(
 contents: a!richTextDisplayField(
 value: a!richTextHeader(
 text: "Your Header Here"
 )
 ),
 style: "#4B0082",
 showBorder: false
 ),
 contents: {
 a!columnsLayout(
 columns: {
 a!columnLayout(
 contents: {
 a!textField(
 label: "Text",
 labelPosition: "ABOVE",
 saveInto: {},
 refreshAfter: "UNFOCUS",
 validations: {}
 )
 }
 ),
 a!columnLayout(
 contents: {
 a!dropdownField(
 label: "Dropdown",
 labelPosition: "ABOVE",
 placeholder: "--- Select a Value ---",
 choiceLabels: {"Option 1", "Option 2", "Option 3", "Option 4",
 "Option 5", "Option 6", "Option 7", "Option 8",
 "Option 9", "Option 10", "Option 11", "Option 12"},
 choiceValues: {1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12},
 saveInto: {},
 searchDisplay: "AUTO",
 validations: {}
 )
 }
 ),
 a!columnLayout(
 contents: {
 a!radioButtonField(
 label: "Radio Buttons",
 labelPosition: "ABOVE",
 choiceLabels: {"Option 1", "Option 2"},
 choiceValues: {1, 2},
 saveInto: {},
 choiceLayout: "STACKED",
 validations: {}
 )
 }
 )
 }
 ),
 a!columnsLayout(
 columns: {
 a!columnLayout(
 contents: {
 a!pieChartField(
 label: "Pie Chart",
 labelPosition: "ABOVE",
 series: {
 a!chartSeries(label: "Chart Series 1", data: 1),
 a!chartSeries(label: "Chart Series 2", data: 2),
 a!chartSeries(label: "Chart Series 3", data: 3)
 },
 colorScheme: "RAINFOREST",
 style: "DONUT",
 seriesLabelStyle: "ON_CHART",
 height: "MEDIUM"
 )
 }
 ),
 a!columnLayout(
 contents: {
 a!areaChartField(
 label: "Area Chart",
 labelPosition: "ABOVE",
 categories: {"Category 1", "Category 2", "Category 3"},
 series: {
 a!chartSeries(label: "Chart Series", data: {1, 2, 3})
 },
 stacking: "NORMAL",
 showLegend: true,
 showTooltips: true,
 colorScheme: "RAINFOREST",
 height: "MEDIUM",
 xAxisStyle: "STANDARD",
 yAxisStyle: "STANDARD"
 )
 }
 )
 }
 ),
 a!sectionLayout(
 
 ),
 a!eventHistoryListField(
 label: "Event History",
 labelPosition: "COLLAPSED",
 eventData: {
 a!eventData()
 },
 eventStyle: "PREVIEW_LIST"
 )
 },
 backgroundColor: "#000000"
) 
 
 View these recipes by Appian 
 docs.appian.com/.../inspiration.html

Background image for a form

Top Replies