Introduction
kintone UI Component (v0) can be used to easily create Kintone-styled elements for plug-in settings pages. Refer to the kintone UI Component (v0) guide for an overview of the tool and instructions for use. This guide will introduce various ways to use kintone UI Component (v0) to create elements that would be useful for a plug-in settings page.
Note that this guide does not include a comprehensive list of all elements available. Refer to the kintone UI Component (v0) documentation for a complete list of all elements and their settings.
Please note that with the release of the v1 library, the v0 library is now in maintenance mode. No new functions are planned to be developed.
Alert Message
There are two types of alert messages that can be used. In this example, the HTML element has an ID of alert.
Success Alert
Error Alert
Label
Labels are generally used to insert titles for fields. In this example, the HTML element has an ID of label.
Normal Label
Required Label
Text Input
Text inputs can be made as single-line or multi-line input fields. In this example, the HTML element has an ID of input.
Single-line Input
Multi-line Input
Check Box and Multiple Choice
Check box fields and multiple choice fields allow the user to select none, one, or multiple selections. In this example, the HTML element has an ID of multichoice.
Check Box
Multiple Choice
Dropdown and Radio Button
Dropdown fields and radio button fields require the user to select a single value. In this example, the HTML element has an ID of singlechoice.
Dropdown
Radio Button
Button
There are two types of button styles that can be used. In this example, the HTML element has an ID of button.
Normal Button
Submit Button
Note
Layouts and styles may change in the case of future updates that include a change in design.