InputKit: RadioButton
A radio button control that is useful, customizable, full-featured, fully-bindable and easy to use.
Dark - Desktop | Light - Mobile |
---|---|
![]() |
![]() |
You can visit entire code of this sample from here
Supported Platforms
- | MAUI | Xamarin Forms |
---|---|---|
Windows | ✅ | v4.0+ |
macOS | ✅ | ✅ |
Linux | ❌ | ❌ |
Android | ✅ | ✅ |
iOS | ✅ | ✅ |
Usage
Make sure you defined InputKit namespace in your XAML file.
MAUI | xmlns:input="clr-namespace:InputKit.Shared.Controls;assembly=InputKit.Maui" |
Xamarin Forms | xmlns:input="clr-namespace:Plugin.InputKit.Shared.Controls;assembly=Plugin.InputKit" |
Now you're ready to use it in your XAML page. RadioButtons should be grouped together in a RadioButtonGroupView. Otherwise, they will not work properly and each one will be independent.
Data Binding
All of the RadioButton properties are bindable.
IsChecked
property can be used separately from the RadioButtonGroupView.
RadioButtonGroupView provides
SelectedIndex
andSelectedItem
properties. You can use one of them to handle or change selected item.SelectedIndex
: Gets or sets selected item by index.SelectedItem
: Gets or sets selected item by value. You should addValue
to each RadioButton.
RadioButtonGroupView provides
SelectedItemChangedCommand
andSelectedItemChangedCommandParameter
properties. You can use one of them to handle or change selected item.SelectedItemChangedCommand
: Gets or sets command to execute when selected item is changed.SelectedItemChangedCommandParameter
: Gets or sets parameter to pass to command when selected item is changed. (By default it's selected item value.)
If you're looking for dynamic RadioButton list and want to get only selected item/items after selection. Check the SelectionView
Customization
Icons
RadioButton icon can be customized in two different ways. You can use predefined shapes or you can use custom shape. InputKit provides a collection of predefined shapes that can be used as an icon.
Check all Predefined Shapes for more info.
- Predefined shapes can be used as parameter for
SelectedIconGeomerty
property.
- Custom shape can be used as parameter of
SelectedIconGeomerty
property. A plain SVG path can be used as an icon.
Colors
You can customize RadioButton colors by setting Color
, CircleColor
and TextColor
.
Label Position
RadioButton supports two label positions:
- Before - label is positioned before the control.
- After - label is positioned after the control. (default)
Behaviors
** Work in progess... **:
- Actions to override
- VisualStates
- Make your own animation (?)