Pin Keyboard
You can edit 8 Components for free. Get premium for unlimited access.
Pin Keyboard is a circular PIN keypad key that supports a text mode and icon mode.
Figma
The Pin Keyboard component is used to display a complete keyboard to enter a code or number.
1. Reference
This component inherits props from the Pin Keyboard.
2. Type
You can edit the type with the text or icon parameter.
Image 2.1 : Type text
Image 2.2 : Type icon
3. State
You can edit the state with the default or pressed parameter.
Image 3.1 : State default
Image 3.2 : State pressed
4. Description
You can edit the description with the true or false parameter.
Image 4.1 : Description false
Image 4.2 : Description true
Jetpack Compose
This component is on the roadmap and in Progress This means that it is currently being edited and will be published in the next few weeks/months. Check back often to stay informed about the latest updates.
🚧
Preview
Preview
Code
1
DlPinKeyboard(
number: '1'
)Usage
Add this code example to your project to see how the component works.
DlPinKeyboard(
number: '1',
alphabet: 'ABC'
)API Reference
DlPinKeyboard is a circular PIN keypad key that supports a text mode (number with optional alphabet), an icon mode and a pressed state with visual feedback.
Examples
With Icon
Preview
Code
DlPinKeyboard(
type: DlPinKeyboardType.icon,
icon: DlPlaceholderIcon(),
)With Alphabet
Preview
Code
1
ABC
DlPinKeyboard(
number: '1',
alphabet: 'ABC'
)Discover more content
You have questions or need help?
You want to try?
Save time and money?