Mobiscroll Forms helps you to deliver pixel-perfect responsive forms in your web and hybrid apps.
What you get with Forms
Page styling & typography
Takes care of setting the background colors, spacing and typographic styling. It makes sure that the content you add shows up nicely on any screen-size.
Learn about the typography you can use.
Themes & theme styling
As all Mobiscroll controls, Forms support the following distinctive themes:
iOS
Android Material and Android Holo
Windows Phone
Mobiscroll
Theme colors can be refined with the theme builder - learn how you can do it.
Text fields
Text fields are the backbone of every form. Use it to capture a wide range of properties from plain text to passwords.
Text inputs: With single-line input fields you can capture all kinds of values, ranging from plain text, passwords, numeric values, email addresses… (all HTML5 input types are supported).
Text areas: Let users enter multi-line text like comments and any longer content.
Use labels, icons, placeholders or a combination of them to help users get meaning at a glance. Show/hide functionality built in for password fields.
Select styling
Similar to the single line input styling, it features a chevron/dropdown arrow to clearly signal the difference between select and text input.
Segmented controls
Easily lay out two to five options for single and multiple select. Making all options instantly visible lets users make selections with a single interaction instead of at least 3 (tap to open select, do the select, hit set - like for the traditional dropdown).
Learn how to use the segmented control for single and multiple select.
Checkbox
Similar to the native checkbox in functionality but a look and feel that fits with the overall user experience and theme. Features description text, checkbox list and disabled styling.
Switch
Just like the checkbox, the switch lets users turn items on/off. Can be rendered as a list of fields, like the checkbox list. Features description and disabled styling.
Radio Buttons
Single select for a list of options. Use it instead of the segmented control if there are more items that would fit in a single line - usually five and above.
View this live demo that shows a radio button list featuring items with different states.
Buttons
Buttons with different states and styles - inline or raised, left-right-center aligned or justified, with and without icons.
Steppers
When users need to make small adjustments to values by increasing or decreasing it avoid free-form input and dropdowns. Steppers help in minimizing mistakes, and reduce the number of taps for getting the values right.
See the stepper in action in a live demo.
Validation styling for errors and error messages
Styling for validation errors and messages is available. Validation logic needs to be plugged in or implemented externally of Mobiscroll.
What's next?
View/download interactive demos and browse the developer documentation.