Skip to content

horusstudio.maui.materialdesigncontrols.materialradiobutton.md

Latest commit

 

History

History
284 lines (165 loc) · 8.53 KB

horusstudio.maui.materialdesigncontrols.materialradiobutton.md

File metadata and controls

284 lines (165 loc) · 8.53 KB

MaterialRadioButton

Radio buttons let people select one option from a set of options and follow Material Design Guidelines. See more. We reuse some code from MAUI official repository: https://github.com/dotnet/maui/blob/7076514d83f7e16ac49838307aefd598b45adcec/src/Controls/src/Core/RadioButton/RadioButton.cs

Namespace: HorusStudio.Maui.MaterialDesignControls

Inherits from: MaterialRadioButton → ContentView


Remarks: The MaterialViewGroup class allows grouping radio buttons, providing control over the selection type (Single or Multiple), item selection through bindings, and commands that trigger when the selection changes.

XAML sample

xmlns:material="clr-namespace:HorusStudio.Maui.MaterialDesignControls;assembly=HorusStudio.Maui.MaterialDesignControls"

<material:MaterialRadioButton
        TextSide="Left"
        CheckedChangedCommand="{Binding CheckedChangedCommand}"
        Text="Radio button 1"/>

C# sample

var radioButton = new MaterialRadioButton()
{
    Text = "Radio button 1",
    TextSide = TextSide.Left,
    CheckedChangedCommand = viewModel.CheckChangedCommand
};

See more example

Properties

AutomationId

Gets or sets a value that allows the automation framework to find and interact with this element.

Property type: String

Remarks: This value may only be set once on an element.

When set on this control, the AutomationId is also used as a base identifier for its internal elements:

  • The RadioButton control uses the same AutomationId value.
  • The chip's text label uses the identifier "{AutomationId}_Text".

This convention allows automated tests and accessibility tools to consistently locate all subelements of the control.


CharacterSpacing

Gets or sets the spacing between characters of the label. This is a bindable property.

Property type: Double


CheckedChangedCommand

Gets or sets the command to invoke when the radio button changes its status. This is a bindable property.

Property type: ICommand

Remarks: This property is used to associate a command with an instance of a radio button. This property is most often set in the MVVM pattern to bind callbacks back into the ViewModel. VisualElement.IsEnabled is controlled by the Command.CanExecute(object) if set. The command parameter is of type bool and corresponds to the value of the IsChecked property.


Content

Gets the Content of the radio button. This is a bindable property.

Property type: String


ControlTemplate

Gets or sets the template for the radio button. This is a bindable property.

Property type: ControlTemplate


FontAttributes

Gets or sets the text style of the label. This is a bindable property.

Property type: FontAttributes


FontAutoScalingEnabled

Defines whether an app's UI reflects text scaling preferences set in the operating system.

Property type: Boolean

Default value: true


FontFamily

Gets or sets the font family for the label. This is a bindable property.

Property type: String


FontSize

Defines the font size of the label. This is a bindable property.

Property type: Double


InternalRadioButton

Internal implementation of the RadioButton control.

Property type: RadioButton

Remarks: This property can affect the internal behavior of this control. Use only if you fully understand the potential impact.


IsChecked

Gets or sets if the radio button is checked. This is a bindable property.

Property type: Boolean

Default value: false


IsEnabled

Gets or sets the radio button is enabled. This is a bindable property.

Property type: Boolean

Default value: false


StrokeColor

Gets or sets the stroke color for the radio button. This is a bindable property.

Property type: Color

Default value: Theme: Light: MaterialLightTheme.Primary - Dark: MaterialDarkTheme.Primary


Text

Gets or sets a text for the radio button. This is a bindable property.

Property type: String


TextColor

Gets or sets the text color for the radio button. This is a bindable property.

Property type: Color

Default value: Theme: Light: MaterialLightTheme.Text - Dark: MaterialDarkTheme.Text


TextSide

Defines the location of the label. This is a bindable property.

Property type: TextSide

Name Value Description
Right 0 Right
Left 1 Left

Default value: TextSide.Left


TextTransform

Defines the casing of the label. This is a bindable property.

Property type: TextTransform


TouchAnimation

Gets or sets a custom animation to be executed when radio button is clicked. This is a bindable property.

Property type: ITouchAnimation

Default value: null


TouchAnimationType

Gets or sets an animation to be executed when radio button is clicked. This is a bindable property.

Property type: TouchAnimationTypes

Name Value Description
None 0 None: no animation runs.
Fade 1 Fade: Represents an animation that simulates a "fade" effect by changing the opacity over the target element.
Scale 2 Scale: Represents an animation that simulates a "sink" or "sunken" effect by scaling the target element.
Bounce 3 Bounce: Represents an animation that simulates a "sink" or "sunken" effect with a "bounce" effect when the user releases the target element.

Default value: ouchAnimationTypes.Fade


Value

Defines the value of the radio button This is a bindable property.

Property type: Object

Default value: MaterialRadioButton.Text

Remarks: If a value is not explicitly set, the control will use the value of the Text property if set or the Id property as its default.


Events

CheckedChanged

Occurs when the radio button is switched


Touch

Occurs when the radio button is touched.


Known issues and pending features

  • [iOS] FontAttributes doesn't work.
  • Using a control template doesn't work when define a custom style for disabled state.
  • The Selected property in Appium is not supported when using the AutomationId of this control, just like with the native MAUI control.