diff --git a/Xamarin/Button/Customization.md b/Xamarin/Button/Customization.md index b887e9fc6..ab08a45f5 100644 --- a/Xamarin/Button/Customization.md +++ b/Xamarin/Button/Customization.md @@ -1,23 +1,23 @@ --- layout: post -title: Customization in Xamarin Button control | Syncfusion -description: Learn here all about Customization support in Syncfusion Xamarin Button (SfButton) control and more. -platform: xamarin -control: sfbutton +title: Customization in Xamarin Button Control | Syncfusion +description: Discover the customization capabilities of the Syncfusion Xamarin Button (SfButton) control, including text, background, and image properties. +platform: Xamarin +control: SfButton documentation: ug --- # Customization in Xamarin Button (SfButton) -The [Xamarin Button](https://www.syncfusion.com/xamarin-ui-controls/xamarin-button) control supports to customize the border color, image width, corner radius, background color, and more. The button control can be customized using the following properties: +The [Xamarin Button](https://www.syncfusion.com/xamarin-ui-controls/xamarin-button) control supports customization options such as border color, image width, corner radius, and background color. The button control can be customized using the following properties: ## Text Customization -The text inside the button can be customized by its text color, font size, font attributes, font family and text alignment. +You can customize the text inside the button by modifying text color, font size, font attributes, font family, and text alignment. ### TextColor -The [`TextColor`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_TextColor) property is used to customize the color of text in [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html). +The [`TextColor`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_TextColor) property customizes the text color in [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html). {% tabs %} {% highlight xaml %} @@ -39,7 +39,7 @@ button.TextColor = Color.White; ### FontSize -The [`FontSize`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_FontSize) property is used to customize the size of text in [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html). +The [`FontSize`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_FontSize) property customizes the text size in [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html). {% tabs %} {% highlight xaml %} @@ -61,7 +61,7 @@ button.FontSize = 18; ### FontAttributes -The [`FontAttributes`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_FontAttributes) property is used to customize the font style of text in [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html). +The [`FontAttributes`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_FontAttributes) property customizes the font style of text in [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html). {% tabs %} {% highlight xaml %} @@ -79,11 +79,11 @@ button.FontAttributes = FontAttributes.Italic; {% endhighlight %} {% endtabs %} -![SfButton with fontattributes](images/Button_fontattributes.png) +![SfButton with font attributes](images/Button_fontattributes.png) ### FontFamily -The [`FontFamily`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_FontFamily) property is used to customize the font family of text in [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html). +The [`FontFamily`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_FontFamily) property customizes the font family of text in [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html). {% tabs %} {% highlight xaml %} @@ -101,11 +101,11 @@ button.FontFamily = "Arial"; {% endhighlight %} {% endtabs %} -![SfButton with fontfamily](images/Button_fontfamily.png) +![SfButton with font family](images/Button_fontfamily.png) ### TextAlignment -The [`HorizontalTextAlignment `](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_HorizontalTextAlignment) and [`VerticalTextAlignment `](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_VerticalTextAlignment) properties are used to customize the alignment of text in [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html). +The [`HorizontalTextAlignment`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_HorizontalTextAlignment) and [`VerticalTextAlignment`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_VerticalTextAlignment) properties customize text alignment in [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html). {% tabs %} {% highlight xaml %} @@ -126,11 +126,11 @@ button.VerticalTextAlignment = TextAlignment.Center; ## Background Customization -The background of the button can be customized by its background color, border color, border width and corner radius. +Customize the button's background by modifying background color, border color, border width, and corner radius. ### BackgroundColor -The [`BackgroundColor`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_BackgroundColor) property is used to customize the background color of [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html). +The [`BackgroundColor`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_BackgroundColor) property customizes the background color of [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html). {% tabs %} {% highlight xaml %} @@ -152,7 +152,7 @@ button.BackgroundColor = Color.DeepSkyBlue; ### BorderColor -The [`BorderColor`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_BorderColor) property is used to customize the color of border in [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html). +The [`BorderColor`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_BorderColor) property customizes the border color in [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html). {% tabs %} {% highlight xaml %} @@ -175,7 +175,7 @@ button.BorderColor = Color.Red; ### BorderWidth -The [`BorderWidth`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_BorderWidth) property is used to customize the thickness of border in [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html). +The [`BorderWidth`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_BorderWidth) property customizes the border thickness in [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html). {% tabs %} {% highlight xaml %} @@ -196,7 +196,7 @@ button.BorderColor = Color.Red; ### BorderThickness -The [`BorderThickness`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Border.SfBorder.html#Syncfusion_XForms_Border_SfBorder_BorderThickness) property is used to customize the border thickness of the [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html) on four sides. +The [`BorderThickness`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Border.SfBorder.html#Syncfusion_XForms_Border_SfBorder_BorderThickness) property customizes the border thickness on all four sides of the [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html). {% tabs %} {% highlight xaml %} @@ -217,11 +217,11 @@ button.BorderThickness = new Thickness (0,0,0,5); {% endhighlight %} {% endtabs %} -![SfButton with borderthickness](images/Button_borderthickness.png) +![SfButton with border thickness](images/Button_borderthickness.png) ### CornerRadius -The [`CornerRadius`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Border.SfBorder.html#Syncfusion_XForms_Border_SfBorder_CornerRadius) property is used to customize the rounded edges in [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html) as demonstrated in the following code sample. +The [`CornerRadius`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Border.SfBorder.html#Syncfusion_XForms_Border_SfBorder_CornerRadius) property customizes the rounded edges in [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html), as demonstrated in the following code sample. {% tabs %} {% highlight xaml %} @@ -239,15 +239,15 @@ button.CornerRadius = 3; {% endhighlight %} {% endtabs %} -![SfButton with cornerradius](images/Button_cornerradius.png) +![SfButton with corner radius](images/Button_cornerradius.png) ## Image Customization -The image can be customized by its show icon, image source, image width and image alignment. +The image can be customized by configuring the show icon option, image source, image width, and image alignment. ### ShowIcon -You can enable the Icon image using the [`ShowIcon`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_ShowIcon) property to know whether any image appears to the [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html). +You can enable the icon image using the [`ShowIcon`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_ShowIcon) property to determine if an image appears on the [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html). {% tabs %} {% highlight xaml %} @@ -268,7 +268,7 @@ button.ShowIcon = True; ## Image -The [`Image`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_Image) property is used to customize the height, width, image source and aspect for the image of [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html). +The [`Image`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_Image) property customizes the height, width, image source, and aspect for the image of [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html). {% tabs %} {% highlight xaml %} @@ -300,9 +300,9 @@ button.Image = new Image() ### ImageSource -The [`ImageSource`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_ImageSource) property is used to customize the icon image of [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html) by adding a custom image. +The [`ImageSource`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_ImageSource) property customizes the icon image on [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html) by adding a custom image. -N> Enable the [`ShowIcon`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_ShowIcon) property to enable the [`ImageSource`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_ImageSource) property. +> Note: Enable the [`ShowIcon`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_ShowIcon) property to activate the [`ImageSource`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_ImageSource) property. {% tabs %} {% highlight xaml %} @@ -321,13 +321,13 @@ button.ShowIcon = True; {% endhighlight %} {% endtabs %} -![SfButton with image with content](images/Button_icon.png) +![SfButton with icon image](images/Button_icon.png) ### ImageWidth -The [`ImageWidth`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_ImageWidth) property is used to customize the width of icon image in [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html). +The [`ImageWidth`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_ImageWidth) property customizes the width of the icon image in [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html). -N> Enable the [`ShowIcon`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_ShowIcon) property to enable the [`ImageSource`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_ImageSource) property. +> Note: Enable the [`ShowIcon`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_ShowIcon) property to activate the [`ImageSource`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_ImageSource) property. {% tabs %} {% highlight xaml %} @@ -349,18 +349,17 @@ button.ImageWidth = 50; ### ImageAlignment -The [`ImageAlignment`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_ImageAlignment) property is used to customize the alignment of icon image in [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html). The following options are available in [`ImageAlignment`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_ImageAlignment): +The [`ImageAlignment`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_ImageAlignment) property customizes the alignment of the icon image in [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html). The following options are available: -* [`Start`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.Alignment.html#Syncfusion_XForms_Buttons_Alignment_Start) - Places the image at the left most of [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html). -* [`End`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.Alignment.html#Syncfusion_XForms_Buttons_Alignment_End) - Places the image at the right most of [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html). -* [`Top`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.Alignment.html#Syncfusion_XForms_Buttons_Alignment_Top) - Places the image at the top of the text. -* [`Bottom`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.Alignment.html#Syncfusion_XForms_Buttons_Alignment_Bottom) - Places the image at the bottom of the text. -* [`Left`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.Alignment.html#Syncfusion_XForms_Buttons_Alignment_Left) - Although the flow direction has been applied, it always places the image in the left part of [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html). For example, in the direction of the RTL flow, the image setting will move to the right. Use ['Left'](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.Alignment.html#Syncfusion_XForms_Buttons_Alignment_Left) alignment to show this in the same left position. -* [`Right`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.Alignment.html#Syncfusion_XForms_Buttons_Alignment_Right) - Although flow direction has been applied, the image is always located in the right part of [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html). For example, in the direction of the RTL flow, the image setting will move to the left. But use ['Right'](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.Alignment.html#Syncfusion_XForms_Buttons_Alignment_Right) alignment to show this in the same right position. +- [`Start`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.Alignment.html#Syncfusion_XForms_Buttons_Alignment_Start) - Places the image on the left edge of [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html). +- [`End`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.Alignment.html#Syncfusion_XForms_Buttons_Alignment_End) - Places the image on the right edge of [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html). +- [`Top`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.Alignment.html#Syncfusion_XForms_Buttons_Alignment_Top) - Places the image above the text. +- [`Bottom`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.Alignment.html#Syncfusion_XForms_Buttons_Alignment_Bottom) - Places the image below the text. +- [`Left`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.Alignment.html#Syncfusion_XForms_Buttons_Alignment_Left) - Ensures the image remains on the left part of [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html) despite directional changes. +- [`Right`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.Alignment.html#Syncfusion_XForms_Buttons_Alignment_Right) - Ensures the image remains on the right part of [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html) despite directional changes. +> Note: Enable the [`ShowIcon`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_ShowIcon) property to activate the [`ImageSource`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_ImageSource) property. -N> Enable the [`ShowIcon`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_ShowIcon) property to enable the [`ImageSource`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_ImageSource) property. - -**End image alignment in `SfButton`** +**End Image Alignment in `SfButton`** {% tabs %} {% highlight xaml %} @@ -397,9 +396,9 @@ SfButton button = new SfButton() {% endhighlight %} {% endtabs %} -![SfButton with image with icon image with end alignment](images/Button_imagealignment_end.png) +![SfButton with end image alignment](images/Button_imagealignment_end.png) -**Start image alignment in `SfButton`** +**Start Image Alignment in `SfButton`** {% tabs %} {% highlight xaml %} @@ -437,9 +436,9 @@ SfButton button = new SfButton() {% endhighlight %} {% endtabs %} -![SfButton with image with icon image with start alignment](images/Button_imagealignment_start.png) +![SfButton with start image alignment](images/Button_imagealignment_start.png) -**Top image alignment in `SfButton`** +**Top Image Alignment in `SfButton`** {% tabs %} {% highlight xaml %} @@ -477,9 +476,9 @@ SfButton button = new SfButton() {% endhighlight %} {% endtabs %} -![SfButton with image with icon image with top alignment](images/Button_imagealignment_top.png) +![SfButton with top image alignment](images/Button_imagealignment_top.png) -**Bottom image alignment in `SfButton`** +**Bottom Image Alignment in `SfButton`** {% tabs %} {% highlight xaml %} diff --git a/Xamarin/Button/Event.md b/Xamarin/Button/Event.md index 667ee5846..9c6f04ab3 100644 --- a/Xamarin/Button/Event.md +++ b/Xamarin/Button/Event.md @@ -1,8 +1,8 @@ --- layout: post -title: Event in Xamarin Button control | Syncfusion -description: Learn here all about Event support in Syncfusion Xamarin Button (SfButton) control, its elements and more. -platform: xamarin +title: Event in Xamarin Button Control | Syncfusion +description: Discover event support in the Syncfusion Xamarin Button (SfButton) control and learn how to handle click events. +platform: Xamarin control: SfButton documentation: ug @@ -10,7 +10,7 @@ documentation: ug # Event in Xamarin Button (SfButton) -## Clicked event +## Clicked Event The click event occurs when the [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html) is clicked. The event argument is of type `EventArgs`. diff --git a/Xamarin/Button/GettingStarted.md b/Xamarin/Button/GettingStarted.md index 72a6029af..aa82ffbd6 100644 --- a/Xamarin/Button/GettingStarted.md +++ b/Xamarin/Button/GettingStarted.md @@ -1,9 +1,9 @@ --- layout: post -title: Getting Started with Xamarin Button control | Syncfusion -description: Learn here about getting started with Syncfusion Xamarin Button (SfButton) control, its elements and more. -platform: xamarin -control: sfbutton +title: Getting Started with Xamarin Button Control | Syncfusion +description: Discover how to get started with the Syncfusion Xamarin Button (SfButton) control, including key elements and configuration steps. +platform: Xamarin +control: SfButton documentation: ug --- @@ -11,35 +11,35 @@ documentation: ug This section explains the steps required to work with the [Xamarin.Forms Button](https://www.syncfusion.com/xamarin-ui-controls/xamarin-button) control. -## Assembly deployment +## Assembly Deployment -After installing [Essential Studio® for Xamarin](https://www.syncfusion.com/downloads/xamarin), you can find all the required assemblies in the installation folders, {Syncfusion Essential Studio Installed location} \Essential Studio\\{Version #}\Xamarin\lib. +After installing [Essential Studio® for Xamarin](https://www.syncfusion.com/downloads/xamarin), you can find all the required assemblies in the installation folders at {Syncfusion Essential Studio Installed location}\Essential Studio\\{Version #}\Xamarin\lib. E.g.: C:\Program Files (x86) \Syncfusion\Essential Studio\19.1.0.54\Xamarin\lib -N> Assemblies can be found in unzipped package location(Documents/Syncfusion/{Version #}/Xamarin/lib) in Mac. +> Note: Assemblies can be found in the unzipped package location (Documents/Syncfusion/{Version #}/Xamarin/lib) on a Mac. -## Adding SfButton reference +## Adding SfButton Reference -You can add SfButton reference using one of the following methods: +You can add the SfButton reference using one of the following methods: -**Method 1: Adding SfButton reference from nuget.org** +### Method 1: Adding SfButton Reference from nuget.org -Syncfusion Xamarin components are available in [nuget.org](https://www.nuget.org/). To add SfButton to your project, open the [NuGet package](https://help.syncfusion.com/xamarin/visual-studio-integration/nuget-packages) manager in Visual Studio, search for [Syncfusion.Xamarin.Buttons](https://www.nuget.org/packages/Syncfusion.Xamarin.Buttons), and then install it. +Syncfusion Xamarin components are available on [nuget.org](https://www.nuget.org/). To add SfButton to your project, open the [NuGet Package Manager](https://help.syncfusion.com/xamarin/visual-studio-integration/nuget-packages) in Visual Studio, search for [Syncfusion.Xamarin.Buttons](https://www.nuget.org/packages/Syncfusion.Xamarin.Buttons), and install it. ![Adding SfButton reference from NuGet](Images/Adding SfButton reference.png) -N> -* Install the same version of [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html) NuGet in all the projects. -* In addition, you need to install the [Syncfusion.Xamarin.Buttons.WPF]() package for Xamarin.Forms WPF platform only. +> Note: +> - Install the same version of [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html) NuGet in all projects. +> - Additionally, install the [Syncfusion.Xamarin.Buttons.WPF]() package for Xamarin.Forms WPF platform only. -**Method 2: Adding SfButton reference from toolbox** +### Method 2: Adding SfButton Reference from Toolbox -Syncfusion also provides Xamarin Toolbox. Using this toolbox, you can drag the [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html) control to the XAML page. It will automatically install the required NuGet packages and add the namespace to the page. To install Syncfusion Xamarin Toolbox, refer to [Toolbox](https://help.syncfusion.com/xamarin/utility#toolbox). +Syncfusion also provides a Xamarin Toolbox. Using this toolbox, you can drag the [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html) control to the XAML page. It will automatically install the required NuGet packages and add the namespace to the page. To install Syncfusion Xamarin Toolbox, refer to the [Toolbox](https://help.syncfusion.com/xamarin/utility#toolbox) documentation. -**Method 3: Adding SfButton assemblies manually from the installed location** +### Method 3: Adding SfButton Assemblies Manually from the Installed Location -If you prefer to manually reference the assemblies instead referencing from NuGet, add the following assemblies in respective projects. +If you prefer to manually reference the assemblies instead of using NuGet, add the following assemblies to the respective projects. Location: {Installed location}/{version}/Xamarin/lib @@ -66,15 +66,15 @@ tr> -N> To know more about obtaining our components, refer to these links for [Mac](https://help.syncfusion.com/xamarin/installation/mac-installer/how-to-download) and [Windows](https://help.syncfusion.com/xamarin/installation/web-installer/how-to-download). +> Note: For more information on obtaining our components, refer to these links for [Mac](https://help.syncfusion.com/xamarin/installation/mac-installer/how-to-download) and [Windows](https://help.syncfusion.com/xamarin/installation/web-installer/how-to-download). -I> Starting with v16.2.0.x, if you reference Syncfusion assemblies from the trial setup or from the NuGet feed, you also have to include a license key in your projects. Please refer to [Syncfusion license key](https://help.syncfusion.com/common/essential-studio/licensing/overview) to know about registering Syncfusion license key in your Xamarin application to use our components. +> Info: Starting with v16.2.0.x, if you reference Syncfusion assemblies from the trial setup or the NuGet feed, you must include a license key in your projects. Refer to [Syncfusion license key](https://help.syncfusion.com/common/essential-studio/licensing/overview) to learn about registering a Syncfusion license key in your Xamarin application to use our components. -N> After adding the reference, an additional step is required for iOS and UWP projects. If you are adding the references from toolbox, this step is not needed. +> Note: After adding the reference, an additional step is required for iOS and UWP projects. If you are adding the references from the toolbox, this step is not needed. -### Additional step for iOS +### Additional Step for iOS -To launch [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html) in iOS, call `SfButtonRenderer.Init()` in the `FinishedLaunching` overridden method of the `AppDelegate` class in iOS Project as demonstrated in the following code example. +To launch [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html) in iOS, call `SfButtonRenderer.Init()` in the `FinishedLaunching` overridden method of the `AppDelegate` class in the iOS project, as demonstrated in the following code example. {% tabs %} {% highlight c# %} @@ -89,9 +89,9 @@ public override bool FinishedLaunching(UIApplication app, NSDictionary options) {% endhighlight %} {% endtabs %} -### Additional step for UWP +### Additional Step for UWP -This step is required only if the application is deployed in Release mode with .NET native tool chain enabled. It is needed for resolving the known Framework issue “Custom controls not rendering in Release mode” in UWP platform. Initializing the [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html) assembly at the `OnLaunched` overridden method of the `App` class in UWP project is the suggested work around. The following code example demonstrates initializing the [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html) assembly. +This step is required only if the application is deployed in Release mode with the .NET native tool chain enabled. It is needed to resolve the known framework issue “Custom controls not rendering in Release mode” on the UWP platform. Initializing the [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html) assembly in the `OnLaunched` overridden method of the `App` class in the UWP project is the suggested workaround. The following code example demonstrates initializing the [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html) assembly. {% tabs %} {% highlight c# %} @@ -111,9 +111,9 @@ protected override void OnLaunched(LaunchActivatedEventArgs e) {% endhighlight %} {% endtabs %} -### Additional step for WPF +### Additional Step for WPF -To launch the button in WPF, call the SfButtonRenderer.Init() method in the MainWindow constructor of the MainWindow class after the Xamarin.Forms framework has been initialized and before the LoadApplication method is called as demonstrated in the following code sample. +To launch the button in WPF, call the `SfButtonRenderer.Init()` method in the MainWindow constructor of the MainWindow class after the Xamarin.Forms framework has been initialized and before the `LoadApplication` method is called, as demonstrated in the following code sample. {% tabs %} {% highlight c# %} @@ -137,11 +137,11 @@ public partial class MainWindow : FormsApplicationPage {% endhighlight %} {% endtabs %} -## Creating a simple SfButton +## Creating a Simple SfButton -The [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html) control is configured entirely in C# code or in XAML markup. The following steps explain how to create a [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html) and configure its elements. +The [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html) control is configured entirely in C# code or XAML markup. The following steps explain how to create an [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html) and configure its elements. -### Adding namespace for referred assemblies +### Adding Namespace for Referred Assemblies {% tabs %} {% highlight xaml %} @@ -152,7 +152,7 @@ using Syncfusion.XForms.Buttons; {% endhighlight %} {% endtabs %} -### Referring SfButton control with declared suffix name for namespace +### Referring SfButton Control with Declared Suffix Name for Namespace {% tabs %} {% highlight xaml %} @@ -194,9 +194,9 @@ namespace SfButton {% endhighlight %} {% endtabs %} -## Setting caption +## Setting Caption -The button caption can be defined using the [`Text`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_Text) property of [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html). This caption normally describes the meaning of the button and is displayed in button. +The button caption can be defined using the [`Text`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_Text) property of [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html). This caption normally describes the button's function and is displayed on the button. {% tabs %} {% highlight xaml %} @@ -214,9 +214,9 @@ button.Text = "Button"; ![SfButton with caption](images/ButtonWithText.png) -## Toggle button +## Toggle Button -The button behavior can be changed as toggle button by defining the [`IsCheckable`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_IsCheckable) property of [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html). +The button behavior can be changed to a toggle button by defining the [`IsCheckable`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_IsCheckable) property of [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html). {% tabs %} {% highlight xaml %} @@ -239,9 +239,9 @@ Checked state: Unchecked state: -![SfButton with toggle relased state](images/Toggle_Released_Button.png) +![SfButton with toggle released state](images/Toggle_Released_Button.png) -## Button icon +## Button Icon The button icon can be defined using the [`ImageSource`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_ImageSource) and [`ShowIcon`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_ShowIcon) properties of [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html). @@ -263,7 +263,7 @@ button.ShowIcon = true; ![SfButton with button icon](images/ButtonWithIcon.png) -## Button background image +## Button Background Image The button background icon can be defined using the [`BackgroundImage`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_BackgroundImage) property of [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html). @@ -286,7 +286,7 @@ button.CornerRadius = new Thickness(20); ![Button with background image](images/ButtonWithBackgroundImage.png) -## See also +## See Also [How to create Xamarin.Forms image button](https://support.syncfusion.com/kb/article/9599/how-to-create-image-button-in-xamarinforms-button) diff --git a/Xamarin/Button/Overview.md b/Xamarin/Button/Overview.md index 44ffb1a47..63e4e5f5f 100644 --- a/Xamarin/Button/Overview.md +++ b/Xamarin/Button/Overview.md @@ -1,22 +1,22 @@ --- layout: post -title: About Xamarin Button control | Syncfusion -description: Learn here all about introduction of Syncfusion Xamarin Button (SfButton) control, its elements and more. -platform: xamarin -control: sfbutton +title: About Xamarin Button Control | Syncfusion +description: Introduction to Syncfusion Xamarin Button (SfButton) control, its features, and capabilities. +platform: Xamarin +control: SfButton documentation: ug --- # Xamarin Button (SfButton) Overview -The Xamarin.Forms Button is a custom button control with UI customization, toggle states, and theme support. You can set icons, background images, and corner edge radii and customize the appearance for different visual states using the visual state manager. +The Xamarin.Forms Button is a versatile custom control that offers UI customization, toggle states, and theme support. It allows you to set icons, background images, corner edge radii, and customize the appearance for different visual states using the visual state manager. -## Key features +## Key Features - * Easily customize a button as an outline, flat, circle, or icon button. - * Use visual states such as pressed, normal, checked, and unchecked. - * Display an image as the background for the control. - * Display custom content in the button control. - * Use a toggle button. +- Easily customize a button to be an outline, flat, circle, or icon button. +- Use visual states such as pressed, normal, checked, and unchecked. +- Display an image as the control's background. +- Display custom content in the button control. +- Implement as a toggle button. -![Overview image of SfButton](Images/overview.png) +![Overview Image of SfButton](Images/overview.png) diff --git a/Xamarin/Button/VisualStates.md b/Xamarin/Button/VisualStates.md index 0454d0a90..e3b4348ec 100644 --- a/Xamarin/Button/VisualStates.md +++ b/Xamarin/Button/VisualStates.md @@ -1,25 +1,25 @@ --- layout: post -title: Visual States in Xamarin Button control | Syncfusion -description: Learn here all about Visual States support in Syncfusion Xamarin Button (SfButton) control and more. -platform: xamarin -control: sfbutton +title: Visual States in Xamarin Button Control | Syncfusion +description: Discover how to use Visual States in the Syncfusion Xamarin Button (SfButton) control for enhanced UI customization. +platform: Xamarin +control: SfButton documentation: ug --- # Visual States in Xamarin Button (SfButton) -The button visual can be customized through `VisualStates`. The [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html) control have the following four visual states: +The button's appearance can be customized through `VisualStates`. The [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html) control supports the following five visual states: -* Normal -* Pressed -* Checked -* Unchecked -* Disabled +- Normal +- Pressed +- Checked +- Unchecked +- Disabled -N> -* In addition, `MouseOver` VisualState is available only in the UWP platform. -* The visual states `Checked` and `Unchecked` are only updated when enabling the [`IsChecked`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_IsChecked) property in [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html). +> Note: +> - Additionally, the `MouseOver` visual state is available only on the UWP platform. +> - The visual states `Checked` and `Unchecked` are only updated when the [`IsChecked`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_IsChecked) property is enabled in [`SfButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html). {% tabs %} {% highlight xaml %} @@ -85,13 +85,13 @@ this.Content = stackLayout; {% endhighlight %} {% endtabs %} -**Pressed visual state:** -![SfButton with visual state](images/VisualState_PressedState.png) +**Pressed Visual State:** +![SfButton with pressed visual state](images/VisualState_PressedState.png) -**Normal visual state:** -![SfButton with visual state](images/VisualState_NormalState.png) +**Normal Visual State:** +![SfButton with normal visual state](images/VisualState_NormalState.png) -## See also +## See Also [How to change Xamarin.Forms button style using its visual states](https://support.syncfusion.com/kb/article/9580/how-to-change-xamarinforms-button-style-using-its-visual-states) diff --git a/Xamarin/Button/how-to/Add-the-custom-view-for-button.md b/Xamarin/Button/how-to/Add-the-custom-view-for-button.md index f85a949ef..f272c9f41 100644 --- a/Xamarin/Button/how-to/Add-the-custom-view-for-button.md +++ b/Xamarin/Button/how-to/Add-the-custom-view-for-button.md @@ -1,15 +1,15 @@ --- layout: post -title: How to add the custom view for Syncfusion SfButton -description: How to add the custom view for SfButton. +title: How to Add a Custom View for Syncfusion SfButton +description: Learn how to add a custom view for SfButton in Xamarin.Forms applications using Syncfusion controls. platform: xamarin.forms control: sfbutton documentation: ug --- -# Add the custom view for button +# Add a Custom View for SfButton -You can customize the appearance of the button by adding your custom view in the [`Content`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_Content) property. The following code sample demonstrates how to apply the busy indicator control as custom view for a button. +You can customize the appearance of the SfButton by adding your custom view through the [`Content`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_Content) property. The following code samples demonstrate how to apply the busy indicator control as a custom view within a button. {% tabs %} {% highlight xaml %} diff --git a/Xamarin/CheckBox/Event.md b/Xamarin/CheckBox/Event.md index 338915a84..6ab2bd74b 100644 --- a/Xamarin/CheckBox/Event.md +++ b/Xamarin/CheckBox/Event.md @@ -1,8 +1,8 @@ --- layout: post -title: Event in Xamarin CheckBox control | Syncfusion -description: Learn here all about Event support in Syncfusion Xamarin CheckBox (SfCheckBox) control, its elements and more. -platform: xamarin +title: Event in Xamarin CheckBox Control | Syncfusion +description: Learn all about event support in Syncfusion Xamarin CheckBox (SfCheckBox) control, including its elements and more. +platform: Xamarin control: SfCheckBox documentation: ug keywords: button, SfCheckBox, CheckBox @@ -11,10 +11,10 @@ keywords: button, SfCheckBox, CheckBox # Event in Xamarin CheckBox (SfCheckBox) -## StateChanged event -Occurs when the value(state) of the [`IsChecked`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ToggleButton.html#Syncfusion_XForms_Buttons_ToggleButton_IsChecked) property is changed by either touching the check box or setting the value to the [`IsChecked`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ToggleButton.html#Syncfusion_XForms_Buttons_ToggleButton_IsChecked) property using XAML or C# code. The event arguments are of type [`StateChangedEventArgs`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.StateChangedEventArgs.html) and expose the following property: +## StateChanged Event +The `StateChanged` event occurs when the value (state) of the [`IsChecked`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ToggleButton.html#Syncfusion_XForms_Buttons_ToggleButton_IsChecked) property changes. This change can happen by either interacting with the check box or programmatically setting the value using XAML or C# code. The event arguments are of type [`StateChangedEventArgs`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.StateChangedEventArgs.html) and expose the following property: -* [`IsChecked`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ToggleButton.html#Syncfusion_XForms_Buttons_ToggleButton_IsChecked): The new value(state) of the [`IsChecked`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ToggleButton.html#Syncfusion_XForms_Buttons_ToggleButton_IsChecked) property. +* [`IsChecked`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ToggleButton.html#Syncfusion_XForms_Buttons_ToggleButton_IsChecked): Represents the new value (state) of the `IsChecked` property. {% tabs %} {% highlight xaml %} @@ -55,9 +55,8 @@ private void CheckBox_StateChanged(object sender, StateChangedEventArgs e) ![Checked state image](Images/Event1.png) ![Unchecked state image](Images/Event2.png) -![Indeterminate state image ](Images/Event3.png) +![Indeterminate state image](Images/Event3.png) ## See also -[How to get the values of selected checkboxes in a group using Xamarin.Forms](https://support.syncfusion.com/kb/article/9507/how-to-get-the-values-of-selected-checkboxes-in-a-group-using-xamarin-forms) - +- [How to get the values of selected checkboxes in a group using Xamarin.Forms](https://support.syncfusion.com/kb/article/9507/how-to-get-the-values-of-selected-checkboxes-in-a-group-using-xamarin-forms) diff --git a/Xamarin/CheckBox/Getting-Started.md b/Xamarin/CheckBox/Getting-Started.md index c4561914b..31d487c12 100644 --- a/Xamarin/CheckBox/Getting-Started.md +++ b/Xamarin/CheckBox/Getting-Started.md @@ -1,8 +1,8 @@ --- layout: post -title: Getting Started with Xamarin CheckBox control | Syncfusion -description: Learn here about getting started with Syncfusion Xamarin CheckBox (SfCheckBox) control, its elements and more. -platform: xamarin +title: Getting Started with Xamarin CheckBox Control | Syncfusion +description: Learn how to get started with Syncfusion Xamarin CheckBox (SfCheckBox) control, including its elements and more. +platform: Xamarin control: SfCheckBox documentation: ug keywords: button, SfCheckBox, CheckBox @@ -11,37 +11,37 @@ keywords: button, SfCheckBox, CheckBox # Getting Started with Xamarin CheckBox (SfCheckBox) -This section explains the steps required to configure the [Xamarin CheckBox](https://www.syncfusion.com/xamarin-ui-controls/xamarin-checkbox) (SfCheckBox) control in a real-time scenario and provides a walk-through on some of the customization features available in [Xamarin CheckBox](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfCheckBox.html) (SfCheckBox) control. +This section explains the steps required to configure the [Xamarin CheckBox](https://www.syncfusion.com/xamarin-ui-controls/xamarin-checkbox) (SfCheckBox) control in a real-time scenario and provides a walk-through of some of the customization features available in the [Xamarin CheckBox](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfCheckBox.html) control. -## Assembly deployment +## Assembly Deployment -After installing [Essential Studio® for Xamarin](https://www.syncfusion.com/downloads/xamarin), you can find all the required assemblies in the installation folders, {Syncfusion Essential Studio Installed location} \Essential Studio\\{Version #}\Xamarin\lib. +After installing [Essential Studio® for Xamarin](https://www.syncfusion.com/downloads/xamarin), you can find all the required assemblies in the installation folders at `{Syncfusion Essential Studio Installed location}\Essential Studio\{Version #}\Xamarin\lib`. E.g.: C:\Program Files (x86) \Syncfusion\Essential Studio\19.1.0.54\Xamarin\lib -N> Assemblies can be found in unzipped package location(Documents/Syncfusion/{Version #}/Xamarin/lib) in Mac. +> **Note:** Assemblies can be found in the unzipped package location (Documents/Syncfusion/{Version #}/Xamarin/lib) on a Mac. -## Adding SfCheckBox reference +## Adding SfCheckBox Reference -You can add [`SfCheckBox`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfCheckBox.html) reference using one of the following methods: +You can add a reference to [`SfCheckBox`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfCheckBox.html) using one of the following methods: -**Method 1: Adding SfCheckBox reference from nuget.org** +### Method 1: Adding SfCheckBox Reference from nuget.org -Syncfusion Xamarin components are available in [nuget.org](https://www.nuget.org/). To add SfCheckBox to your project, open the NuGet package manager in Visual Studio, search for [Syncfusion.Xamarin.Buttons](https://www.nuget.org/packages/Syncfusion.Xamarin.Buttons), and then install it. +Syncfusion Xamarin components are available on [nuget.org](https://www.nuget.org/). To add SfCheckBox to your project, open the NuGet package manager in Visual Studio, search for [Syncfusion.Xamarin.Buttons](https://www.nuget.org/packages/Syncfusion.Xamarin.Buttons), and then install it. ![Xamarin.Forms CheckBox NuGet](Images/Adding SfCheckBox reference.png) -N> -* Install the same version of [`SfCheckBox`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfCheckBox.html) NuGet in all the projects. -* In addition, you need to install the [Syncfusion.Xamarin.Buttons.WPF]() package for Xamarin.Forms WPF platform only. +> **Note:** +> - Install the same version of `SfCheckBox` NuGet in all the projects. +> - Additionally, you need to install the [Syncfusion.Xamarin.Buttons.WPF]() package for Xamarin.Forms WPF platforms only. -**Method 2: Adding SfCheckBox reference from toolbox** +### Method 2: Adding SfCheckBox Reference from Toolbox -Syncfusion also provides Xamarin Toolbox. Using this toolbox, you can drag the [`SfCheckBox`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfCheckBox.html) control to the XAML page. It will automatically install the required NuGet packages and add the namespace to the page. To install Syncfusion Xamarin Toolbox, refer to [Toolbox](https://help.syncfusion.com/xamarin/utility#toolbox). +Syncfusion also provides the Xamarin Toolbox. Using this toolbox, you can drag the [`SfCheckBox`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfCheckBox.html) control to the XAML page. It will automatically install the required NuGet packages and add the namespace to the page. To install Syncfusion Xamarin Toolbox, refer to [Toolbox](https://help.syncfusion.com/xamarin/utility#toolbox). -**Method 3: Adding SfCheckBox assemblies manually from the installed location** +### Method 3: Adding SfCheckBox Assemblies Manually from the Installed Location -If you prefer to manually reference the assemblies instead referencing from NuGet, add the following assemblies in respective projects. +If you prefer to manually reference the assemblies instead of referencing them from NuGet, add the following assemblies to the respective projects. Location: {Installed location}/{version}/Xamarin/lib diff --git a/Xamarin/CheckBox/Overview.md b/Xamarin/CheckBox/Overview.md index cc5327c88..36e51dc2f 100644 --- a/Xamarin/CheckBox/Overview.md +++ b/Xamarin/CheckBox/Overview.md @@ -1,21 +1,20 @@ --- layout: post -title: About Xamarin CheckBox control | Syncfusion -description: Learn here all about introduction of Syncfusion Xamarin CheckBox (SfCheckBox) control, its elements and more. -platform: xamarin +title: About Xamarin CheckBox Control | Syncfusion +description: Learn about the introduction of Syncfusion Xamarin CheckBox (SfCheckBox) control, its elements, and more. +platform: Xamarin control: SfCheckBox documentation: ug keywords: button, SfCheckBox, CheckBox - --- # Xamarin CheckBox (SfCheckBox) Overview -The check box is a selection control that allows users to select one or more options from a set. The three states of check box are checked, unchecked and indeterminate. +The check box is a selection control that allows users to select one or more options from a set. The three states of a check box are checked, unchecked, and indeterminate. -## Key features +## Key Features -* Supports three states. -* Allow users to select and clear the control by tapping. -* Supports check box color, shape and label text customization. +* Supports three states: checked, unchecked, and indeterminate. +* Allows users to select and clear the control by tapping. +* Supports customization of check box color, shape, and label text. ![Checkbox Image](Images/CheckBox_Overview.png) \ No newline at end of file diff --git a/Xamarin/CheckBox/Visual-Customization.md b/Xamarin/CheckBox/Visual-Customization.md index ba6479078..0dd158f10 100644 --- a/Xamarin/CheckBox/Visual-Customization.md +++ b/Xamarin/CheckBox/Visual-Customization.md @@ -1,8 +1,8 @@ --- layout: post -title: Visual Customization in Xamarin CheckBox control | Syncfusion -description: Learn here all about Visual Customization support in Syncfusion Xamarin CheckBox (SfCheckBox) control and more. -platform: xamarin +title: Visual Customization in Xamarin CheckBox Control | Syncfusion +description: Learn about visual customization support in Syncfusion Xamarin CheckBox (SfCheckBox) control and more. +platform: Xamarin control: SfCheckBox documentation: ug keywords: button, SfCheckBox, CheckBox @@ -11,8 +11,8 @@ keywords: button, SfCheckBox, CheckBox # Visual Customization in Xamarin CheckBox (SfCheckBox) -## Customizing a shape -The check box shape can be customized using the [`CornerRadius`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfCheckBox.html#Syncfusion_XForms_Buttons_SfCheckBox_CornerRadius) property. This property specifies the uniform radius value to the every corner of the check box. +## Customizing the Shape +The check box shape can be customized using the [`CornerRadius`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfCheckBox.html#Syncfusion_XForms_Buttons_SfCheckBox_CornerRadius) property. This property specifies the uniform radius value for each corner of the check box. {% tabs %} {% highlight xaml %} diff --git a/Xamarin/CheckBox/VisualStates.md b/Xamarin/CheckBox/VisualStates.md index 1a79b03c5..f97af1554 100644 --- a/Xamarin/CheckBox/VisualStates.md +++ b/Xamarin/CheckBox/VisualStates.md @@ -1,15 +1,15 @@ --- layout: post -title: Visual States in Xamarin CheckBox control | Syncfusion -description: Learn here all about Visual States support in Syncfusion Xamarin CheckBox (SfCheckBox) control and more. -platform: xamarin +title: Visual States in Xamarin CheckBox Control | Syncfusion +description: Learn about visual states support in Syncfusion Xamarin CheckBox (SfCheckBox) control and more. +platform: Xamarin control: SfCheckBox documentation: ug --- # Visual States in Xamarin CheckBox (SfCheckBox) -The visual of CheckBox can be customized using `VisualStates`. The [`SfCheckBox`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfCheckBox.html) control contains the following three visual states: +The visual appearance of the CheckBox can be customized using `VisualStates`. The [`SfCheckBox`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfCheckBox.html) control contains the following three visual states: * Checked * Unchecked @@ -82,11 +82,11 @@ VisualStateManager.SetVisualStateGroups(checkBox, visualStateGroupList); {% endhighlight %} {% endtabs %} -**Checked visual state:** +**Checked Visual State:** ![SfCheckBox with visual state of checked state](images/CheckBox_VisualState_Checked.png) -**Unchecked visual state:** +**Unchecked Visual State:** ![SfCheckBox with visual state of unchecked state](images/CheckBox_VisualState_Unchecked.png) -**Intermediate visual state:** +**Intermediate Visual State:** ![SfCheckBox with visual state of intermediate state](images/CheckBox_VisualState_Intermediate.png) diff --git a/Xamarin/Chips/Customization.md b/Xamarin/Chips/Customization.md index 01498c3fa..53d1c156b 100644 --- a/Xamarin/Chips/Customization.md +++ b/Xamarin/Chips/Customization.md @@ -1,19 +1,19 @@ --- layout: post -title: Customization in Xamarin Chips control | Syncfusion -description: Learn about Customization support in Syncfusion Essential Studio® Xamarin Chips control, its elements and more. -platform: xamarin +title: Customization in Xamarin Chips Control | Syncfusion +description: Learn about customization support in Syncfusion Essential Studio® Xamarin Chips control, its elements, and more. +platform: Xamarin control: Chips documentation: ug --- # Customization in Xamarin Chips -The chip control supports to customize the background color, border color, close button color, and more. The chip control can be customized using the following properties: +The chip control supports customizing the background color, border color, close button color, and more. You can customize the chip control using the following properties: ## ShowCloseButton -The [`ShowCloseButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChip.html#Syncfusion_XForms_Buttons_SfChip_ShowCloseButton) property sets the visible state of close button in [`SfChip`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChip.html). +The [`ShowCloseButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChip.html#Syncfusion_XForms_Buttons_SfChip_ShowCloseButton) property sets the visible state of the close button in [`SfChip`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChip.html). {% tabs %} @@ -2410,7 +2410,7 @@ namespace ChipCustomization ## CloseButtonColor -The [`CloseButtonColor`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipGroup.html#Syncfusion_XForms_Buttons_SfChipGroup_CloseButtonColor) property customizes the color of close button in the [`SfChipGroup`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipGroup.html). +The [`CloseButtonColor`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChip.html#Syncfusion_XForms_Buttons_SfChip_CloseButtonColor) property customizes the color of the close button in [`SfChip`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChip.html). {% tabs %} @@ -2501,11 +2501,12 @@ namespace ChipCustomization {% endtabs %} -N> The default value of [`CloseButtonColor`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipGroup.html#Syncfusion_XForms_Buttons_SfChipGroup_CloseButtonColor) is [`Color.Black`]. +![SfChip with CloseButtonColor](images/customization-images/chip_closebuttoncolor_image.png) +> **Note:** The default value of [`CloseButtonColor`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChip.html#Syncfusion_XForms_Buttons_SfChip_CloseButtonColor) is `Color.FromHex("#6b6b6b")`. ## SelectionIndicatorColor -The [`SelectionIndicatorColor`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipGroup.html#Syncfusion_XForms_Buttons_SfChipGroup_SelectionIndicatorColor) property customizes the selection indicator color of the [`SfChipGroup`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipGroup.html). +The [`SelectionIndicatorColor`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChip.html#Syncfusion_XForms_Buttons_SfChip_SelectionIndicatorColor) property customizes the selection indicator color in [`SfChip`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChip.html). {% tabs %} @@ -2591,9 +2592,9 @@ namespace ChipCustomization {% endtabs %} -![SfChipGroup with SelectionIndicatorColor](images/customization-images/chipgroup_selectionindicatorcolor_image.png) +![SfChip with SelectionIndicatorColor](images/customization-images/chip_selectionindicatorcolor_image.png) -N> The default value of [`SelectionIndicatorColor`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipGroup.html#Syncfusion_XForms_Buttons_SfChipGroup_SelectionIndicatorColor) is [`Color.White`]. +> **Note:** The default value of [`SelectionIndicatorColor`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChip.html#Syncfusion_XForms_Buttons_SfChip_SelectionIndicatorColor) is `Color.FromHex("#6b6b6b")`. ## ChipImageWidth @@ -2756,3 +2757,4 @@ N> The default value of [`ChipImageWidth`](https://help.syncfusion.com/cr/xamari [How to select a multiple chips from the Xamarin ChipGroup [SfChipGroup]](https://support.syncfusion.com/kb/article/9657/how-to-select-a-multiple-chips-from-the-xamarin-chipgroup-sfchipgroup) [How to display each chip in different colors in the Xamarin.Forms ChipGroup](https://support.syncfusion.com/kb/article/9644/how-to-display-each-chip-in-different-colors-in-the-xamarin-forms-chipgroup) + diff --git a/Xamarin/Chips/DataTemplateSelector.md b/Xamarin/Chips/DataTemplateSelector.md index 8dd9f71c6..722577072 100644 --- a/Xamarin/Chips/DataTemplateSelector.md +++ b/Xamarin/Chips/DataTemplateSelector.md @@ -1,8 +1,8 @@ --- layout: post -title: DataTemplateSelector in Xamarin Chips control | Syncfusion -description: Learn about DataTemplateSelector support in Syncfusion Xamarin Chips control, its elements and more. -platform: xamarin +title: DataTemplateSelector in Xamarin Chips Control | Syncfusion +description: Learn about DataTemplateSelector support in Syncfusion Xamarin Chips control, including its elements and more. +platform: Xamarin control: Chips documentation: ug --- @@ -10,9 +10,9 @@ documentation: ug # DataTemplateSelector in Xamarin Chips You can customize the appearance of each chip with different templates based on specific constraints using the [`DataTemplateSelector`](https://learn.microsoft.com/en-us/dotnet/api/xamarin.forms.datatemplateselector?view=xamarin-forms). -## Create and initialize business models +## Create and Initialize Business Models -Define a simple model class ChipModel with fields Text, CanSelect, ImageSource, and populate chip model in ViewModel. +Define a simple model class, `ChipModel`, with fields `Text`, `CanSelect`, `ImageSource`, and populate the chip model in the ViewModel. {% tabs %} @@ -50,9 +50,9 @@ Define a simple model class ChipModel with fields Text, CanSelect, ImageSource, {% endtabs %} -### Create a data template selector +### Create a DataTemplateSelector -Create a custom class by inheriting [`DataTemplateSelector`](https://learn.microsoft.com/en-us/dotnet/api/xamarin.forms.datatemplateselector?view=xamarin-forms), and override the `OnSelectTemplate` method to return the `DataTemplate` for that item. At runtime, the SfChipGroup invokes the `OnSelectTemplate` method for each item and passes the data object as parameter. +Create a custom class by inheriting from the [`DataTemplateSelector`](https://learn.microsoft.com/en-us/dotnet/api/xamarin.forms.datatemplateselector?view=xamarin-forms), and override the `OnSelectTemplate` method to return the `DataTemplate` for a given item. At runtime, the SfChipGroup invokes the `OnSelectTemplate` method for each item and passes the data object as a parameter. {% tabs %} {% highlight c# %} @@ -71,9 +71,9 @@ public class ChipDataTemplateSelector : DataTemplateSelector {% endhighlight %} {% endtabs %} -### Applying the data template selector +### Applying the DataTemplateSelector -Assign the already defined [`DataTemplateSelector`](https://learn.microsoft.com/en-us/dotnet/api/xamarin.forms.datatemplateselector?view=xamarin-forms) to the [`ItemTemplate`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipGroup.html#Syncfusion_XForms_Buttons_SfChipGroup_ItemTemplate) of the SfChipGroup in either XAML or C#. +Assign the defined [`DataTemplateSelector`](https://learn.microsoft.com/en-us/dotnet/api/xamarin.forms.datatemplateselector?view=xamarin-forms) to the [`ItemTemplate`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipGroup.html#Syncfusion_XForms_Buttons_SfChipGroup_ItemTemplate) of the SfChipGroup in either XAML or C#. {% tabs %} {% highlight xaml %} @@ -122,5 +122,4 @@ this.Content = chipGroup; {% endhighlight %} {% endtabs %} -![DataTemplateSelector support for SfChipGroup in Xamarin.Forms](images\customization-images/xamarin-forms-datatemplateselector.png) - +![DataTemplateSelector support for SfChipGroup in Xamarin.Forms](images/customization-images/xamarin-forms-datatemplateselector.png) diff --git a/Xamarin/Chips/Events.md b/Xamarin/Chips/Events.md index ec4edc94f..dffc3c10b 100644 --- a/Xamarin/Chips/Events.md +++ b/Xamarin/Chips/Events.md @@ -1,8 +1,8 @@ --- layout: post -title: Events in Xamarin Chips control | Syncfusion -description: Learn about Events support in Syncfusion Essential Studio® Xamarin Chips control, its elements and more. -platform: xamarin +title: Events in Xamarin Chips Control | Syncfusion +description: Learn about events support in Syncfusion Essential Studio® Xamarin Chips control, including its elements and more. +platform: Xamarin control: Chips documentation: ug --- @@ -10,34 +10,34 @@ documentation: ug # Events in Xamarin Chips ## SelectionChanging Event -The [SelectionChanging](https://help.syncfusion.com/cr/xamarin/Syncfusion.Buttons.XForms.SfChip.SelectionChangingEventArgs.html) event is triggered before the Chip is selected. You can restrict a chip from being selected, by canceling this event, by setting [Cancel](https://help.syncfusion.com/cr/xamarin/Syncfusion.Buttons.XForms.SfChip.SelectionChangingEventArgs.html#Syncfusion_Buttons_XForms_SfChip_SelectionChangingEventArgs_Cancel) property in the event argument to true. The argument contains the following information, +The [SelectionChanging](https://help.syncfusion.com/cr/xamarin/Syncfusion.Buttons.XForms.SfChip.SelectionChangingEventArgs.html) event is triggered before a chip is selected. You can restrict a chip from being selected by canceling this event, which is done by setting the [Cancel](https://help.syncfusion.com/cr/xamarin/Syncfusion.Buttons.XForms.SfChip.SelectionChangingEventArgs.html#Syncfusion_Buttons_XForms_SfChip_SelectionChangingEventArgs_Cancel) property in the event argument to true. The argument contains the following information: * [AddedItem](https://help.syncfusion.com/cr/xamarin/Syncfusion.Buttons.XForms.SfChip.SelectionChangingEventArgs.html#Syncfusion_Buttons_XForms_SfChip_SelectionChangingEventArgs_AddedItem) - Used to get the selected chip from [SfChipGroup](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipGroup.html). - * [RemovedItem](https://help.syncfusion.com/cr/xamarin/Syncfusion.Buttons.XForms.SfChip.SelectionChangingEventArgs.html#Syncfusion_Buttons_XForms_SfChip_SelectionChangingEventArgs_RemovedItem) - Used to get the previous selected or deselected chip from [SfChipGroup](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipGroup.html). + * [RemovedItem](https://help.syncfusion.com/cr/xamarin/Syncfusion.Buttons.XForms.SfChip.SelectionChangingEventArgs.html#Syncfusion_Buttons_XForms_SfChip_SelectionChangingEventArgs_RemovedItem) - Used to get the previously selected or deselected chip from [SfChipGroup](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipGroup.html). * [Cancel](https://help.syncfusion.com/cr/xamarin/Syncfusion.Buttons.XForms.SfChip.SelectionChangingEventArgs.html#Syncfusion_Buttons_XForms_SfChip_SelectionChangingEventArgs_Cancel) - Used to set the value indicating whether the selection should be canceled. ## SelectionChanged Event -The [SelectionChanged](https://help.syncfusion.com/cr/xamarin/Syncfusion.Buttons.XForms.SfChip.SelectionChangedEventArgs.html) event triggered after a chip is selected. The argument contains the following information, +The [SelectionChanged](https://help.syncfusion.com/cr/xamarin/Syncfusion.Buttons.XForms.SfChip.SelectionChangedEventArgs.html) event is triggered after a chip is selected. The argument contains the following information: - * [AddedItem](https://help.syncfusion.com/cr/xamarin/Syncfusion.Buttons.XForms.SfChip.SelectionChangedEventArgs.html#Syncfusion_Buttons_XForms_SfChip_SelectionChangedEventArgs_AddedItem) - Get the selected chip from [SfChipGroup](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipGroup.html). - * [RemovedItem](https://help.syncfusion.com/cr/xamarin/Syncfusion.Buttons.XForms.SfChip.SelectionChangedEventArgs.html#Syncfusion_Buttons_XForms_SfChip_SelectionChangedEventArgs_RemovedItem) - Get the previous selected or deselected chip from [SfChipGroup](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipGroup.html). + * [AddedItem](https://help.syncfusion.com/cr/xamarin/Syncfusion.Buttons.XForms.SfChip.SelectionChangedEventArgs.html#Syncfusion_Buttons_XForms_SfChip_SelectionChangedEventArgs_AddedItem) - Gets the selected chip from [SfChipGroup](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipGroup.html). + * [RemovedItem](https://help.syncfusion.com/cr/xamarin/Syncfusion.Buttons.XForms.SfChip.SelectionChangedEventArgs.html#Syncfusion_Buttons_XForms_SfChip_SelectionChangedEventArgs_RemovedItem) - Gets the previously selected or deselected chip from [SfChipGroup](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipGroup.html). -N> Currently, [`Choice`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipsType.html#Syncfusion_XForms_Buttons_SfChipsType_Choice) and [`Filter`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipsType.html#Syncfusion_XForms_Buttons_SfChipsType_Filter) types are only supported for [SelectionChanging](https://help.syncfusion.com/cr/xamarin/Syncfusion.Buttons.XForms.SfChip.SelectionChangingEventArgs.html) and [SelectionChanged](https://help.syncfusion.com/cr/xamarin/Syncfusion.Buttons.XForms.SfChip.SelectionChangedEventArgs.html) events. +> **Note:** Currently, the [`Choice`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipsType.html#Syncfusion_XForms_Buttons_SfChipsType_Choice) and [`Filter`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipsType.html#Syncfusion_XForms_Buttons_SfChipsType_Filter) types are only supported for [SelectionChanging](https://help.syncfusion.com/cr/xamarin/Syncfusion.Buttons.XForms.SfChip.SelectionChangingEventArgs.html) and [SelectionChanged](https://help.syncfusion.com/cr/xamarin/Syncfusion.Buttons.XForms.SfChip.SelectionChangedEventArgs.html) events. -## ChipClicked +## ChipClicked -The [`ChipClicked`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipGroup.html#Syncfusion_XForms_Buttons_SfChipGroup_ChipClicked) event is triggered when a chip clicked in the [SfChipGroup](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipGroup.html). The event argument is type of `EventArgs`. +The [`ChipClicked`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipGroup.html#Syncfusion_XForms_Buttons_SfChipGroup_ChipClicked) event is triggered when a chip is clicked within the [SfChipGroup](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipGroup.html). The event argument is of type `EventArgs`. ## ItemRemoved Event -The [ItemRemoved](https://help.syncfusion.com/cr/xamarin/Syncfusion.Buttons.XForms.SfChip.ItemRemovedEventArgs.html) event is triggered after the chip is removed from [SfChipGroup](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipGroup.html). The argument contains the following information, +The [ItemRemoved](https://help.syncfusion.com/cr/xamarin/Syncfusion.Buttons.XForms.SfChip.ItemRemovedEventArgs.html) event is triggered after a chip is removed from the [SfChipGroup](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipGroup.html). The argument contains the following information: -* [RemovedItem](https://help.syncfusion.com/cr/xamarin/Syncfusion.Buttons.XForms.SfChip.ItemRemovedEventArgs.html#Syncfusion_Buttons_XForms_SfChip_ItemRemovedEventArgs_RemovedItem) - Get the removed chip item from the [SfChipGroup](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipGroup.html). + * [RemovedItem](https://help.syncfusion.com/cr/xamarin/Syncfusion.Buttons.XForms.SfChip.ItemRemovedEventArgs.html#Syncfusion_Buttons_XForms_SfChip_ItemRemovedEventArgs_RemovedItem) - Gets the removed chip item from the [SfChipGroup](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipGroup.html). -N> The [ItemRemoved](https://help.syncfusion.com/cr/xamarin/Syncfusion.Buttons.XForms.SfChip.ItemRemovedEventArgs.html) event is supported only in the [`Input`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipsType.html#Syncfusion_XForms_Buttons_SfChipsType_Input) type. +> **Note:** The [ItemRemoved](https://help.syncfusion.com/cr/xamarin/Syncfusion.Buttons.XForms.SfChip.ItemRemovedEventArgs.html) event is supported only in the [`Input`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipsType.html#Syncfusion_XForms_Buttons_SfChipsType_Input) type. ## See also -[How to remove the indicator icon from Xamarin.Forms chip group (SfChipGroup)](https://support.syncfusion.com/kb/article/9826/how-to-remove-the-indicator-icon-from-xamarin-forms-chip-group-sfchipgroup) +- [How to remove the indicator icon from Xamarin.Forms chip group (SfChipGroup)](https://support.syncfusion.com/kb/article/9826/how-to-remove-the-indicator-icon-from-xamarin-forms-chip-group-sfchipgroup) -[How to restrict chip selection in Xamarin](https://support.syncfusion.com/kb/article/9678/how-to-restrict-chip-selection-in-xamarin) +- [How to restrict chip selection in Xamarin](https://support.syncfusion.com/kb/article/9678/how-to-restrict-chip-selection-in-xamarin) diff --git a/Xamarin/Chips/Getting-Started.md b/Xamarin/Chips/Getting-Started.md index dd78214cb..acbd55e90 100644 --- a/Xamarin/Chips/Getting-Started.md +++ b/Xamarin/Chips/Getting-Started.md @@ -1,45 +1,45 @@ --- layout: post -title: Getting Started with Xamarin Chips control | Syncfusion -description: Learn here about getting started with Syncfusion Essential Studio® Xamarin Chips control, its elements and more. -platform: xamarin +title: Getting Started with Xamarin Chips Control | Syncfusion +description: Learn about getting started with Syncfusion Essential Studio® Xamarin Chips control, including its elements and more. +platform: Xamarin control: Chips documentation: ug --- # Getting Started with Xamarin Chips -This section explains the steps required to create chips and arrange them in a layout for performing action. This section covers only the minimal features that you needed to know to get started with the chips. +This section explains the steps required to create chips and arrange them in a layout for performing actions. It covers only the minimal features needed to get started with chips. -## Assembly deployment +## Assembly Deployment -After installing [Essential Studio® for Xamarin](https://www.syncfusion.com/downloads/xamarin), you can find all the required assemblies in the installation folders, {Syncfusion Essential Studio Installed location} \Essential Studio\\{Version #}\Xamarin\lib. +After installing [Essential Studio® for Xamarin](https://www.syncfusion.com/downloads/xamarin), you will find all the required assemblies in the installation folders: `{Syncfusion Essential Studio Installed Location}\Essential Studio\{Version #}\Xamarin\lib`. E.g.: C:\Program Files (x86) \Syncfusion\Essential Studio\19.1.0.54\Xamarin\lib -N> Assemblies can be found in unzipped package location(Documents/Syncfusion/{Version #}/Xamarin/lib) in Mac. +> **Note:** Assemblies can be found in the unzipped package location (Documents/Syncfusion/{Version #}/Xamarin/lib) on a Mac. -## Adding Chips reference +## Adding Chips Reference -You can add Chips reference using one of the following methods: +You can add the Chips reference using one of the following methods: -**Method 1: Adding Chips reference from nuget.org** +### Method 1: Adding Chips Reference from NuGet.org -Syncfusion Xamarin components are available in [nuget.org](https://www.nuget.org/). To add Chips to your project, open the NuGet package manager in Visual Studio, search for [Syncfusion.Xamarin.Buttons](https://www.nuget.org/packages/Syncfusion.Xamarin.Buttons), and then install it. +Syncfusion Xamarin components are available on [nuget.org](https://www.nuget.org/). To add Chips to your project, open the NuGet package manager in Visual Studio, search for [Syncfusion.Xamarin.Buttons](https://www.nuget.org/packages/Syncfusion.Xamarin.Buttons), and then install it. ![Adding Chips reference from NuGet](images/action-type-chip/Adding Chips reference.png) -N> -* Install the same version of Chips NuGet in all the projects. -* In addition, you need to install the [Syncfusion.Xamarin.Buttons.WPF]() package for Xamarin.Forms WPF platform only. +> **Note:** +> - Install the same version of the Chips NuGet in all projects. +> - Additionally, you need to install the [Syncfusion.Xamarin.Buttons.WPF]() package for Xamarin.Forms WPF platforms only. -**Method 2: Adding Chips reference from toolbox** +### Method 2: Adding Chips Reference from Toolbox -Syncfusion also provides Xamarin Toolbox. Using this toolbox, you can drag the Chips control to the XAML page. It will automatically install the required NuGet packages and add the namespace to the page. To install Syncfusion Xamarin Toolbox, refer to [Toolbox](https://help.syncfusion.com/xamarin/utility#toolbox). +Syncfusion also provides the Xamarin Toolbox. By using this toolbox, you can drag the Chips control to the XAML page. It will automatically install the required NuGet packages and add the namespace to the page. To install Syncfusion Xamarin Toolbox, refer to [Toolbox](https://help.syncfusion.com/xamarin/utility#toolbox). -**Method 3: Adding Chips assemblies manually from the installed location** +### Method 3: Adding Chips Assemblies Manually from the Installed Location -If you prefer to manually reference the assemblies instead referencing from NuGet, add the following assemblies in respective projects. +If you prefer to manually reference the assemblies instead of referencing them from NuGet, add the following assemblies in the respective projects. Location: {Installed location}/{version}/Xamarin/lib @@ -77,11 +77,11 @@ To use the chips control inside an application, each platform application requir ### iOS -N> If you are adding the references from toolbox, this step is not needed. +> **Note:** If you are adding the references from the toolbox, this step is not needed. #### For SfChip -To launch the [SfChip](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChip.html) in iOS, call the `SfChipRenderer.Init()` method in the FinishedLaunching overridden method of the AppDelegate class after the Xamarin.Forms framework has been initialized and before the LoadApplication method is called as demonstrated in the following code sample: +To launch the [SfChip](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChip.html) in iOS, call the `SfChipRenderer.Init()` method in the `FinishedLaunching` overridden method of the `AppDelegate` class after the Xamarin.Forms framework has been initialized and before the `LoadApplication` method is called, as demonstrated in the following code sample: {% highlight c# %} diff --git a/Xamarin/Chips/Overview.md b/Xamarin/Chips/Overview.md index 066f6b557..b6b35e43f 100644 --- a/Xamarin/Chips/Overview.md +++ b/Xamarin/Chips/Overview.md @@ -1,23 +1,23 @@ --- -layout : post -title: About Xamarin Chips control | Syncfusion -description: Learn here all about introduction of Syncfusion Essential Studio® Xamarin Chips control, its elements and more. -platform : xamarin -control : Chips -documentation : ug +layout: post +title: About Xamarin Chips Control | Syncfusion +description: Learn all about the introduction of Syncfusion Essential Studio® Xamarin Chips control, its elements, and more. +platform: Xamarin +control: Chips +documentation: User Guide --- # Xamarin Chips Overview -The chips control for Xamarin.Forms presents information in an interactive and customizable layout. It also arranges multiple chips in a user-preferred layout and groups them to make selections. +The Chips control for Xamarin.Forms presents information in an interactive and customizable layout. It enables the arrangement of multiple chips in a user-preferred layout and groups them to facilitate selections. ## Key Features -* Supports using StackLayout, FlexLayout, Grid, AbsoluteLayout, and RelativeLayout as a layout for adding and arranging chips. -* Provides options to choose from four different types: Input, Choice, Filter, and Action, each chip has different behavior as a group. -* Allows you make single and multiple selections in the Choice and Filter chips, respectively. -* Provides a way to add a view at the end of the group using the Input type chips. -* Has Command support for the chip group and individual chips in Action chips type. -* Provides user-friendly customization support to customize the corner radius, border color, border thickness, text color, background color, close button color, selection indicator color, etc. +* Supports using StackLayout, FlexLayout, Grid, AbsoluteLayout, and RelativeLayout to add and arrange chips. +* Offers options for four different types: Input, Choice, Filter, and Action, with each type exhibiting different behavior as a group. +* Allows single and multiple selections in Choice and Filter chips, respectively. +* Provides a way to add a view at the end of the group using Input type chips. +* Includes command support for the chip group and individual chips in the Action chips type. +* Offers user-friendly customization support to adjust the corner radius, border color, border thickness, text color, background color, close button color, selection indicator color, and more. -![overview of chips control](images/overview-image/chip_overview_image.png) \ No newline at end of file +![Overview of Chips Control](images/overview-image/chip_overview_image.png) diff --git a/Xamarin/Chips/Populating-chips-item.md b/Xamarin/Chips/Populating-chips-item.md index 41a310f6f..072a85588 100644 --- a/Xamarin/Chips/Populating-chips-item.md +++ b/Xamarin/Chips/Populating-chips-item.md @@ -1,24 +1,23 @@ --- layout: post -title: Populating Items in Xamarin Chips control | Syncfusion -description: Learn about Populating Items support in Syncfusion Essential Studio® Xamarin Chips control, its elements and more. -platform: xamarin +title: Populating Items in Xamarin Chips Control | Syncfusion +description: Learn about populating items support in Syncfusion Essential Studio® Xamarin Chips control, its elements, and more. +platform: Xamarin control: Chips documentation: ug --- # Populating Items in Xamarin Chips -Chips can be populated with either business objects and SfChip. This section explain how to populate the chips control with business objects and SfChip. +Chips can be populated with either business objects or SfChip instances. This section explains how to populate the Chips control with both business objects and SfChip instances. -## Populating business objects as items +## Populating Business Objects as Items -Business objects can be populated in Chips using the `ItemsSource` property. -Refer to this [documentation](https://help.syncfusion.com/xamarin/chips/getting-started#set-layout-for-the-control) to know more details about populating the chips control with list of employee details. +Business objects can be populated in Chips using the `ItemsSource` property. Refer to this [documentation](https://help.syncfusion.com/xamarin/chips/getting-started#set-layout-for-the-control) for more details about populating the Chips control with a list of employee details. -## Populating SfChip as items +## Populating SfChip as Items -Chips control also provides support to create and set [`SfChip`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChip.html) as item. It can be achieved using the [`Items`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipGroup.html#Syncfusion_XForms_Buttons_SfChipGroup_Items) property. +The Chips control also provides support to create and set [`SfChip`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChip.html) as an item. This can be achieved using the [`Items`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipGroup.html#Syncfusion_XForms_Buttons_SfChipGroup_Items) property. {% tabs %} @@ -75,8 +74,8 @@ namespace Chips {% endtabs %} -![Collection of items to chip group](images/items/chips_items.png) +![Collection of Items to Chip Group](images/items/chips_items.png) -## See also +## See Also -[How to bind remote JSON data to Xamarin.Forms chip group (SfChipGroup)](https://support.syncfusion.com/kb/article/9880/how-to-bind-remote-json-data-to-xamarin-forms-chip-group-sfchipgroup) +- [How to bind remote JSON data to Xamarin.Forms chip group (SfChipGroup)](https://support.syncfusion.com/kb/article/9880/how-to-bind-remote-json-data-to-xamarin-forms-chip-group-sfchipgroup) diff --git a/Xamarin/Chips/Types.md b/Xamarin/Chips/Types.md index 97b209cd7..b6932eec5 100644 --- a/Xamarin/Chips/Types.md +++ b/Xamarin/Chips/Types.md @@ -1,30 +1,30 @@ --- layout: post -title: Chips Types in Xamarin Chips control | Syncfusion -description: Learn about Chips Types support in Syncfusion Essential Studio® Xamarin Chips control, its elements and more. -platform: xamarin +title: Chips Types in Xamarin Chips Control | Syncfusion +description: Learn about Chips Types support in Syncfusion Essential Studio® Xamarin Chips control, its elements, and more. +platform: Xamarin control: Chips documentation: ug --- # Chips Types in Xamarin Chips -The functionality of chips control differs based on the [`Type`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipGroup.html#Syncfusion_XForms_Buttons_SfChipGroup_Type) property. No operation can be performed in a chip group unless the [`Type`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipGroup.html#Syncfusion_XForms_Buttons_SfChipGroup_Type) property is set. The chips control provides four different types, and each has its own functionality. Default value of [`Type`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipGroup.html#Syncfusion_XForms_Buttons_SfChipGroup_Type) is [`Input`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipsType.html#Syncfusion_XForms_Buttons_SfChipsType_Input). The types are, +The functionality of the Chips control differs based on its [`Type`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipGroup.html#Syncfusion_XForms_Buttons_SfChipGroup_Type) property. No operation can be performed in a chip group unless the [`Type`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipGroup.html#Syncfusion_XForms_Buttons_SfChipGroup_Type) property is set. The Chips control provides four different types, each with its unique functionality. The default value of [`Type`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipGroup.html#Syncfusion_XForms_Buttons_SfChipGroup_Type) is [`Input`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipsType.html#Syncfusion_XForms_Buttons_SfChipsType_Input). The types are: * [`Input`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipsType.html#Syncfusion_XForms_Buttons_SfChipsType_Input) * [`Choice`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipsType.html#Syncfusion_XForms_Buttons_SfChipsType_Choice) * [`Filter`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipsType.html#Syncfusion_XForms_Buttons_SfChipsType_Filter) * [`Action`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipsType.html#Syncfusion_XForms_Buttons_SfChipsType_Action) -N> Chips are arranged in [ChipLayout](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipGroup.html#Syncfusion_XForms_Buttons_SfChipGroup_ChipLayout), which is a type of [layout](https://docs.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/controls/layouts#layouts-with-multiple-children). StackLayout with horizontal orientation is a default type of [ChipLayout](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipGroup.html#Syncfusion_XForms_Buttons_SfChipGroup_ChipLayout). +> **Note:** Chips are arranged in a [ChipLayout](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipGroup.html#Syncfusion_XForms_Buttons_SfChipGroup_ChipLayout), which is a type of [layout](https://docs.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/controls/layouts#layouts-with-multiple-children). `StackLayout` with horizontal orientation is the default type of `ChipLayout`. ## Input -Arranges the chips in a layout and enables the close button for each chip. Using the close button, a chip can be removed from children and layout as well. Additionally, it has support to add an option [`InputView`](https://help.syncfusion.com/xamarin/chips/customization#inputview) at the end of the layout, from which users can obtain the chip text for creating a chip at run time. +This type arranges the chips in a layout and enables the close button for each chip. Using the close button, a chip can be removed from both the children and layout. Additionally, it supports adding an [`InputView`](https://help.syncfusion.com/xamarin/chips/customization#inputview) at the end of the layout, from which users can obtain the chip text for creating a chip at runtime. -N> The [`InputView`](https://help.syncfusion.com/xamarin/chips/customization#inputview) is supported only in [`Input`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipsType.html#Syncfusion_XForms_Buttons_SfChipsType_Input) type. +> **Note:** The [`InputView`](https://help.syncfusion.com/xamarin/chips/customization#inputview) is supported only in the [`Input`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfChipsType.html#Syncfusion_XForms_Buttons_SfChipsType_Input) type. -The following code illustrates how to get an input type chip. +The following code snippet illustrates how to implement an input type chip: {% highlight xaml %} For iOS, you should be added a custom font file in the info.plist file as demonstrated in below. +> Note: For iOS, you must add the custom font file in the `info.plist` file as demonstrated below. {% tabs %} @@ -36,8 +35,7 @@ N> For iOS, you should be added a custom font file in the info.plist file as dem {% endtabs %} - -Create the instance for `FontImageSource` and set to [`ImageSource`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_ImageSource) property of SfChip as shown in the below code snippet. +Create an instance of `FontImageSource` and set it to the [`ImageSource`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfButton.html#Syncfusion_XForms_Buttons_SfButton_ImageSource) property of SfChip, as shown in the code snippet below. {% tabs %} @@ -91,7 +89,6 @@ Create the instance for `FontImageSource` and set to [`ImageSource`](https://hel {% endtabs %} +> Note: FontImageSource is supported from Xamarin.Forms version 3.6 onwards. -N> FontImageSource supported from Xamarin.Forms version 3.6 onwards. - -![Xamarin.Forms chip group icon font support](images/FontIcon.png) \ No newline at end of file +![Xamarin.Forms Chip Group Icon Font Support](images/FontIcon.png) diff --git a/Xamarin/Radio-Button/Event.md b/Xamarin/Radio-Button/Event.md index e31c2dae3..2355b8086 100644 --- a/Xamarin/Radio-Button/Event.md +++ b/Xamarin/Radio-Button/Event.md @@ -1,8 +1,8 @@ --- layout: post -title: Event in Xamarin Radio Button control | Syncfusion -description: Learn here all about Event support in Syncfusion Xamarin Radio Button (SfRadioButton) control and more. -platform: xamarin +title: Event in Xamarin Radio Button Control | Syncfusion +description: Learn about event support in Syncfusion Xamarin Radio Button (SfRadioButton) control and more. +platform: Xamarin control: SfRadioButton documentation: ug keywords: button, SfRadioButton, RadioButton @@ -11,11 +11,11 @@ keywords: button, SfRadioButton, RadioButton # Event in Xamarin Radio Button (SfRadioButton) -## StateChanged event +## StateChanged Event -Occurs when the value(state) of the [`IsChecked`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ToggleButton.html#Syncfusion_XForms_Buttons_ToggleButton_IsChecked) property is changed by either touching the check box or setting the value to the [`IsChecked`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ToggleButton.html#Syncfusion_XForms_Buttons_ToggleButton_IsChecked) property using XAML or C# code. The event arguments are of type [`StateChangedEventArgs`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.StateChangedEventArgs.html) and expose the following property: +The `StateChanged` event occurs when the value (state) of the [`IsChecked`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ToggleButton.html#Syncfusion_XForms_Buttons_ToggleButton_IsChecked) property changes. This change can occur either through user interaction with the radio button or by programmatically setting the value using XAML or C# code. The event arguments are of type [`StateChangedEventArgs`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.StateChangedEventArgs.html) and expose the following property: -* [`IsChecked`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ToggleButton.html#Syncfusion_XForms_Buttons_ToggleButton_IsChecked): The new value(state) of the [`IsChecked`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ToggleButton.html#Syncfusion_XForms_Buttons_ToggleButton_IsChecked) property. +* [`IsChecked`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ToggleButton.html#Syncfusion_XForms_Buttons_ToggleButton_IsChecked): Represents the new value (state) of the `IsChecked` property. {% tabs %} {% highlight xaml %} @@ -68,8 +68,8 @@ private void RadioButton_StateChanged(object sender, StateChangedEventArgs e) This demo can be downloaded from this [link](https://www.syncfusion.com/downloads/support/directtrac/general/ze/RadioButton_Event1787482656). -## See also +## See Also -[How to notify the selection changes in Xamarin.Forms radio button (SfRadioButton)](https://support.syncfusion.com/kb/article/9544/how-to-notify-the-selection-changes-in-xamarin-forms-radiobutton-sfradiobutton) +- [How to notify the selection changes in Xamarin.Forms radio button (SfRadioButton)](https://support.syncfusion.com/kb/article/9544/how-to-notify-the-selection-changes-in-xamarin-forms-radiobutton-sfradiobutton) -[How to get the selected Xamarin.Forms radio button (SfRadioButton)](https://support.syncfusion.com/kb/article/9506/how-to-get-the-selected-xamarinforms-radio-button) +- [How to get the selected Xamarin.Forms radio button (SfRadioButton)](https://support.syncfusion.com/kb/article/9506/how-to-get-the-selected-xamarinforms-radio-button) diff --git a/Xamarin/Radio-Button/Getting-Started.md b/Xamarin/Radio-Button/Getting-Started.md index d0561c883..59f379ca3 100644 --- a/Xamarin/Radio-Button/Getting-Started.md +++ b/Xamarin/Radio-Button/Getting-Started.md @@ -1,8 +1,8 @@ --- layout: post -title: Getting Started with Xamarin Radio Button control | Syncfusion -description: Learn here about getting started with Syncfusion Xamarin Radio Button (SfRadioButton) control, its elements and more. -platform: xamarin +title: Getting Started with Xamarin Radio Button Control | Syncfusion +description: Learn how to get started with Syncfusion Xamarin Radio Button (SfRadioButton) control, including its elements and more. +platform: Xamarin control: SfRadioButton documentation: ug keywords: button, SfRadioButton, RadioButton @@ -11,37 +11,37 @@ keywords: button, SfRadioButton, RadioButton # Getting Started with Xamarin Radio Button (SfRadioButton) -This section explains the steps required to configure the [Xamarin Radio Button](https://www.syncfusion.com/xamarin-ui-controls/xamarin-radio-button) (SfRadioButton) control in a real-time scenario and provides a walk-through on some of the customization features available in [`SfRadioButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfRadioButton.html) control. +This section explains the steps required to configure the [Xamarin Radio Button](https://www.syncfusion.com/xamarin-ui-controls/xamarin-radio-button) (SfRadioButton) control in a real-time scenario and provides a walkthrough of some of the customization features available in [`SfRadioButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfRadioButton.html). -## Assembly deployment +## Assembly Deployment -After installing [Essential Studio® for Xamarin](https://www.syncfusion.com/downloads/xamarin), you can find all the required assemblies in the installation folders, {Syncfusion Essential Studio Installed location} \Essential Studio\\{Version #}\Xamarin\lib. +After installing [Essential Studio® for Xamarin](https://www.syncfusion.com/downloads/xamarin), you can find all the required assemblies in the installation folders at `{Syncfusion Essential Studio Installed location}\Essential Studio\{Version #}\Xamarin\lib`. E.g.: C:\Program Files (x86) \Syncfusion\Essential Studio\19.1.0.54\Xamarin\lib -N> Assemblies can be found in unzipped package location(Documents/Syncfusion/{Version #}/Xamarin/lib) in Mac. +> **Note:** Assemblies can be found in the unzipped package location (Documents/Syncfusion/{Version #}/Xamarin/lib) on a Mac. -## Adding SfRadioButton reference +## Adding SfRadioButton Reference -You can add [`SfRadioButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfRadioButton.html) reference using one of the following methods: +You can add a reference to [`SfRadioButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfRadioButton.html) using one of the following methods: -**Method 1: Adding SfRadioButton reference from nuget.org** +### Method 1: Adding SfRadioButton Reference from nuget.org -Syncfusion Xamarin components are available in [nuget.org](https://www.nuget.org/). To add SfRadioButton to your project, open the NuGet package manager in Visual Studio, search for [Syncfusion.Xamarin.Buttons](https://www.nuget.org/packages/Syncfusion.Xamarin.Buttons), and then install it. +Syncfusion Xamarin components are available on [nuget.org](https://www.nuget.org/). To add SfRadioButton to your project, open the NuGet package manager in Visual Studio, search for [Syncfusion.Xamarin.Buttons](https://www.nuget.org/packages/Syncfusion.Xamarin.Buttons), and then install it. -![Adding SfRadioButton reference from NuGet](Images/Adding SfRadioButton reference.png) +![Adding SfRadioButton Reference from NuGet](Images/Adding SfRadioButton reference.png) -N> -* Install the same version of SfRadioButton NuGet in all the projects. -* In addition, you need to install the [Syncfusion.Xamarin.Buttons.WPF]() package for Xamarin.Forms WPF platform only. +> **Note:** +> - Install the same version of SfRadioButton NuGet in all the projects. +> - Additionally, you need to install the [Syncfusion.Xamarin.Buttons.WPF]() package for Xamarin.Forms WPF platforms only. -**Method 2: Adding SfRadioButton reference from toolbox** +### Method 2: Adding SfRadioButton Reference from Toolbox -Syncfusion also provides Xamarin Toolbox. Using this toolbox, you can drag the [`SfRadioButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfRadioButton.html) control to the XAML page. It will automatically install the required [NuGet packages](https://help.syncfusion.com/xamarin/visual-studio-integration/nuget-packages) and add the namespace to the page. To install Syncfusion Xamarin Toolbox, refer to [Toolbox](https://help.syncfusion.com/xamarin/utility#toolbox). +Syncfusion also provides the Xamarin Toolbox. Using this toolbox, you can drag the [`SfRadioButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfRadioButton.html) control to the XAML page. It will automatically install the required [NuGet packages](https://help.syncfusion.com/xamarin/visual-studio-integration/nuget-packages) and add the namespace to the page. To install Syncfusion Xamarin Toolbox, refer to [Toolbox](https://help.syncfusion.com/xamarin/utility#toolbox). -**Method 3: Adding SfRadioButton assemblies manually from the installed location** +### Method 3: Adding SfRadioButton Assemblies Manually from the Installed Location -If you prefer to manually reference the assemblies instead referencing from NuGet, add the following assemblies in respective projects. +If you prefer to manually reference the assemblies instead of referencing them from NuGet, add the following assemblies to the respective projects. Location: {Installed location}/{version}/Xamarin/lib diff --git a/Xamarin/Radio-Button/Grouping.md b/Xamarin/Radio-Button/Grouping.md index 92551713e..22f9850e8 100644 --- a/Xamarin/Radio-Button/Grouping.md +++ b/Xamarin/Radio-Button/Grouping.md @@ -1,8 +1,8 @@ --- layout: post -title: Grouping in Xamarin Radio Button control | Syncfusion -description: Learn here all about Grouping support in Syncfusion Xamarin Radio Button (SfRadioButton) control and more. -platform: xamarin +title: Grouping in Xamarin Radio Button Control | Syncfusion +description: Learn about grouping support in Syncfusion Xamarin Radio Button (SfRadioButton) control and more. +platform: Xamarin control: SfRadioButton documentation: ug keywords: button, SfRadioButton, RadioButton, SfRadioGroup, GroupKey @@ -13,9 +13,9 @@ keywords: button, SfRadioButton, RadioButton, SfRadioGroup, GroupKey ## Group Key -The [`GroupKey`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfRadioButton.html#Syncfusion_XForms_Buttons_SfRadioButton_GroupKey) in [`SfRadioButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfRadioButton.html) allows you to group a set of radio buttons present inside any layout. By grouping in this way, you can select only one radio button that comes under same [`GroupKey`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfRadioButton.html#Syncfusion_XForms_Buttons_SfRadioButton_GroupKey) at a time. +The [`GroupKey`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfRadioButton.html#Syncfusion_XForms_Buttons_SfRadioButton_GroupKey) property in [`SfRadioButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfRadioButton.html) allows you to group a set of radio buttons within any layout. Grouping enables the selection of only one radio button that falls under the same `GroupKey` at any given time. -* [`CheckedItem`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfRadioGroupKey.html#Syncfusion_XForms_Buttons_SfRadioGroupKey_CheckedItem) - Gets the current checked item from radio group. +* [`CheckedItem`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfRadioGroupKey.html#Syncfusion_XForms_Buttons_SfRadioGroupKey_CheckedItem): Retrieves the currently selected item from the radio group. {% tabs %} {% highlight xaml %} @@ -60,16 +60,16 @@ flexLayout.Children.Add(volvo); ![GroupKey support for SfRadioButton](Images/GroupKey.png) -### CheckedChanged event +### CheckedChanged Event -The [`CheckedChanged`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfRadioGroupKey.html#Syncfusion_XForms_Buttons_SfRadioGroupKey_CheckedChanged) event of [`SfRadioGroupKey`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfRadioGroupKey.html) occurs when a checked item is changed. The argument contains the following information: +The [`CheckedChanged`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfRadioGroupKey.html#Syncfusion_XForms_Buttons_SfRadioGroupKey_CheckedChanged) event of [`SfRadioGroupKey`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfRadioGroupKey.html) occurs when the selected item changes. The argument includes: -* [`PreviousItem`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.CheckedChangedEventArgs.html#Syncfusion_XForms_Buttons_CheckedChangedEventArgs_PreviousItem) – Gets the previously checked radio button from group. -* [`CurrentItem`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.CheckedChangedEventArgs.html#Syncfusion_XForms_Buttons_CheckedChangedEventArgs_CurrentItem) – Gets the currently checked radio button from group. +* [`PreviousItem`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.CheckedChangedEventArgs.html#Syncfusion_XForms_Buttons_CheckedChangedEventArgs_PreviousItem): Retrieves the previously selected radio button from the group. +* [`CurrentItem`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.CheckedChangedEventArgs.html#Syncfusion_XForms_Buttons_CheckedChangedEventArgs_CurrentItem): Retrieves the currently selected radio button from the group. ## SfRadioGroup -[`SfRadioGroup`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfRadioGroup.html) is a container that contains a set of radio buttons. When you select a radio button in a radio group, all other items will be deselected automatically. At a time, you can select only one radio button from the same radio group. It also contains the [`CheckedChanged`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfRadioGroup.html#Syncfusion_XForms_Buttons_SfRadioGroup_CheckedChanged) event and the [`CheckedItem`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfRadioGroup.html#Syncfusion_XForms_Buttons_SfRadioGroup_CheckedItem) property. +[`SfRadioGroup`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfRadioGroup.html) is a container that houses a set of radio buttons. Selecting a radio button in a group will automatically deselect all other items, allowing only one selected option at a time. It also features the [`CheckedChanged`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfRadioGroup.html#Syncfusion_XForms_Buttons_SfRadioGroup_CheckedChanged) event and the [`CheckedItem`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfRadioGroup.html#Syncfusion_XForms_Buttons_SfRadioGroup_CheckedItem) property. {% tabs %} {% highlight xaml %} @@ -99,7 +99,7 @@ radioGroup.Children.Add(creditCard); ### Orientation in SfRadioGroup -[`SfRadioGroup`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfRadioGroup.html) supports horizontal and vertical orientations. By default, [`SfRadioGroup`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfRadioGroup.html) is rendered with vertical orientation. You can the change the orientation by using the [`Orientation`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SwitchOrientation.html) property. +[`SfRadioGroup`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfRadioGroup.html) supports both horizontal and vertical orientations. By default, it is rendered in vertical orientation. You can change the orientation using the [`Orientation`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SwitchOrientation.html) property. {% tabs %} {% highlight xaml %} @@ -125,8 +125,8 @@ radioGroup.Children.Add(creditCard); {% endhighlight %} {% endtabs %} -![RadioGroup horizontal orientation](Images/Orientation.png) +![RadioGroup Horizontal Orientation](Images/Orientation.png) -## See also +## See Also -[How to get the selected Xamarin.Forms radio button (SfRadioButton)](https://support.syncfusion.com/kb/article/9506/how-to-get-the-selected-xamarin-forms-radiobutton) +- [How to get the selected Xamarin.Forms radio button (SfRadioButton)](https://support.syncfusion.com/kb/article/9506/how-to-get-the-selected-xamarin-forms-radiobutton) diff --git a/Xamarin/Radio-Button/Overview.md b/Xamarin/Radio-Button/Overview.md index 3a0087a4d..d668f2bc6 100644 --- a/Xamarin/Radio-Button/Overview.md +++ b/Xamarin/Radio-Button/Overview.md @@ -1,8 +1,8 @@ --- layout: post -title: About Xamarin Radio Button control | Syncfusion -description: Learn here all about introduction of Syncfusion Xamarin Radio Button (SfRadioButton) control, its elements and more. -platform: xamarin +title: About Xamarin Radio Button Control | Syncfusion +description: Learn about the introduction of Syncfusion Xamarin Radio Button (SfRadioButton) control, its elements, and more. +platform: Xamarin control: SfRadioButton documentation: ug keywords: button, SfRadioButton, RadioButton @@ -11,11 +11,11 @@ keywords: button, SfRadioButton, RadioButton # Xamarin Radio Button (SfRadioButton) Overview -The radio button is a selection control that allows users to select one option from a set. The two states of radio button are checked and unchecked. +The radio button is a selection control that allows users to choose one option from a set. The two states of a radio button are checked and unchecked. -## Key features - -* Allow users to select and clear the control by tapping. -* Supports radio button color and label text customization. +## Key Features +* Enable users to select and clear the control by tapping. +* Support customization of radio button color and label text. ![RadioButton Image](Images/RadioButton_Overview.png) + diff --git a/Xamarin/Radio-Button/Visual-Customization.md b/Xamarin/Radio-Button/Visual-Customization.md index a61f7eb8b..fe3e2e4c0 100644 --- a/Xamarin/Radio-Button/Visual-Customization.md +++ b/Xamarin/Radio-Button/Visual-Customization.md @@ -1,8 +1,8 @@ --- layout: post -title: Visual Customization in Xamarin Radio Button control | Syncfusion -description: Learn here all about Visual Customization support in Syncfusion Xamarin Radio Button (SfRadioButton) control and more. -platform: xamarin +title: Visual Customization in Xamarin Radio Button Control | Syncfusion +description: Learn about visual customization support in Syncfusion Xamarin Radio Button (SfRadioButton) control and more. +platform: Xamarin control: SfRadioButton documentation: ug keywords: button, SfRadioButton, RadioButton @@ -12,8 +12,8 @@ keywords: button, SfRadioButton, RadioButton # Visual Customization in Xamarin Radio Button (SfRadioButton) -## Customizing a state color -The default state colors can be customized using the [`CheckedColor`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ToggleButton.html#Syncfusion_XForms_Buttons_ToggleButton_CheckedColor) and [`UncheckedColor`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ToggleButton.html#Syncfusion_XForms_Buttons_ToggleButton_UncheckedColor) properties. The checked state color is updated to the [`CheckedColor`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ToggleButton.html#Syncfusion_XForms_Buttons_ToggleButton_CheckedColor) property value when the state is changed to the checked. The unchecked state color is updated to the [`UncheckedColor`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ToggleButton.html#Syncfusion_XForms_Buttons_ToggleButton_UncheckedColor) property value when the state is changed to unchecked. +## Customizing the State Color +The default state colors can be customized using the [`CheckedColor`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ToggleButton.html#Syncfusion_XForms_Buttons_ToggleButton_CheckedColor) and [`UncheckedColor`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ToggleButton.html#Syncfusion_XForms_Buttons_ToggleButton_UncheckedColor) properties. The checked state color is updated to the `CheckedColor` property value when the state changes to checked. The unchecked state color is updated to the `UncheckedColor` property value when the state changes to unchecked. {% tabs %} {% highlight xaml %} @@ -64,17 +64,17 @@ radioGroup.Children.Add(uncheck); ![RadioButton BorderWidth](Images/BorderWidth.png) -N> BorderWidth support has not been provided for Android Platform. +> **Note:** BorderWidth support is not provided for the Android platform. -## Setting a caption text appearance +## Setting Caption Text Appearance You can customize the display text appearance of the [`SfRadioButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfRadioButton.html) control using the following properties: -* [`TextColor`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ToggleButton.html#Syncfusion_XForms_Buttons_ToggleButton_TextColor) : Changes the color of the text. +* [`TextColor`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ToggleButton.html#Syncfusion_XForms_Buttons_ToggleButton_TextColor): Changes the color of the text. * [`HorizontalTextAlignment`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ToggleButton.html#Syncfusion_XForms_Buttons_ToggleButton_HorizontalTextAlignment): Changes the horizontal alignment of the caption text. * [`FontFamily`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ToggleButton.html#Syncfusion_XForms_Buttons_ToggleButton_FontFamily): Changes the font family of the caption text. -* [`FontAttributes`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ToggleButton.html#Syncfusion_XForms_Buttons_ToggleButton_FontAttributes): Sets font attributes(bold/italic/none) of the caption text. -* [`FontSize`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ToggleButton.html#Syncfusion_XForms_Buttons_ToggleButton_FontSize): Sets font size of the caption text. +* [`FontAttributes`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ToggleButton.html#Syncfusion_XForms_Buttons_ToggleButton_FontAttributes): Sets font attributes (bold/italic/none) of the caption text. +* [`FontSize`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ToggleButton.html#Syncfusion_XForms_Buttons_ToggleButton_FontSize): Sets the font size of the caption text. {% tabs %} @@ -96,20 +96,20 @@ radioButton.FontSize = 20; ![RadioButton TextAppereance](Images/CaptionAppereance.png) ## LineBreakMode -The [`LineBreakMode`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ToggleButton.html#Syncfusion_XForms_Buttons_ToggleButton_LineBreakMode) allows you to wrap or truncate the text. The default value of this property is [`NoWrap`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.LineBreakMode.html#Syncfusion_XForms_Buttons_LineBreakMode_NoWrap). The following other options are available in [`LineBreakMode`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ToggleButton.html#Syncfusion_XForms_Buttons_ToggleButton_LineBreakMode): +The [`LineBreakMode`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ToggleButton.html#Syncfusion_XForms_Buttons_ToggleButton_LineBreakMode) property allows you to wrap or truncate the text. The default value is [`NoWrap`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.LineBreakMode.html#Syncfusion_XForms_Buttons_LineBreakMode_NoWrap). Other available options include: - * [`NoWrap`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.LineBreakMode.html#Syncfusion_XForms_Buttons_LineBreakMode_NoWrap) - Avoids the text wrap. - * [`WordWrap`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.LineBreakMode.html#Syncfusion_XForms_Buttons_LineBreakMode_WordWrap) - Wraps the text by words. - * [`CharacterWrap`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.LineBreakMode.html#Syncfusion_XForms_Buttons_LineBreakMode_CharacterWrap) - Wraps the text by character. - * [`HeadTruncation`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.LineBreakMode.html#Syncfusion_XForms_Buttons_LineBreakMode_HeadTruncation) - Truncates the text at the start. - * [`MiddleTruncation`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.LineBreakMode.html#Syncfusion_XForms_Buttons_LineBreakMode_MiddleTruncation) - Truncates the text at the center. - * [`TailTruncation`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.LineBreakMode.html#Syncfusion_XForms_Buttons_LineBreakMode_TailTruncation) - Truncates the text at the end. +* [`NoWrap`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.LineBreakMode.html#Syncfusion_XForms_Buttons_LineBreakMode_NoWrap): Avoids text wrapping. +* [`WordWrap`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.LineBreakMode.html#Syncfusion_XForms_Buttons_LineBreakMode_WordWrap): Wraps text by words. +* [`CharacterWrap`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.LineBreakMode.html#Syncfusion_XForms_Buttons_LineBreakMode_CharacterWrap): Wraps text by character. +* [`HeadTruncation`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.LineBreakMode.html#Syncfusion_XForms_Buttons_LineBreakMode_HeadTruncation): Truncates text at the start. +* [`MiddleTruncation`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.LineBreakMode.html#Syncfusion_XForms_Buttons_LineBreakMode_MiddleTruncation): Truncates text at the center. +* [`TailTruncation`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.LineBreakMode.html#Syncfusion_XForms_Buttons_LineBreakMode_TailTruncation): Truncates text at the end. -This demo can be downloaded from this [link](https://www.syncfusion.com/downloads/support/directtrac/general/ze/RadioButton_VisualCustomization1644131704). +This demo can be downloaded from this [link](https://www.syncfusion.[REDACTED]RadioButton_VisualCustomization1644131704). -## Size customization +## Size Customization -The [`ControlSize`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ToggleButton.html#Syncfusion_XForms_Buttons_ToggleButton_ControlSize) property is used to customize the [`RadioButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfRadioButton.html) control size. +The [`ControlSize`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ToggleButton.html#Syncfusion_XForms_Buttons_ToggleButton_ControlSize) property is used to customize the size of the [`RadioButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfRadioButton.html) control. {% tabs %} {% highlight xaml %} @@ -126,9 +126,8 @@ stackLayout.Children.Add(radioButton); {% endhighlight %} {% endtabs %} -N>[`ControlSize`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ToggleButton.html#Syncfusion_XForms_Buttons_ToggleButton_ControlSize) is not applicable for Android Platform. +> **Note:** [`ControlSize`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ToggleButton.html#Syncfusion_XForms_Buttons_ToggleButton_ControlSize) is not applicable on the Android platform. -## See also - -[How to wrap text in Xamarin.Forms radio button (SfRadioButton)](https://support.syncfusion.com/kb/article/10289/how-to-wrap-text-in-xamarin-forms-radiobutton) +## See Also +- [How to wrap text in Xamarin.Forms radio button (SfRadioButton)](https://support.syncfusion.com/kb/article/10289/how-to-wrap-text-in-xamarin-forms-radiobutton) diff --git a/Xamarin/Radio-Button/VisualStates.md b/Xamarin/Radio-Button/VisualStates.md index 1743bc667..7af5949ae 100644 --- a/Xamarin/Radio-Button/VisualStates.md +++ b/Xamarin/Radio-Button/VisualStates.md @@ -1,15 +1,15 @@ --- layout: post -title: Visual States in Xamarin Radio Button control | Syncfusion -description: Learn here all about Visual States support in Syncfusion Xamarin Radio Button (SfRadioButton) control and more. -platform: xamarin +title: Visual States in Xamarin Radio Button Control | Syncfusion +description: Learn about visual states support in Syncfusion Xamarin Radio Button (SfRadioButton) control and more. +platform: Xamarin control: SfRadioButton documentation: ug --- # Visual States in Xamarin Radio Button (SfRadioButton) -The visual of Radio Button can be customized using `VisualStates`. The [`SfRadioButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfRadioButton.html) control contains the following two visual states: +The visual appearance of the Radio Button can be customized using `VisualStates`. The [`SfRadioButton`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfRadioButton.html) control features the following two visual states: * Checked * Unchecked @@ -72,8 +72,8 @@ VisualStateManager.SetVisualStateGroups(radioButton, visualStateGroupList); {% endhighlight %} {% endtabs %} -**Checked visual state:** +**Checked Visual State:** ![SfRadioButton with visual state of checked state](images/RadioButton_VisualState_Checked.png) -**Unchecked visual state:** +**Unchecked Visual State:** ![SfRadioButton with visual state of unchecked state](images/RadioButton_VisualState_Unchecked.png) diff --git a/Xamarin/Segmented-Control/Accessibility.md b/Xamarin/Segmented-Control/Accessibility.md index d70ad8d34..ac306c108 100644 --- a/Xamarin/Segmented-Control/Accessibility.md +++ b/Xamarin/Segmented-Control/Accessibility.md @@ -1,7 +1,7 @@ --- layout: post title: Accessibility in Xamarin Segmented Control | Syncfusion® -description: Learn here all about Accessibility support in Syncfusion® Xamarin Segmented Control (SfSegmentedControl) and more. +description: Explore comprehensive details about the accessibility support in Syncfusion® Xamarin Segmented Control (SfSegmentedControl). platform: Xamarin control: SfSegmentedControl documentation: ug @@ -9,7 +9,7 @@ documentation: ug # Accessibility in Xamarin Segmented Control (SfSegmentedControl) -The segmented control supports automating each segment item in control using the `AutomationId` property. The AutomationId value given for control will be appended with each segment item's text value, and it can be used for writing automation scripts. The following code snippet explains how to set AutomationId value to the segmented control. +The segmented control supports automation for each segment item by leveraging the `AutomationId` property. The specified `AutomationId` value for the control is appended with each segment item’s text, facilitating the creation of precise automation scripts. The code snippet below demonstrates the assignment of an `AutomationId` value to the segmented control. {% tabs %} @@ -46,7 +46,7 @@ public class ViewModel {% endtabs %} -The following table shows that the AutomationId value is set to each segment item in control for the above code snippet. +The table below illustrates the `AutomationId` value assigned to each segment item in the control, based on the code snippet provided: diff --git a/Xamarin/Segmented-Control/Customization.md b/Xamarin/Segmented-Control/Customization.md index fc3f00809..deb760327 100644 --- a/Xamarin/Segmented-Control/Customization.md +++ b/Xamarin/Segmented-Control/Customization.md @@ -1,7 +1,7 @@ --- layout: post title: Customization in Xamarin Segmented Control | Syncfusion® -description: Learn here all about Customization support in Syncfusion® Xamarin Segmented Control (SfSegmentedControl) and more. +description: Explore customization capabilities in Syncfusion® Xamarin Segmented Control (SfSegmentedControl). platform: Xamarin control: SegmentedControl documentation: ug @@ -9,15 +9,15 @@ documentation: ug # Customization in Xamarin Segmented Control (SfSegmentedControl) -The segmented control supports customizing segment color, text color, icon size, selection color, and more. This control also supports enabling the segments to fit your application’s theme. It can be customized in the following areas. +The segmented control supports customizing segment color, text color, icon size, selection color, and more. This control also allows segments to seamlessly integrate with your application's theme. Below are the areas that can be customized. -## Text appearance +## Text Appearance -The text inside the segmented control can be customized by its font size, color, and its font family. +The text within the segmented control can be tailored by adjusting its font size, color, and font family. -### Font family +### Font Family -You can customize the font family of the segmented item using the [`FontFamily`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_FontFamily) property. +Customize the font family of segmented items using the [`FontFamily`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_FontFamily) property. {% tabs %} @@ -45,9 +45,9 @@ Device.RuntimePlatform == Device.Android ? "Roboto" : "Helvetica"; {% endtabs %} -### Font color +### Font Color -You can customize the text color of the segmented item using the [`FontColor`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_FontColor) property. +Customize the text color of segmented items using the [`FontColor`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_FontColor) property. {% tabs %} @@ -67,9 +67,9 @@ segmentedControl.SelectionTextColor = Color.Red; ![Font color customization in segmented control](images/Customization/Xamarin_Forms_Fontcolor.png) -### Font size +### Font Size -You can change the text size of the segmented item using the [`FontSize`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_FontSize) property. +Change the text size of segmented items using the [`FontSize`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_FontSize) property. {% tabs %} @@ -91,11 +91,11 @@ segmentedControl.FontSize = 20; ## Border -You can customize the border by their color and thickness. +Customize the border by both color and thickness. -### Border color +### Border Color -You can customize the border color of all the items in the segmented control. +Adjust the border color for all items in the segmented control. {% tabs %} @@ -115,9 +115,9 @@ segmentedControl.BorderColor = Color.Red; ![Border color customization in segmented control](images/Customization/Xamarin_Forms_Bordercolor.png) -### Border thickness +### Border Thickness -You can customize the width of the border using the [`BorderThickness`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_BorderThickness) property. +Customize the border width using the [`BorderThickness`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_BorderThickness) property. {% tabs %} @@ -139,11 +139,11 @@ segmentedControl.BorderThickness = 5; ### Padding -The segmented control handles padding between the items. +The segmented control can handle padding between items. -#### Segment padding +#### Segment Padding -Spacing between the segmented items in the control can be customized using the [`SegmentPadding`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_SegmentPadding). +Customize the spacing between segmented items with the [`SegmentPadding`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_SegmentPadding). {% tabs %} @@ -163,13 +163,13 @@ segmentedControl.SegmentPadding = 15; ![Segment padding customization in segmented control](images/Customization/Xamarin_Forms_Padding.png) -### Corner radius +### Corner Radius -The segmented control provides corner radius support for the segmented items and strip. +The segmented control provides corner radius support for segmented items and strips. -#### Item radius +#### Item Radius -The segmented control customizes the corner radius for each segmented item. +Customize the corner radius for each segmented item. {% tabs %} @@ -189,9 +189,9 @@ segmentedControl.SegmentCornerRadius = 15; ![Segment corner radius customization in segmented control](images/Customization/Xamarin_Forms_ItemCornerRadius.png) -#### Selection strip radius +#### Selection Strip Radius -The segmented control customizes corner radius for selection strip using the [`CornerRadius`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_CornerRadius) inside the [`SelectionIndicatorSettings`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_SelectionIndicatorSettings) class. +Customize the corner radius for the selection strip using the [`CornerRadius`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_CornerRadius) within the [`SelectionIndicatorSettings`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_SelectionIndicatorSettings) class. {% tabs %} @@ -219,9 +219,9 @@ segmentedControl.SelectionIndicatorSettings = selectionIndicator; ![Selected segment corner radius customization in segmented control](images/Customization/Xamarin_Forms_SelectionstripRadius.png) -#### Control radius +#### Control Radius -The segmented control also handles corner radius for border line of the whole control. +The segmented control also supports the corner radius for the border line enclosing the entire control. {% tabs %} @@ -244,11 +244,11 @@ segmentedControl.CornerRadius = 15; ### Color -The segmented control allows users to customize the background color of the segmented items and background color of the control. +The segmented control allows users to customize the background color of segmented items and the control itself. -#### Item color +#### Item Color -You can customize the background color of each segmented item using the [`Color`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_Color) property in the [`SelectionIndicatorSettings`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_SelectionIndicatorSettings) class. +Customize the background color of each segmented item using the [`Color`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_Color) property within the [`SelectionIndicatorSettings`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_SelectionIndicatorSettings) class. {% tabs %} @@ -274,9 +274,9 @@ segmentedControl.SelectionIndicatorSettings = selectionIndicator; ![Segment item color customization in segmented control](images/Customization/Xamarin_Forms_ItemCornerRadius.png) -#### Control color +#### Control Color -You can customize the background color of the control by setting value for the [`Color`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_Color) property. +Customize the background color of the entire control by setting the [`Color`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_Color) property. {% tabs %} @@ -296,13 +296,13 @@ segmentedControl.Color = Color.FromHex("#02A0AE"); ![Segmented control color customization in segmented control](images/Customization/Xamarin_Forms_color.png) -## Scrolling in segmented control programmatically +## Scrolling in Segmented Control Programmatically -The SegmentedControl allows programmatic scrolling based on index and item using the [`ScrollTo`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_ScrollTo_System_Int32_Syncfusion_XForms_Buttons_ScrollToPosition_) methods mentioned as follows. +The segmented control supports programmatic scrolling using the [`ScrollTo`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_ScrollTo_System_Int32_Syncfusion_XForms_Buttons_ScrollToPosition_) methods as follows. ### ScrollTo(index, scrollToPosition) -This method is used to scroll the segment item based on given index and [`ScrollToPosition`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_ScrollToPosition) value. +This method scrolls the segment item based on a given index and [`ScrollToPosition`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_ScrollToPosition) value. {% tabs %} @@ -316,7 +316,7 @@ segmentedControl.ScrollTo(5, Syncfusion.XForms.Buttons.ScrollToPosition.Start); ### ScrollTo(item, scrollToPosition) -This method is used to scroll the segment item based on the given data or [`SfSegmentItem`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentItem.html) and [`ScrollToPosition`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_ScrollToPosition) value. +Scroll a segment item based on the given data or [`SfSegmentItem`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentItem.html) and [`ScrollToPosition`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_ScrollToPosition) value. {% tabs %} @@ -330,7 +330,7 @@ segmentedControl.ScrollTo(viewModel.Items[5], Syncfusion.XForms.Buttons.ScrollTo ## Segment Height -The Segmented control height can be customized using the [SegmentHeight](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_SegmentHeight) property as shown below +The segmented control height can be customized using the [SegmentHeight](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_SegmentHeight) property as shown below. {% tabs %} @@ -374,7 +374,7 @@ The Segmented control height can be customized using the [SegmentHeight](https:/ {% endtabs %} -Segment Height sample can be downloaded from this [link](https://github.com/SyncfusionExamples/how-to-customize-segment-contol-height-in-xamarin.forms). +A sample demonstrating segment height customization can be downloaded from this [link](https://github.com/SyncfusionExamples/how-to-customize-segment-contol-height-in-xamarin.forms). ![Segment Height customization in segmented control](images/Customization/Xamarin_Forms_SegmentHeight.png) diff --git a/Xamarin/Segmented-Control/Dealing-with-selection-changed.md b/Xamarin/Segmented-Control/Dealing-with-selection-changed.md index 1a2320fe4..bf51e60f1 100644 --- a/Xamarin/Segmented-Control/Dealing-with-selection-changed.md +++ b/Xamarin/Segmented-Control/Dealing-with-selection-changed.md @@ -1,21 +1,21 @@ --- layout: post title: Dealing with selection in Xamarin Segmented Control | Syncfusion® -description: Learn here all about Dealing with selection changed support in Syncfusion® Xamarin Segmented Control (SfSegmentedControl) and more. +description: Learn how to handle selection change in Syncfusion® Xamarin Segmented Control (SfSegmentedControl). platform: Xamarin control: SegmentedControl documentation: ug --- -# Dealing with selection changed in Xamarin Segmented Control +# Dealing with Selection Changed in Xamarin Segmented Control -The selection changed event occurs when there is a change from one segment item to another in the segmented control. It can be handled by two ways. +The selection changed event is triggered when there's a transition from one segment item to another within the segmented control. It can be managed in two ways. -## User interface +## User Interface -When users navigate from one item to another, selection is changed, so that the [`SelectedIndex`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_SelectedIndex) value is updated to the new index of the item. The segmented control provides the [`SelectionChanged`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_SelectionChanged) event, which is triggered when the selection is changed with the [`SelectionChangedEventArgs`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SelectionChangedEventArgs.html). +When users navigate from one item to another, the selection is updated, and the [`SelectedIndex`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_SelectedIndex) value reflects the new item index. The segmented control provides a [`SelectionChanged`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_SelectionChanged) event, which is triggered during selection change with the [`SelectionChangedEventArgs`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SelectionChangedEventArgs.html). -[`Index`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SelectionChangedEventArgs.html#Syncfusion_XForms_Buttons_SelectionChangedEventArgs_Index) - Gets the current index value of the selected item. +- [`Index`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SelectionChangedEventArgs.html#Syncfusion_XForms_Buttons_SelectionChangedEventArgs_Index): Retrieves the current index of the selected item. {% tabs %} @@ -37,9 +37,8 @@ void Handle_SelectionChanged(object sender, SelectionChangedEventArgs e) {% endtabs %} -## Selected Index through programmatically. - -Users can set the default value programmatically for the selection to be placed. The selection is updated based on the index value given for the [`SelectedIndex`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_SelectedIndex). +## Programmatically Setting the Selected Index +Users can programmatically set the default selection value. The selection updates based on the provided [`SelectedIndex`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_SelectedIndex) index. {% tabs %} @@ -57,12 +56,11 @@ segmentedControl.SelectedIndex = 2; {% endtabs %} +![Selection change illustration](images/Selection-changed/selectionchange.png) -![selectionchange](images/Selection-changed/selectionchange.png) - -## Event to command +## Event to Command -The SegmentedControl event can be converted into commands using [`Behaviors`](https://learn.microsoft.com/en-us/xamarin/xamarin-forms/app-fundamentals/behaviors/). To achieve this, create a command in the ViewModel class and use [`Behaviors`](https://learn.microsoft.com/en-us/xamarin/xamarin-forms/app-fundamentals/behaviors/) to associate it to the SegmentedControl event. +The SegmentedControl event can be converted into commands using [`Behaviors`](https://learn.microsoft.com/en-us/xamarin/xamarin-forms/app-fundamentals/behaviors/). To achieve this, create a command in the ViewModel class and use [`Behaviors`](https://learn.microsoft.com/en-us/xamarin/xamarin-forms/app-fundamentals/behaviors/) to link it to the SegmentedControl event. {% tabs %} @@ -125,8 +123,6 @@ The SegmentedControl event can be converted into commands using [`Behaviors`](ht {% endhighlight %} {% endtabs %} -Download the entire source code from GitHub [here](https://github.com/SyncfusionExamples/xamarin.forms-segmentedcontrol-with-event-to-command-behavior). - -For more information about the event to command behavior in Xamarin.Forms, please refer to [this](https://learn.microsoft.com/en-us/samples/xamarin/xamarin-forms-samples/behaviors-eventtocommandbehavior/) link. - +Download the complete source code from GitHub [here](https://github.com/SyncfusionExamples/xamarin.forms-segmentedcontrol-with-event-to-command-behavior). +For more information about event-to-command behavior in Xamarin.Forms, refer to [this link](https://learn.microsoft.com/en-us/samples/xamarin/xamarin-forms-samples/behaviors-eventtocommandbehavior/). diff --git a/Xamarin/Segmented-Control/Display-mode.md b/Xamarin/Segmented-Control/Display-mode.md index 92e463b59..36260f550 100644 --- a/Xamarin/Segmented-Control/Display-mode.md +++ b/Xamarin/Segmented-Control/Display-mode.md @@ -1,21 +1,21 @@ --- layout: post -title: Display mode in Xamarin Segmented Control | Syncfusion® -description: Learn here all about Display mode support in Syncfusion® Xamarin Segmented Control (SfSegmentedControl) and more. +title: Display Mode in Xamarin Segmented Control | Syncfusion® +description: Explore different display mode options in Syncfusion® Xamarin Segmented Control (SfSegmentedControl). platform: Xamarin control: SegmentedControl documentation: ug --- -# Display mode in Xamarin Segmented Control (SfSegmentedControl) +# Display Mode in Xamarin Segmented Control (SfSegmentedControl) -Depending on application, different scenarios may require for effective communication. The segmented control supports these three options: icons, text, or a combination of both. +Depending on the application, different scenarios may require varied display modes for effective communication. The segmented control supports three options: icons, text, or a combination of both. ## Text -Items populated in the segmented control will be displayed as text by default. +By default, items populated in the segmented control are displayed as text. -Add the following namespace for loading data collection in string. +Add the following namespace for loading data collections in string format: {% highlight xaml %} @@ -87,15 +87,15 @@ public SegmentedControlSample() {% endtabs %} -![Image for DisplayMode as Text](images/Display-mode/Xamarin_Forms_Text.png) +![Display Mode as Text in segmented control](images/Display-mode/Xamarin_Forms_Text.png) ## Image -Items populated in the segmented control will be displayed as icons. +Items populated in the segmented control can also be displayed as icons. -The data source of the segmented control can be set as follows. +The data source for the segmented control can be set as follows: -N> In this documentation, ttf file is generated by using the metro studio and provided own icon text name as ”6” as shown in this link[link](https://help.syncfusion.com/metro-studio/export-icon-font#customization). +> Note: In this documentation, a ttf file is generated using Metro Studio, and a custom icon text name “6” is provided. Learn more from this [link](https://help.syncfusion.com/metro-studio/export-icon-font#customization). {% highlight c# %} @@ -162,16 +162,13 @@ public partial class SegmentedControlSample : ContentPage {% endtabs %} -![Image for DisplayMode as Image](images/Display-mode/Xamarin_Forms_Image.png) +![Display Mode as Image in segmented control](images/Display-mode/Xamarin_Forms_Image.png) -## Image with text +## Image with Text -Items populated in the segmented control will be displayed as icons with text. - -The data source of the segmented control can be set as follows. - -N> In this documentation, ttf file is generated by using the metro studio and provided own icon text name as ”6” as shown in this link[link](https://help.syncfusion.com/metro-studio/export-icon-font#customization). +Items in the segmented control can be displayed as icons with accompanying text. +> Note: Refer to the previous note on generating a ttf file using Metro Studio for icon text names, detailed [here](https://help.syncfusion.com/metro-studio/export-icon-font#customization). {% highlight c# %} public class ViewModel @@ -242,25 +239,25 @@ public partial class SegmentedControlSample : ContentPage {% endtabs %} -![Image for DisplayMode as ImageWithText](images/Display-mode/Xamarin_Forms_ImagewithText.png) +![Display Mode as ImageWithText in segmented control](images/Display-mode/Xamarin_Forms_ImagewithText.png) -## How to set the font icons using ttf file? +## How to Set Font Icons Using a ttf File? -You can refer this [link](https://help.syncfusion.com/metro-studio/export-icon-font) for getting the font icons. Add the font file to your application by using the following steps for each platform: +Refer to this [link](https://help.syncfusion.com/metro-studio/export-icon-font) for guidance on acquiring font icons. Follow the platform-specific steps to add the font file to your application: -**Adding font file for iOS** +**Adding Font File for iOS** -1. Add the font family inside `Resource` folder iOS project. -2. Add the font file with the following build action: `BundleResource`. -3. Update the `Info.plist` file (fonts that are provided by application, UIAppFonts, or key). +1. Add the font family inside the `Resource` folder of the iOS project. +2. Add the font file with the build action: `BundleResource`. +3. Update the `Info.plist` file by adding the fonts provided by the application under `UIAppFonts` or a similar key. -**Adding font file for Android** +**Adding Font File for Android** -Add the font file to the `Assets` folder in the application project, and set the following build action: `AndroidAsset`. +Add the font file to the `Assets` folder in the application project, and configure the build action as `AndroidAsset`. -**Adding font file for UWP** +**Adding Font File for UWP** -Add the font family inside the application project of UWP. +Add the font family inside the UWP application project. N> For iOS alone, FontFamily property is declared without succeeding with .ttf and for android and UWP platform font family name is defined followed by .ttf. diff --git a/Xamarin/Segmented-Control/Getting-Started.md b/Xamarin/Segmented-Control/Getting-Started.md index be8c3862d..a06e1fdbe 100644 --- a/Xamarin/Segmented-Control/Getting-Started.md +++ b/Xamarin/Segmented-Control/Getting-Started.md @@ -1,7 +1,7 @@ --- layout: post title: Getting Started with Xamarin Segmented Control | Syncfusion® -description: Learn here about getting started with Syncfusion® Xamarin Segmented Control (SfSegmentedControl), its elements and more. +description: Discover how to get started with Syncfusion® Xamarin Segmented Control (SfSegmentedControl), including its elements and more. platform: Xamarin control: SfSegmentedControl documentation: ug @@ -9,37 +9,37 @@ documentation: ug # Getting Started with Xamarin Segmented Control (SfSegmentedControl) -This section provides an overview for working with the segmented control for Xamarin.Forms. Walk through the entire process of creating a real-world application with the [`SfSegmentedControl`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html). +This section provides an overview for working with the segmented control for Xamarin.Forms. It guides you through the process of creating a real-world application using [`SfSegmentedControl`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html). -## Assembly deployment +## Assembly Deployment -After installing [Essential Studio® for Xamarin](https://www.syncfusion.com/downloads/xamarin), you can find all the required assemblies in the installation folders, {Syncfusion Essential Studio Installed location} \Essential Studio\\{Version #}\Xamarin\lib. +After installing [Essential Studio® for Xamarin](https://www.syncfusion.com/downloads/xamarin), you can find all the required assemblies in the installation folders at {Syncfusion Essential Studio Installed location}\Essential Studio\\{Version #}\Xamarin\lib. E.g.: C:\Program Files (x86) \Syncfusion\Essential Studio\19.1.0.54\Xamarin\lib -N> Assemblies can be found in unzipped package location(Documents/Syncfusion/{Version #}/Xamarin/lib) in Mac. +> Note: Assemblies can be found in the unzipped package location (Documents/Syncfusion/{Version #}/Xamarin/lib) on a Mac. -## Adding SfSegmentedControl reference +## Adding SfSegmentedControl Reference -You can add [`SfSegmentedControl`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html) reference using one of the following methods: +You can add the [`SfSegmentedControl`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html) reference using one of the following methods: -**Method 1: Adding SfSegmentedControl reference from nuget.org** +**Method 1: Adding SfSegmentedControl Reference from NuGet.org** -Syncfusion Xamarin components are available in [nuget.org](https://www.nuget.org/). To add [`SfSegmentedControl`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html) to your project, open the NuGet package manager in Visual Studio, search for [Syncfusion.Xamarin.Buttons](https://www.nuget.org/packages/Syncfusion.Xamarin.Buttons), and then install it. +Syncfusion Xamarin components are available on [nuget.org](https://www.nuget.org/). To add [`SfSegmentedControl`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html) to your project, open the NuGet Package Manager in Visual Studio, search for [Syncfusion.Xamarin.Buttons](https://www.nuget.org/packages/Syncfusion.Xamarin.Buttons), and install it. ![Adding SfSegmentedControl reference from NuGet](images/getting-started/Adding SfSegmentedControl reference.png) -N> -* Install the same version of [`SfSegmentedControl`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html) NuGet in all the projects. -* In addition, you need to install the [Syncfusion.Xamarin.Buttons.WPF]() package for Xamarin.Forms WPF platform only. +> Note: +> - Install the same version of [`SfSegmentedControl`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html) NuGet in all projects. +> - Additionally, install the [Syncfusion.Xamarin.Buttons.WPF]() package for Xamarin.Forms WPF platform only. -**Method 2: Adding SfSegmentedControl reference from toolbox** +**Method 2: Adding SfSegmentedControl Reference from Toolbox** -Syncfusion also provides Xamarin Toolbox. Using this toolbox, you can drag the [`SfSegmentedControl`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html) control to the XAML page. It will automatically install the required NuGet packages and add the namespace to the page. To install Syncfusion Xamarin Toolbox, refer to [Toolbox](https://help.syncfusion.com/xamarin/utility#toolbox). +Syncfusion also provides a Xamarin Toolbox. By using this toolbox, you can drag the [`SfSegmentedControl`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html) control to the XAML page. It will automatically install the required NuGet packages and add the namespace to the page. To install the Syncfusion Xamarin Toolbox, refer to the [Toolbox](https://help.syncfusion.com/xamarin/utility#toolbox) documentation. -**Method 3: Adding SfSegmentedControl assemblies manually from the installed location** +**Method 3: Adding SfSegmentedControl Assemblies Manually from the Installed Location** -If you prefer to manually reference the assemblies instead referencing from NuGet, add the following assemblies in respective projects. +If you prefer to manually reference the assemblies instead of using NuGet, add the following assemblies to the respective projects. Location: {Installed location}/{version}/Xamarin/lib @@ -66,23 +66,23 @@ Location: {Installed location}/{version}/Xamarin/lib
-N> To learn more about obtaining our components, refer to these links for [Mac](https://help.syncfusion.com/xamarin/installation/mac-installer/how-to-download) and [Windows](https://help.syncfusion.com/xamarin/installation/web-installer/how-to-download). +> Note: For more information on obtaining our components, refer to the following links for [Mac](https://help.syncfusion.com/xamarin/installation/mac-installer/how-to-download) and [Windows](https://help.syncfusion.com/xamarin/installation/web-installer/how-to-download). -I> Starting with v16.2.0.x, if you reference Syncfusion assemblies from the trial setup or from the NuGet feed, you also have to include a license key in your projects. Refer to [Syncfusion license key](https://help.syncfusion.com/common/essential-studio/licensing/overview) to learn about registering Syncfusion license key in your Xamarin application to use our components. +> Info: Starting with v16.2.0.x, if you reference Syncfusion assemblies from the trial setup or the NuGet feed, you must include a license key in your projects. Refer to [Syncfusion license key](https://help.syncfusion.com/common/essential-studio/licensing/overview) to learn about registering a Syncfusion license key in your Xamarin application to use our components. -## Launching the SfSegmentedControl on each platform +## Launching the SfSegmentedControl on Each Platform -To use the segmented control inside an application, each platform application must initialize the segmented control renderer. This initialization steps vary from platform to platform, and it is discussed in the following sections: +To use the segmented control inside an application, initialize the segmented control renderer for each platform application. Initialization steps vary by platform and are discussed in the following sections: ### Android and UWP -The Android and UWP launches the [`SfSegmentedControl`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html) without any initialization, and it is enough to only initialize the Xamarin.Forms Framework to launch the application. +For Android and UWP, you can launch the [`SfSegmentedControl`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html) without any additional initialization, except for initializing the Xamarin.Forms framework to launch the application. -N> If you are adding the references from toolbox, this step is not needed. +> Note: If you add references from the toolbox, this step is not needed. ### iOS -To launch the segmented control in iOS, call the SfSegmentedControlRenderer.Init() in the `FinishedLaunching` overridden method of the `AppDelegate` class after the Xamarin.Forms Framework has been initialized and before the `LoadApplication` is called, as demonstrated in the following code example. +To launch the segmented control in iOS, call `SfSegmentedControlRenderer.Init()` in the `FinishedLaunching` overridden method of the `AppDelegate` class after initializing the Xamarin.Forms framework and before calling `LoadApplication`, as shown in the following code example: {% highlight C# %} @@ -162,9 +162,9 @@ Create a new BlankApp (Xamarin.Forms.Portable) application in Visual Studio for ### Adding SfSegmentedControl in Xamarin.Forms -Add the required assembly references to the PCL and renderer projects as discussed in the Assembly deployment  [section](https://help.syncfusion.com/xamarin/introduction/control-dependencies#sfsegmentedcontrol). +Add the required assembly references to the PCL and renderer projects as discussed in the Assembly Deployment [section](https://help.syncfusion.com/xamarin/introduction/control-dependencies#sfsegmentedcontrol). -Import the control namespace as shown in the following code. +Import the control namespace as shown in the following code: {% tabs %} @@ -224,11 +224,11 @@ Set the control to content in `ContentPage`. {% endtabs %} -### Adding supportive views to the application +### Adding Supportive Views to the Application -For the completeness of the ticket booking application, few framework controls are added to the application to get the data from the user. +For the completeness of the ticket booking application, add a few framework controls to get data from the user. -ViewModel class for the Entry, which we have used in our View. +ViewModel class for the Entry, which we have used in our View: {% tabs %} @@ -375,13 +375,11 @@ View can be created by the following code snippet. {% endtabs %} +![Image for Adding Supportive Views](images/getting-started/Xamarin_Forms_InitialView.png) -![Image for adding supportive Views](images/getting-started/Xamarin_Forms_InitialView.png) +## Adding Data/Items to SfSegmentedControl - -## Adding data/Items to SfSegmentedControl - -You can add the data inside the segmented control in three different ways: +You can add data inside the segmented control in three different ways: 1. String data 2. SfSegmentItem @@ -389,9 +387,9 @@ You can add the data inside the segmented control in three different ways: Items inside the segmented control can be added using the [`ItemsSource`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_ItemsSource) property of [`SfSegmentedControl`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html), which holds the collection/list of items. -### Adding data as a String +### Adding Data as a String -With the help of Xamarin.Forms `System.Collections.Generic` you can add string data as [`ItemsSource`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_ItemsSource) to [`SfSegmentedControl`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html). +With the help of Xamarin.Forms `System.Collections.Generic`, you can add string data as an [`ItemsSource`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_ItemsSource) to [`SfSegmentedControl`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html). {% highlight c# %} diff --git a/Xamarin/Segmented-Control/Handling-multiple-segments.md b/Xamarin/Segmented-Control/Handling-multiple-segments.md index 2c10c6022..01786d0fd 100644 --- a/Xamarin/Segmented-Control/Handling-multiple-segments.md +++ b/Xamarin/Segmented-Control/Handling-multiple-segments.md @@ -1,19 +1,19 @@ --- layout: post -title: Handling multiple segments in Xamarin Segmented Control | Syncfusion® -description: Learn here all about Handling multiple segments support in Syncfusion® Xamarin Segmented Control (SfSegmentedControl) and more. +title: Handling Multiple Segments in Xamarin Segmented Control | Syncfusion® +description: Learn about handling multiple segments in Syncfusion® Xamarin Segmented Control (SfSegmentedControl) and more. platform: Xamarin control: SegmentedControl documentation: ug --- -# Handling multiple segments in Xamarin Segmented Control +# Handling Multiple Segments in Xamarin Segmented Control -The segmented control handles segmented items with space distributed for the items in two ways. When the available space in the segmented control is not equally distributed, the items beyond the edges of the control can be viewed by scrolling the panel. +The segmented control handles segmented items with space that can be distributed in two ways. If the available space in the segmented control is not equally distributed, items beyond the edges of the control become accessible by scrolling the panel. -## Visible segment counts +## Visible Segment Counts -The segmented control displays items for view based on the count that is given for [`VisibleSegmentCount`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_VisibleSegmentsCount). +The segmented control displays items based on the count set for [`VisibleSegmentsCount`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_VisibleSegmentsCount). {% tabs %} @@ -69,11 +69,11 @@ this.Content = segmentedControl; {% endtabs %} -![visiblesegment](images/Handling-multiple-segments/visiblesegment.png) +![Visible Segment Count](images/Handling-multiple-segments/visiblesegment.png) -## Segment width +## Segment Width -Users can use the [`SegmentWidth`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_SegmentWidth) property to display the segmented items within the given width instead [`VisibleSegmentCount`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_VisibleSegmentsCount). +Users can apply the [`SegmentWidth`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_SegmentWidth) property to display segmented items within the specified width as an alternative to [`VisibleSegmentsCount`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_VisibleSegmentsCount). {% tabs %} @@ -90,3 +90,4 @@ segmentedControl.SegmentWidth = 80; {% endhighlight %} {% endtabs %} + diff --git a/Xamarin/Segmented-Control/Indicating-the-selected-item.md b/Xamarin/Segmented-Control/Indicating-the-selected-item.md index d8eda6df8..a46769328 100644 --- a/Xamarin/Segmented-Control/Indicating-the-selected-item.md +++ b/Xamarin/Segmented-Control/Indicating-the-selected-item.md @@ -1,19 +1,19 @@ --- layout: post -title: Indicating the selected item in Xamarin Segmented Control | Syncfusion® -description: Learn here all about Indicating the selected item support in Syncfusion® Xamarin Segmented Control (SfSegmentedControl) and more. +title: Indicating the Selected Item in Xamarin Segmented Control | Syncfusion® +description: Discover how to indicate the selected item in Syncfusion® Xamarin Segmented Control (SfSegmentedControl) and more. platform: Xamarin control: SegmentedControl documentation: ug --- -# Indicating the selected item in Xamarin Segmented Control +# Indicating the Selected Item in Xamarin Segmented Control -The segmented control indicates the selected item by differentiating it with text color of the item or using selection strip. +The segmented control indicates the selected item by differentiating it with either the text color of the item or by using a selection strip. -## Selection text color +## Selection Text Color -You can change the text color of the selected item to desired color. The selected item's text color can be customized using the [`SelectionTextColor`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_SelectionTextColor) property. +The text color of the selected item can be changed to a desired color. Customize the selected item's text color using the [`SelectionTextColor`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_SelectionTextColor) property. {% tabs %} @@ -31,19 +31,18 @@ segmentedControl.SelectionTextColor = Color.FromHex("#02A0AE"); {% endtabs %} -![Xamarin_Forms_selectiontextcolor](images/Selection-indicator/Xamarin_Forms_selectiontextcolor.png) +![Xamarin_Forms_SelectionTextColor](images/Selection-indicator/Xamarin_Forms_selectiontextcolor.png) -## Selection strip +## Selection Strip -A selection strip is used to indicate the selected item in the segmented control. The selection strip can be customized in many forms. +A selection strip is used to indicate the selected item in the segmented control. The selection strip can be customized in various ways. -#### Position +### Position -The position of the selection indicator can be customized in different ways. +Customize the position of the selection indicator according to your needs. +#### Top -##### Top - -The selection strip can be displayed as a line with customizable color and thickness. It can be positioned at the top of an item. +The selection strip can be displayed as a line with customizable color and thickness, positioned at the top of an item. {% tabs %} @@ -69,10 +68,9 @@ segmentedControl.SelectionIndicatorSettings = selectionIndicator; ![Xamarin_Forms_Top](images/Selection-indicator/Xamarin_Forms_Top.png) -##### Bottom - -Like top placement, selection strip can be customized by its color and thickness and can be positioned at the bottom of an item. +#### Bottom +Similarly, the selection strip can be positioned at the bottom of an item with customizable color and thickness. {% tabs %} {% highlight xaml %} @@ -97,9 +95,9 @@ segmentedControl.SelectionIndicatorSettings = selectionIndicator; ![Xamarin_Forms_Bottom](images/Selection-indicator/Xamarin_Forms_Bottom.png) -##### Fill +#### Fill -The selection strip can be placed over a segment item to indicate the selection. You can customize its color to highlight the item. +The selection strip can be placed over a segment item to indicate selection, with customizable color to highlight the item. {% tabs %} @@ -125,9 +123,9 @@ segmentedControl.SelectionIndicatorSettings = selectionIndicator; ![Xamarin_Forms_Fill](images/Selection-indicator/Xamarin_Forms_Fill.png) -##### Border +#### Border -The selection strip can be set as a border to highlight the selected item. +You can set the selection strip as a border to emphasize the selected item. {% tabs %} @@ -153,9 +151,9 @@ segmentedControl.SelectionIndicatorSettings = selectionIndicator; ![Xamarin_Forms_Border](images/Selection-indicator/Xamarin_Forms_Border.png) -#### Color +### Color -The background color of the selection strip can be customized using the [`Color`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_Color) property of [`SelectionIndicatorSettings`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_SelectionIndicatorSettings). +Customize the background color of the selection strip using the [`Color`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_Color) property of [`SelectionIndicatorSettings`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_SelectionIndicatorSettings). {% tabs %} @@ -179,11 +177,11 @@ segmentedControl.SelectionIndicatorSettings = selectionIndicator; {% endtabs %} -![Xamarin_Forms_stripcolor](images/Selection-indicator/Xamarin_Forms_stripcolor.png) +![Xamarin_Forms_StripColor](images/Selection-indicator/Xamarin_Forms_stripcolor.png) -#### Thickness +### Thickness -The border thickness of the selection strip can be customized using the [`Thickness`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_BorderThickness) property of [`SelectionIndicatorSettings`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_SelectionIndicatorSettings). +Customize the thickness of the selection strip border using the [`StrokeThickness`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_BorderThickness) property of [`SelectionIndicatorSettings`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_SelectionIndicatorSettings). {% tabs %} diff --git a/Xamarin/Segmented-Control/Overview.md b/Xamarin/Segmented-Control/Overview.md index 265f5ad9a..177990bd0 100644 --- a/Xamarin/Segmented-Control/Overview.md +++ b/Xamarin/Segmented-Control/Overview.md @@ -1,24 +1,21 @@ --- layout: post title: About Xamarin Segmented Control | Syncfusion® -description: Learn here about introduction of Syncfusion® Xamarin Segmented Control (SfSegmentedControl) its elements and more. -platform: xamarin +description: Discover the Syncfusion® Xamarin Segmented Control (SfSegmentedControl), its features, and more. +platform: Xamarin control: SfSegmentedControl documentation: ug --- # Xamarin Segmented Control (SfSegmentedControl) Overview -The Segmented Control for Xamarin.Forms provides a simple way to choose from a linear set of two or more segments, each of which functions as a mutually exclusive button. +The Segmented Control for Xamarin.Forms provides a straightforward way to select from a linear set of two or more segments, each functioning as a mutually exclusive button. ![Segmented control overview](images/overview/Xamarin_Forms_Overview.png) ## Key Features -* Supports displaying the segments with text, font icons, or both. - -* Supports scrolling and aligning the segments equally within the available space. - -* Populates the segments from a collection of strings and views along with the objects of built-in classes. - -* Supports customizing text and other UI elements. \ No newline at end of file +- Supports displaying segments with text, font icons, or both. +- Allows scrolling and equal alignment of segments within the available space. +- Enables populating segments from a collection of strings, views, and objects of built-in classes. +- Supports the customization of text and other UI elements. diff --git a/Xamarin/Segmented-Control/Populating-data-source.md b/Xamarin/Segmented-Control/Populating-data-source.md index b9da87879..92764adbc 100644 --- a/Xamarin/Segmented-Control/Populating-data-source.md +++ b/Xamarin/Segmented-Control/Populating-data-source.md @@ -1,19 +1,19 @@ --- layout: post -title: Populating data source in Xamarin Segmented Control | Syncfusion® -description: Learn here all about Populating data source support in Syncfusion® Xamarin Segmented Control (SfSegmentedControl) and more. +title: Populating Data Source in Xamarin Segmented Control | Syncfusion® +description: Explore how to populate data sources in Syncfusion® Xamarin Segmented Control (SfSegmentedControl). platform: Xamarin control: SegmentedControl documentation: ug --- -# Populating data source in Xamarin Segmented Control +# Populating Data Source in Xamarin Segmented Control The segmented control can be populated from a collection of strings, views, or a collection of objects in a built-in class. -## String collection +## String Collection -The segmented control provides the collection of strings as a data source. +The segmented control allows you to use a collection of strings as a data source. {% tabs %} @@ -61,13 +61,13 @@ this.Content = segmentedControl; {% endtabs %} -![SfSegmentedControl with collection of string](images/Data-source/Xamarin_Forms_string.png) +![SfSegmentedControl with a collection of strings](images/Data-source/Xamarin_Forms_string.png) -## Segment items +## Segment Items -The segmented control customize the text or icons, or use other built-in customization options available for the segments. Segment item collections can also be used. +The segmented control customizes text or icons, or uses other built-in customization options available for the segments. Segment item collections can also be used. -The items inside the [`ItemsSource`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_ItemsSource) can be added in the code behind as below. +Items inside the [`ItemsSource`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_ItemsSource) property can be added in the code-behind as shown below: {% highlight c# %} @@ -128,13 +128,13 @@ this.Content = segmentedControl; {% endtabs %} -![SfSegmentedControl with collection of SfSegmentItem](images/Data-source/Xamarin_Forms_SegmentItemCollection.png) +![SfSegmentedControl with a collection of SfSegmentItems](images/Data-source/Xamarin_Forms_SegmentItemCollection.png) -## Custom views +## Custom Views Custom views or images can be added as segments in the segmented control. -The items inside the [`ItemsSource`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_ItemsSource) can be added in the code behind as below. +Items inside the [`ItemsSource`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_ItemsSource) property can be added in the code-behind as shown below: {% highlight c# %} public class ViewModel @@ -219,6 +219,4 @@ segmentedControl.SelectionIndicatorSettings = new SelectionIndicatorSettings() {% endtabs %} -![SfSegmentedControl with collection of custom object](images/Data-source/Xamarin_Forms_ViewCollection.png) - - +![SfSegmentedControl with a collection of custom objects](images/Data-source/Xamarin_Forms_ViewCollection.png) diff --git a/Xamarin/Segmented-Control/how-to/Autoscrolling-the-selected-segment-item.md b/Xamarin/Segmented-Control/how-to/Autoscrolling-the-selected-segment-item.md index 0674263fc..1649f3794 100644 --- a/Xamarin/Segmented-Control/how-to/Autoscrolling-the-selected-segment-item.md +++ b/Xamarin/Segmented-Control/how-to/Autoscrolling-the-selected-segment-item.md @@ -1,20 +1,20 @@ --- layout: post -title: Auto scrolling the Syncfusion segmented control for Xamarin.Forms -description: Learn how to auto scroll the selected index in the Syncfusion segmented control (SfSegmentedControl) for Xamarin.Forms +title: Auto Scrolling in the Syncfusion Segmented Control for Xamarin.Forms +description: Learn how to enable automatic scrolling for the selected index in the Syncfusion segmented control (SfSegmentedControl) for Xamarin.Forms. platform: Xamarin control: SegmentedControl documentation: ug --- -# Autoscrolling the selected segment item +# Auto Scrolling the Selected Segment Item -Auto scrolling for selected item change can be enabled by setting the value of [`AutoScrollSelectedItem`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_AutoScrollSelectedItem) property to true. You can set the scroll position of segment item using the [`ScrollToPosition`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_ScrollToPosition) property. The default value for [`AutoScrollSelectedItem`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_AutoScrollSelectedItem) is false, and the default value for [`ScrollToPosition`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_ScrollToPosition) is [`MakeVisible`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ScrollToPosition.html#Syncfusion_XForms_Buttons_ScrollToPosition_MakeVisible). The following options are available in [`ScrollToPosition`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_ScrollToPosition): +Enable automatic scrolling for the selected item by setting the [`AutoScrollSelectedItem`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_AutoScrollSelectedItem) property to true. Define the scroll position of the segment item using the [`ScrollToPosition`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_ScrollToPosition) property. By default, [`AutoScrollSelectedItem`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_AutoScrollSelectedItem) is set to false, and [`ScrollToPosition`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_ScrollToPosition) defaults to [`MakeVisible`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ScrollToPosition.html#Syncfusion_XForms_Buttons_ScrollToPosition_MakeVisible). Available options for [`ScrollToPosition`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_ScrollToPosition) include: -* [`MakeVisible`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ScrollToPosition.html#Syncfusion_XForms_Buttons_ScrollToPosition_MakeVisible) - Scrolls to the selected segment item to make it visible in the control. If the item is already visible, scrolling will not occur. -* [`Start`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ScrollToPosition.html#Syncfusion_XForms_Buttons_ScrollToPosition_Start) - Scrolls to the selected segment item at the start of the control. -* [`Center`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ScrollToPosition.html#Syncfusion_XForms_Buttons_ScrollToPosition_Center) - Scrolls to the selected segment item at the center of the control. -* [`End`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ScrollToPosition.html#Syncfusion_XForms_Buttons_ScrollToPosition_End) - Scrolls to selected segment item at the end of the control. +- [`MakeVisible`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ScrollToPosition.html#Syncfusion_XForms_Buttons_ScrollToPosition_MakeVisible): Scrolls the selected segment item to ensure visibility within the control. If the item is already visible, no scrolling occurs. +- [`Start`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ScrollToPosition.html#Syncfusion_XForms_Buttons_ScrollToPosition_Start): Scrolls the selected segment item to the start of the control. +- [`Center`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ScrollToPosition.html#Syncfusion_XForms_Buttons_ScrollToPosition_Center): Centers the selected segment item within the control. +- [`End`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.ScrollToPosition.html#Syncfusion_XForms_Buttons_ScrollToPosition_End): Scrolls the selected segment item to the end of the control. {% tabs %} diff --git a/Xamarin/Segmented-Control/how-to/clear-the-selection.md b/Xamarin/Segmented-Control/how-to/clear-the-selection.md index c91039c05..4e3241426 100644 --- a/Xamarin/Segmented-Control/how-to/clear-the-selection.md +++ b/Xamarin/Segmented-Control/how-to/clear-the-selection.md @@ -1,18 +1,17 @@ --- layout: post -title: Nullable selection in Syncfusion segmented control for Xamarin.Forms -description: Learn how to clear the default selection in Syncfusion segmented control (SfSegmentedControl) for Xamarin.Forms +title: Nullable Selection in Syncfusion Segmented Control for Xamarin.Forms +description: Discover how to clear the default selection in the Syncfusion segmented control (SfSegmentedControl) for Xamarin.Forms. platform: Xamarin control: SegmentedControl documentation: ug --- -# Clear the default selection in SfSegmentedControl +# Clear the Default Selection in SfSegmentedControl -The [`SfSegmentedControl`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html) provides support to clear the default selection on segments by setting the value of [`SelectedIndex`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_SelectedIndex) as negative or beyond the collection count. - -N> By default, it selects the 0th indexed item. +The [`SfSegmentedControl`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html) allows you to clear the default selection by setting the [`SelectedIndex`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Buttons.SfSegmentedControl.html#Syncfusion_XForms_Buttons_SfSegmentedControl_SelectedIndex) property to a negative value or one beyond the collection's count. +> **Note**: By default, the control selects the item at index 0. {% tabs %} {% highlight xaml %} @@ -64,4 +63,4 @@ xmlns:sys="clr-namespace:System.Collections.Generic;assembly=netstandard" {% endtabs %} -![Indicates the nullable selection of SfSegmentedControl in Xamarin.Forms](images/Xamarin_Forms_SegmentedControl_Nullable_Selections.png) +![Nullable selection in SfSegmentedControl for Xamarin.Forms](images/Xamarin_Forms_SegmentedControl_Nullable_Selections.png) diff --git a/Xamarin/SignaturePad/Customization.md b/Xamarin/SignaturePad/Customization.md index 667bdf5a3..d039b5972 100644 --- a/Xamarin/SignaturePad/Customization.md +++ b/Xamarin/SignaturePad/Customization.md @@ -1,17 +1,17 @@ --- layout: post -title: Customization in Xamarin SignaturePad control | Syncfusion -description: Learn here all about Customization support in Syncfusion Xamarin SignaturePad (SfSignaturePad) control and more. -platform: xamarin +title: Customization in Xamarin SignaturePad Control | Syncfusion +description: Explore the customization capabilities of Syncfusion Xamarin SignaturePad (SfSignaturePad) control. +platform: Xamarin control: SfSignaturePad documentation: ug --- # Customization in Xamarin SignaturePad (SfSignaturePad) -The Signature Pad control supports to customize the stroke color and stroke width using the following API. +The SignaturePad control supports customization of stroke color and stroke width using the following APIs. -## Stroke color +## Stroke Color The color of the stroke drawn can be customized using the [`StrokeColor`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.SignaturePad.SfSignaturePad.html#Syncfusion_XForms_SignaturePad_SfSignaturePad_StrokeColor) API. @@ -34,13 +34,13 @@ The color of the stroke drawn can be customized using the [`StrokeColor`](https: {% endtabs %} -![stroke color](images/StrokeColor.png) +![Stroke Color Customization](images/StrokeColor.png) -## Stroke width +## Stroke Width -The width of the stroke drawn can be customized by setting the [`MinimumStrokeWidth`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.SignaturePad.SfSignaturePad.html#Syncfusion_XForms_SignaturePad_SfSignaturePad_MinimumStrokeWidth) and [`MaximumStrokeWidth`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.SignaturePad.SfSignaturePad.html#Syncfusion_XForms_SignaturePad_SfSignaturePad_MaximumStrokeWidth) API. The [`MinimumStrokeWidth`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.SignaturePad.SfSignaturePad.html#Syncfusion_XForms_SignaturePad_SfSignaturePad_MinimumStrokeWidth) defines the minimum thickness of the stroke that can be drawn and the [`MaximumStrokeWidth`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.SignaturePad.SfSignaturePad.html#Syncfusion_XForms_SignaturePad_SfSignaturePad_MaximumStrokeWidth) defines the maximum thickness the stroke can draw based on the speed and impression we provide through gesture. +The width of the stroke drawn can be customized by setting the [`MinimumStrokeWidth`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.SignaturePad.SfSignaturePad.html#Syncfusion_XForms_SignaturePad_SfSignaturePad_MinimumStrokeWidth) and [`MaximumStrokeWidth`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.SignaturePad.SfSignaturePad.html#Syncfusion_XForms_SignaturePad_SfSignaturePad_MaximumStrokeWidth) APIs. The [`MinimumStrokeWidth`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.SignaturePad.SfSignaturePad.html#Syncfusion_XForms_SignaturePad_SfSignaturePad_MinimumStrokeWidth) defines the minimum thickness of the stroke, while the [`MaximumStrokeWidth`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.SignaturePad.SfSignaturePad.html#Syncfusion_XForms_SignaturePad_SfSignaturePad_MaximumStrokeWidth) defines the maximum thickness the stroke can have based on the speed and impression provided through gesture. -N> The default value of [`MinimumStrokeWidth`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.SignaturePad.SfSignaturePad.html#Syncfusion_XForms_SignaturePad_SfSignaturePad_MinimumStrokeWidth) is 0.08 and [`MaximumStrokeWidth`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.SignaturePad.SfSignaturePad.html#Syncfusion_XForms_SignaturePad_SfSignaturePad_MaximumStrokeWidth) is 5. +> Note: The default value of [`MinimumStrokeWidth`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.SignaturePad.SfSignaturePad.html#Syncfusion_XForms_SignaturePad_SfSignaturePad_MinimumStrokeWidth) is 0.08 and [`MaximumStrokeWidth`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.SignaturePad.SfSignaturePad.html#Syncfusion_XForms_SignaturePad_SfSignaturePad_MaximumStrokeWidth) is 5. {% tabs %} @@ -64,6 +64,6 @@ N> The default value of [`MinimumStrokeWidth`](https://help.syncfusion.com/cr/xa {% endtabs %} -![Stroke width](images/StrokeWidth.png) +![Stroke Width Customization](images/StrokeWidth.png) -N> View [sample](https://github.com/SyncfusionExamples/xamarin-sfsignaturepad-examples/tree/master/Samples/SfSignaturePadCustomization) in GitHub +> Note: View the [sample](https://github.com/SyncfusionExamples/xamarin-sfsignaturepad-examples/tree/master/Samples/SfSignaturePadCustomization) on GitHub. diff --git a/Xamarin/SignaturePad/Events.md b/Xamarin/SignaturePad/Events.md index 97ad4afe5..9d754a166 100644 --- a/Xamarin/SignaturePad/Events.md +++ b/Xamarin/SignaturePad/Events.md @@ -1,19 +1,19 @@ --- layout: post -title: Events in Xamarin SignaturePad control | Syncfusion -description: Learn here all about SignaturePad Events support in Syncfusion Xamarin SignaturePad (SfSignaturePad) control and more. +title: Events in Xamarin SignaturePad Control | Syncfusion +description: Learn about event support in Syncfusion Xamarin SignaturePad (SfSignaturePad) control, including how to handle StrokeStarted and StrokeCompleted events. platform: Xamarin -control: SignaturePad +control: SfSignaturePad documentation: ug --- -# SignaturePad Events in Xamarin Signature (SfSignaturePad) +# SignaturePad Events in Xamarin SignaturePad (SfSignaturePad) ## StrokeStarted -The [`StrokeStarted`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.SignaturePad.SfSignaturePad.html#Syncfusion_XForms_SignaturePad_SfSignaturePad_StrokeStarted) event will be triggered when drawing is started. +The [`StrokeStarted`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.SignaturePad.SfSignaturePad.html#Syncfusion_XForms_SignaturePad_SfSignaturePad_StrokeStarted) event is triggered when drawing begins. -[`CancelEventArgs`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Core.CancelEventArgs.html) - SignaturePad draw start action can be restricted by setting the e.cancel to true. +- [`CancelEventArgs`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.Core.CancelEventArgs.html): The SignaturePad draw start action can be restricted by setting `e.Cancel` to `true`. {% tabs %} @@ -44,7 +44,7 @@ The [`StrokeStarted`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.S ## StrokeCompleted -The [`StrokeCompleted`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.SignaturePad.SfSignaturePad.html#Syncfusion_XForms_SignaturePad_SfSignaturePad_StrokeCompleted) event will be triggered when drawing is ended. +The [`StrokeCompleted`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.SignaturePad.SfSignaturePad.html#Syncfusion_XForms_SignaturePad_SfSignaturePad_StrokeCompleted) event is triggered when drawing ends. {% tabs %} diff --git a/Xamarin/SignaturePad/Getting-Started.md b/Xamarin/SignaturePad/Getting-Started.md index cc33ec752..938c475b2 100644 --- a/Xamarin/SignaturePad/Getting-Started.md +++ b/Xamarin/SignaturePad/Getting-Started.md @@ -1,43 +1,43 @@ --- layout: post -title: Getting Started with Xamarin SignaturePad control | Syncfusion -description: Learn here about getting started with Syncfusion Xamarin SignaturePad (SfSignaturePad) control, its elements and more. -platform: xamarin +title: Getting Started with Xamarin SignaturePad Control | Syncfusion +description: Learn how to get started with the Syncfusion Xamarin SignaturePad (SfSignaturePad) control, including its configuration and key elements. +platform: Xamarin control: SfSignaturePad documentation: ug --- # Getting Started with Xamarin SignaturePad (SfSignaturePad) -This section explains the steps required to configure the Signature Pad. +This section explains the steps required to configure the SignaturePad. -## Assembly deployment +## Assembly Deployment -After installing [Essential Studio® for Xamarin](https://www.syncfusion.com/downloads/xamarin), you can find all the required assemblies in the installation folders, {Syncfusion Essential Studio Installed location} \Essential Studio\\{Version #}\Xamarin\lib. +After installing [Essential Studio® for Xamarin](https://www.syncfusion.com/downloads/xamarin), you can find all the required assemblies in the installation folders at {Syncfusion Essential Studio Installed location}\Essential Studio\\{Version #}\Xamarin\lib. E.g.: C:\Program Files (x86) \Syncfusion\Essential Studio\19.1.0.54\Xamarin\lib -N> Assemblies can be found in unzipped package location(Documents/Syncfusion/{Version #}/Xamarin/lib) in Mac. +> Note: Assemblies can be found in the unzipped package location (Documents/Syncfusion/{Version #}/Xamarin/lib) on a Mac. -## Adding SfSignaturePad reference +## Adding SfSignaturePad Reference -You can add the Signature Pad reference using one of the following methods: +You can add the SignaturePad reference using one of the following methods: -**Method 1: Adding SfSignaturePad reference from nuget.org** +**Method 1: Adding SfSignaturePad Reference from NuGet.org** -Syncfusion Xamarin components are available in [nuget.org](https://www.nuget.org/). To add Signature Pad to your project, open the NuGet package manager in Visual Studio, search for [Syncfusion.Xamarin.SfSignaturePad](https://www.nuget.org/packages/Syncfusion.Xamarin.SfSignaturePad), and then install it. +Syncfusion Xamarin components are available on [nuget.org](https://www.nuget.org/). To add SignaturePad to your project, open the NuGet Package Manager in Visual Studio, search for [Syncfusion.Xamarin.SfSignaturePad](https://www.nuget.org/packages/Syncfusion.Xamarin.SfSignaturePad), and install it. -N> Install the same version of `SfSignaturePad` Nuget in all the projects. +> Note: Install the same version of `SfSignaturePad` NuGet in all projects. -![Adding Signature Pad reference from nuget](images/NugetPackage.png) +![Adding SignaturePad reference from NuGet](images/NugetPackage.png) -**Method 2: Adding SfSignaturePad reference from toolbox** +**Method 2: Adding SfSignaturePad Reference from Toolbox** -Syncfusion also provides Xamarin Toolbox. Using this toolbox, you can drag the [`SfSignaturePad`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.SignaturePad.SfSignaturePad.html) control to the XAML page. It will automatically install the required NuGet packages and add the namespace to the page. To install Syncfusion Xamarin Toolbox, refer to this [Toolbox](https://help.syncfusion.com/xamarin/utility#toolbox). +Syncfusion also provides a Xamarin Toolbox. By using this toolbox, you can drag the [`SfSignaturePad`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.SignaturePad.SfSignaturePad.html) control to the XAML page. It will automatically install the required NuGet packages and add the namespace to the page. To install the Syncfusion Xamarin Toolbox, refer to this [Toolbox](https://help.syncfusion.com/xamarin/utility#toolbox). -**Method 3: Adding SfSignaturePad assemblies manually from the installed location** +**Method 3: Adding SfSignaturePad Assemblies Manually from the Installed Location** -If you prefer to manually reference the assemblies instead of referencing from NuGet, add the following assemblies in respective projects. +If you prefer to manually reference the assemblies instead of using NuGet, add the following assemblies to the respective projects. Location: {Installed location}/{version}/Xamarin/lib @@ -57,21 +57,21 @@ Location: {Installed location}/{version}/Xamarin/lib -**Method 4: Adding SfSignaturePad dependency package** +**Method 4: Adding SfSignaturePad Dependency Package** -In addition, you need to install the 1.68.0 version of [SkiaSharp](https://www.nuget.org/packages/SkiaSharp.Views.Forms/1.68.0) nuget in all projects +Additionally, you need to install version 1.68.0 of the [SkiaSharp](https://www.nuget.org/packages/SkiaSharp.Views.Forms/1.68.0) NuGet package in all projects. -N> To know more about obtaining our components, refer to these links for [Mac](https://help.syncfusion.com/xamarin/introduction/download-and-installation/mac/) and [Windows](https://help.syncfusion.com/xamarin/introduction/download-and-installation/windows/). +> Note: For more information on obtaining our components, refer to these links for [Mac](https://help.syncfusion.com/xamarin/introduction/download-and-installation/mac/) and [Windows](https://help.syncfusion.com/xamarin/introduction/download-and-installation/windows/). -## Launching the application on each platform with SfSignaturePad +## Launching the Application on Each Platform with SfSignaturePad -To use the Signature Pad in an application, each platform requires some additional configurations. The configurations vary from platform to platform and is discussed in the following sections: +To use the SignaturePad in an application, each platform requires specific configurations. These configurations vary by platform and are discussed in the following sections: -N> If you are adding the references from toolbox, this step is not needed. +> Note: If you add references from the toolbox, this step is not needed. ### iOS -To launch the [`SfSignaturePad`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.SignaturePad.SfSignaturePad.html) in iOS, call the `SfSignaturePadRenderer.Init()` in the `FinishedLaunching` method of the AppDelegate class after the Xamarin.Forms framework has been initialized and before the LoadApplication is called as demonstrated in the following code sample. +To launch the [`SfSignaturePad`](https://help.syncfusion.com/cr/xamarin/Syncfusion.XForms.SignaturePad.SfSignaturePad.html) on iOS, call `SfSignaturePadRenderer.Init()` in the `FinishedLaunching` method of the AppDelegate class after the Xamarin.Forms framework has been initialized and before `LoadApplication` is called, as demonstrated in the following code sample. {% highlight C# %} @@ -88,13 +88,13 @@ To launch the [`SfSignaturePad`](https://help.syncfusion.com/cr/xamarin/Syncfusi ### Android -The Android platform does not require any additional configurations to render the Signature Pad. +The Android platform does not require any additional configurations to render the SignaturePad. -N> Signature Pad support has not been provided for UWP Platform. +> Note: SignaturePad support has not been provided for the UWP platform. -## Adding a namespace +## Adding a Namespace -Add the following namespace. +Add the following namespace to your project. {% tabs %} @@ -112,9 +112,9 @@ Add the following namespace. {% endtabs %} -## Creating an SfSignaturePad control +## Creating an SfSignaturePad Control -Create an instance for the Signature Pad control, and add it as content. +Create an instance of the SignaturePad control and add it as content. {% tabs %} @@ -135,9 +135,9 @@ Content = signature; {% endtabs %} -## Getting Started with a Signature Pad control +## Getting Started with a SignaturePad Control -The Signature Pad control is configured entirely in C# code or in XAML markup. The following steps explain how to create a Signature Pad and configure their elements. +The SignaturePad control can be configured entirely in C# code or in XAML markup. The following steps explain how to create a SignaturePad and configure its elements. {% tabs %} @@ -197,6 +197,6 @@ namespace SfSignaturePadGettingStarted {% endtabs %} -![Xamarin Signature Pad](images/signature.png) +![Xamarin SignaturePad](images/signature.png) -N> View [sample](https://github.com/SyncfusionExamples/xamarin-sfsignaturepad-examples/tree/master/Samples/SfSignaturePadGettingStarted) in GitHub \ No newline at end of file +> Note: View the [sample](https://github.com/SyncfusionExamples/xamarin-sfsignaturepad-[REDACTED]) on GitHub. diff --git a/Xamarin/SignaturePad/Overview.md b/Xamarin/SignaturePad/Overview.md index 743f2b9d1..5332e1e96 100644 --- a/Xamarin/SignaturePad/Overview.md +++ b/Xamarin/SignaturePad/Overview.md @@ -1,20 +1,20 @@ --- layout: post -title: About Xamarin SignaturePad control | Syncfusion -description: Learn here all about introduction of Syncfusion Xamarin SignaturePad (SfSignaturePad) control, its elements and more. -platform: xamarin +title: About Xamarin SignaturePad Control | Syncfusion +description: Introduction to the Syncfusion Xamarin SignaturePad (SfSignaturePad) control, its features, and capabilities. +platform: Xamarin control: SfSignaturePad documentation: ug --- # Xamarin SignaturePad (SfSignaturePad) Overview -The Xamarin.Forms Signature Pad is used to capture and save signature in a Xamarin.Forms application. This control will display the signature path that varies based on writing speed, which makes the user to feel the real pen effect. +The Xamarin.Forms SignaturePad is designed to capture and save signatures within a Xamarin.Forms application. This control displays the signature path with variations based on writing speed, providing users with a realistic pen effect. -## Key features - -* Minimum and maximum width of a stroke can be customized. -* Stroke color can be customized. -* ImageSource format is supported. +## Key Features +- Customize the minimum and maximum stroke width. +- Personalize the stroke color. +- Supports ImageSource format. ![Signature Pad Overview](images/overview.gif) +