MAFCheckBox
The MAFCheckBox control extends the capabilities of the android.widget.CheckBox native button. MAF adds styling capabilities to the CheckBox UI component.
To create and present a default SAP style instance of the MAFCheckBox, use:
// Create a new native CheckBox instance
CheckBox cb0 = new CheckBox(this);
cb0.setChecked(true);
cb0.setText("Enable it.");
// Customize the native CheckBox with the actual skin setting
cb0 = MAFUIFactory.getInstance().customizeCheckBox(cb0);
cb0.setContentDescription("Enable it checkbox");
// Create a new MAF skinnable CheckBox instance using style informations
MAFCheckBox cb3 = MAFUIFactory.getInstance().getCheckBox(this);
cb3.setChecked(true);
cb3.setEnabled(false);
cb3.setText( "On" );
To create an MAFCheckBox in the Android layout XML, use:
<com.sap.maf.uicontrols.view.MAFCheckBox android:layout_width="wrap_content" android:layout_height="wrap_content" android:checked="true" android:text="CheckBox" />
The MAF skinning engine customizes the buttons. To apply SAP style, set the custom style in the XML file for background, foreground, shadow, font family, and font size.
This is the XAML content for the default style of the CheckBox TargetType:
<Style TargetType="CheckBox" Key="DefCheckBox" platform="android">
<VisualStates>
<VisualState Name="Checked_Unfocused_Enabled">
<Setter Property="DetailsForeground" Value="#FF0090D5" />
<!-- checked state center color -->
<Setter Property="SolidColorBrush" Value="#FF999999" />
<!-- checked state center border color -->
<Setter Property="Bg_Top_Shadow" Value="#FF0062A9" />
<!-- checkmark lo color -->
</VisualState>
<Setter Property="Foreground" Value="#FF333333" />
<Setter Property="FontFamily" Value="sans_serif" />
< Setter Property="FontSize" Value="14" />
MAFCheckBox supports different skins for different visual states of the CheckBox. To
set visual states, use the <VisualStates></VisualStates> tag.
<Style TargetType="CheckBox" Key="DefCheckBox" platform="android">
<VisualStates>
<VisualState Name="Checked_Unfocused_Enabled">
<Setter Property="DetailsForeground" Value="#FF0090D5" />
<!-- checked state center color -->
<Setter Property="SolidColorBrush" Value="#FF999999" />
<!-- checked state center border color -->
<Setter Property="Bg_Top_Shadow" Value="#FF0062A9" />
<!-- checkmark lo color -->
</VisualState>
<VisualState Name="Checked_Unfocused_Disabled">
…
</VisualState>
<VisualState Name="Checked_Focused_Disabled">
…
</VisualState>
<VisualState Name="Unchecked_Focused_Disabled">
…
</VisualState>
<VisualState Name="Checked_Focused_Enabled">
…
</VisualState>
<VisualState Name="Unchecked_Focused_Enabled">
…
</VisualState>
<VisualState Name="Checked_Pressed">
…
</VisualState>
<VisualState Name="Unchecked_Pressed">
…
</VisualState>
<VisualState Name="Disabled">
…
</ VisualState >
You can also inherit the style definition from the standard CheckBox and create a
flavored one. This is the style definition of a red styled CheckBox flavor:
<Style TargetType="CheckBox" Key="BlueCheckBox" BasedOn="DefCheckBox"
platform="android">
<Setter Property="Foreground" Value="#0000ff" />
<Setter Property="Background" Value="#000099" />
<Setter Property="BorderBrush" Value="#0000ff" />
<Setter Property="FontSize" Value="18" />
</ Style >
To create a CheckBox from code, use:
MAFCheckBox cb3 = MAFUIFactory.getInstance().getCheckBox( this, "BlueCheckBox" );
You can change the following properties in the skinning XML:
| Background | Base line color |
| DetailsForeground | Checked state center color |
| SolidColorBrush | Checked state center border color |
| Bg_Top_Shadow | Checkmark low color |
| BorderBrush | Selection border color |
| Foreground | Font color of the check box's label |
| FontFamily | Font family of the check box's label |
| FontSize | Font size for the text of the check box's label |