Layout of app inputs

In some built-in apps such as Rule Machine, I've noticed that the preference pages can have multiple inputs laid out side-by-side, such as this:

35%20AM

However, in my preferences screens, my inputs always get laid out vertically. How is a horizontal layout accomplished?

Mine only go vertical if the browser window is too narrow.

You will want to set width on your input. There are 12 "width units" available, so in the following example, each of these inputs will take up half of the availalbe width:

input(name: "myInputName", type: "number", title: "My Input", description: "", width: 6, required: true)
input(name: "myInputName2", type: "number2", title: "My Input 2", description: "", width: 6, required: true)
1 Like

Excellent! The width field is exactly what I was hoping to find. Thank you.

THANK YOU!!! Had no idea this was how to do it. Just made some of my "home-built" apps so much easier to work with!!!

1 Like