diff --git a/maui-toolkit/Button/Customization.md b/maui-toolkit/Button/Customization.md
index ed841e17..6e5100eb 100644
--- a/maui-toolkit/Button/Customization.md
+++ b/maui-toolkit/Button/Customization.md
@@ -3,7 +3,7 @@ layout: post
title: Customization in .NET MAUI Button control | Syncfusion®
description: Learn here all about Customization support in Syncfusion® .NET MAUI Button (SfButton) control and more.
platform: maui
-control: Sfbutton
+control: SfButton
documentation: ug
---
@@ -22,8 +22,8 @@ The [`TextColor`](https://help.syncfusion.com/cr/maui-toolkit/Syncfusion.Maui.To
{% tabs %}
{% highlight xaml %}
-
-
+
+
{% endhighlight %}
{% highlight c# %}
@@ -45,8 +45,8 @@ The [`FontSize`](https://help.syncfusion.com/cr/maui-toolkit/Syncfusion.Maui.Too
{% tabs %}
{% highlight xaml %}
-
-
+
+
{% endhighlight %}
{% highlight c# %}
@@ -68,8 +68,9 @@ The [`FontAttributes`](https://help.syncfusion.com/cr/maui-toolkit/Syncfusion.Ma
{% tabs %}
{% highlight xaml %}
-
-
+
+
{% endhighlight %}
{% highlight c# %}
@@ -91,8 +92,9 @@ The [`FontFamily`](https://help.syncfusion.com/cr/maui-toolkit/Syncfusion.Maui.T
{% tabs %}
{% highlight xaml %}
-
-
+
+
{% endhighlight %}
{% highlight c# %}
@@ -114,8 +116,9 @@ The [`HorizontalTextAlignment`](https://help.syncfusion.com/cr/maui-toolkit/Sync
{% tabs %}
{% highlight xaml %}
-
-
+
+
{% endhighlight %}
{% highlight c# %}
@@ -135,12 +138,14 @@ Users can now customize the [`SfButton`](https://help.syncfusion.com/cr/maui-too
{% tabs %}
{% highlight xaml %}
-
-
+
{% endhighlight %}
{% highlight c# %}
@@ -169,8 +174,9 @@ The [`LineBreakMode`](https://help.syncfusion.com/cr/maui-toolkit/Syncfusion.Mau
{% tabs %}
{% highlight xaml %}
-
-
+
+
{% endhighlight %}
{% highlight c# %}
@@ -196,8 +202,9 @@ The [`Background`](https://help.syncfusion.com/cr/maui-toolkit/Syncfusion.Maui.T
{% tabs %}
{% highlight xaml %}
-
-
+
+
{% endhighlight %}
{% highlight c# %}
@@ -221,8 +228,8 @@ The [`Stroke`](https://help.syncfusion.com/cr/maui-toolkit/Syncfusion.Maui.Toolk
{% tabs %}
{% highlight xaml %}
-
-
+
+
{% endhighlight %}
{% highlight c# %}
@@ -244,8 +251,8 @@ The [`StrokeThickness`](https://help.syncfusion.com/cr/maui-toolkit/Syncfusion.M
{% tabs %}
{% highlight xaml %}
-
-
+
+
{% endhighlight %}
{% highlight c# %}
@@ -268,8 +275,8 @@ The [`CornerRadius`](https://help.syncfusion.com/cr/maui-toolkit/Syncfusion.Maui
{% tabs %}
{% highlight xaml %}
-
-
+
+
{% endhighlight %}
{% highlight c# %}
@@ -294,8 +301,8 @@ You can enable the Icon image using the [`ShowIcon`](https://help.syncfusion.com
{% tabs %}
{% highlight xaml %}
-
-
+
+
{% endhighlight %}
{% highlight c# %}
@@ -317,8 +324,8 @@ N> Enable the [`ShowIcon`]() property to enable the [`ImageSource`](https://help
{% tabs %}
{% highlight xaml %}
-
-
+
+
{% endhighlight %}
{% highlight c# %}
@@ -343,8 +350,8 @@ N> Enable the `ShowIcon` property to enable the `ImageSize` property.
{% tabs %}
{% highlight xaml %}
-
-
+
+
{% endhighlight %}
{% highlight c# %}
@@ -379,10 +386,12 @@ N> Enable the `ShowIcon` property to enable the `ImageAlignment` property.
+
{% endhighlight %}
{% highlight c# %}
@@ -767,11 +784,11 @@ N> Default value is [`null`].
-
-
+
{% endhighlight %}
{% highlight c# %}
diff --git a/maui-toolkit/Button/Getting-Started.md b/maui-toolkit/Button/Getting-Started.md
index f65fcf0c..6a0bc89e 100644
--- a/maui-toolkit/Button/Getting-Started.md
+++ b/maui-toolkit/Button/Getting-Started.md
@@ -122,6 +122,8 @@ N> Ensure that the images mentioned in the code snippets are located in the **Re
Ensure that the images mentioned in the code snippets are located in the **Re
SfButton button = new SfButton();
button.Text = "Button";
+button.WidthRequest = 150;
+button.HeightRequest = 40;
button.TextColor = Colors.White;
button.ImageSource = "button_Heart.png";
button.ShowIcon = true;
@@ -155,7 +159,8 @@ The button background image can be defined using the [BackgroundImageSource](htt
FontAttributes="Bold"
BackgroundImageSource="button_background.png"
CornerRadius="10"
- WidthRequest="150"/>
+ WidthRequest="150"
+ HeightRequest="40"/>
{% endhighlight %}
{% highlight c# %}
@@ -166,6 +171,7 @@ button.FontAttributes = FontAttributes.Bold;
button.BackgroundImageSource = "button_background.png";
button.CornerRadius = 10;
button.WidthRequest = 150;
+button.HeightRequest = 40;
{% endhighlight %}
{% endtabs %}
diff --git a/maui-toolkit/Button/Images/customization-images/Button_border.png b/maui-toolkit/Button/Images/customization-images/Button_border.png
index a0d53536..5e893641 100644
Binary files a/maui-toolkit/Button/Images/customization-images/Button_border.png and b/maui-toolkit/Button/Images/customization-images/Button_border.png differ
diff --git a/maui-toolkit/Button/Images/customization-images/Button_borderthickness.png b/maui-toolkit/Button/Images/customization-images/Button_borderthickness.png
index 5455c51d..28183d3f 100644
Binary files a/maui-toolkit/Button/Images/customization-images/Button_borderthickness.png and b/maui-toolkit/Button/Images/customization-images/Button_borderthickness.png differ
diff --git a/maui-toolkit/Button/Images/customization-images/Button_cornerradius.png b/maui-toolkit/Button/Images/customization-images/Button_cornerradius.png
index f592125c..83a67a1d 100644
Binary files a/maui-toolkit/Button/Images/customization-images/Button_cornerradius.png and b/maui-toolkit/Button/Images/customization-images/Button_cornerradius.png differ
diff --git a/maui-toolkit/Button/Images/customization-images/Button_fontattributes.png b/maui-toolkit/Button/Images/customization-images/Button_fontattributes.png
index e42dd3dd..c4453476 100644
Binary files a/maui-toolkit/Button/Images/customization-images/Button_fontattributes.png and b/maui-toolkit/Button/Images/customization-images/Button_fontattributes.png differ
diff --git a/maui-toolkit/Button/Images/customization-images/Button_fontsize.png b/maui-toolkit/Button/Images/customization-images/Button_fontsize.png
index 18d98959..d7c23876 100644
Binary files a/maui-toolkit/Button/Images/customization-images/Button_fontsize.png and b/maui-toolkit/Button/Images/customization-images/Button_fontsize.png differ
diff --git a/maui-toolkit/Button/Images/customization-images/Button_icon.png b/maui-toolkit/Button/Images/customization-images/Button_icon.png
index b9c1ddff..f37b5139 100644
Binary files a/maui-toolkit/Button/Images/customization-images/Button_icon.png and b/maui-toolkit/Button/Images/customization-images/Button_icon.png differ
diff --git a/maui-toolkit/Button/Images/customization-images/Button_textColor.png b/maui-toolkit/Button/Images/customization-images/Button_textColor.png
index a54988f4..4d490ba9 100644
Binary files a/maui-toolkit/Button/Images/customization-images/Button_textColor.png and b/maui-toolkit/Button/Images/customization-images/Button_textColor.png differ
diff --git a/maui-toolkit/Button/Images/getting-started/net-maui-button-with-icon.png b/maui-toolkit/Button/Images/getting-started/net-maui-button-with-icon.png
index b9c1ddff..6eb55082 100644
Binary files a/maui-toolkit/Button/Images/getting-started/net-maui-button-with-icon.png and b/maui-toolkit/Button/Images/getting-started/net-maui-button-with-icon.png differ
diff --git a/maui-toolkit/Button/Images/right-to-left/RTL.png b/maui-toolkit/Button/Images/right-to-left/RTL.png
index 3114535e..6cb78d2b 100644
Binary files a/maui-toolkit/Button/Images/right-to-left/RTL.png and b/maui-toolkit/Button/Images/right-to-left/RTL.png differ
diff --git a/maui-toolkit/Button/Right-To-Left.md b/maui-toolkit/Button/Right-To-Left.md
index a58d9bf8..06bc4db5 100644
--- a/maui-toolkit/Button/Right-To-Left.md
+++ b/maui-toolkit/Button/Right-To-Left.md
@@ -15,6 +15,8 @@ documentation: ug
{% highlight xaml %}
The visual states [Checked](https://help.syncfusion.com/cr/maui-toolkit/Syncf
-
+
diff --git a/maui-toolkit/Button/how-to/Add-the-custom-view-for-button.md b/maui-toolkit/Button/how-to/Add-the-custom-view-for-button.md
index 084ea085..dc53f12d 100644
--- a/maui-toolkit/Button/how-to/Add-the-custom-view-for-button.md
+++ b/maui-toolkit/Button/how-to/Add-the-custom-view-for-button.md
@@ -16,16 +16,16 @@ You can customize the appearance of the button by adding your custom view in the
-
-
+
+
-
-
+
+
{% endhighlight %}
@@ -57,10 +57,17 @@ SfButton button = new SfButton
{
Text = "SfButton",
WidthRequest = 120,
+ HeightRequest = 50,
Background = Color.FromArgb("#4125BC"),
CornerRadius= 10,
Content = customTemplate
};
+
+Content = new VerticalStackLayout
+{
+ Children = { button },
+};
+
{% endhighlight %}
{% endtabs %}
diff --git a/maui-toolkit/NumericEntry/Basic-Features.md b/maui-toolkit/NumericEntry/Basic-Features.md
index 849f6b4b..206e2b7a 100644
--- a/maui-toolkit/NumericEntry/Basic-Features.md
+++ b/maui-toolkit/NumericEntry/Basic-Features.md
@@ -16,17 +16,19 @@ You can prompt the user with any information using the [Placeholder](https://hel
{% tabs %}
{% highlight xaml %}
-
+
{% endhighlight %}
{% highlight C# %}
-SfNumberBox SfNumberBox= new SfNumberBox();
-SfNumberBox.Placeholder = "Enter input here...";
-sfNumberBox.HorizontalOptions = LayoutOptions.Center;
-sfNumberBox.VerticalOptions = LayoutOptions.Center;
+SfNumericEntry sfNumericEntry= new SfNumericEntry();
+sfNumericEntry.WidthRequest=200;
+sfNumericEntry.Placeholder = "Enter input here...";
+sfNumericEntry.HorizontalOptions = LayoutOptions.Center;
+sfNumericEntry.VerticalOptions = LayoutOptions.Center;
{% endhighlight %}
{% endtabs %}
@@ -41,7 +43,8 @@ N> The clear button appears only when the text box is focused and the `IsEditabl
{% tabs %}
{% highlight xaml %}
-
@@ -49,7 +52,8 @@ N> The clear button appears only when the text box is focused and the `IsEditabl
{% endhighlight %}
{% highlight C# %}
-SfNumericEntry sfNumericEntry = new SfNumericEntry();
+SfNumericEntry sfNumericEntry= new SfNumericEntry();
+sfNumericEntry.WidthRequest=200;
sfNumricEntry.Value=10;
sfNumericEntry.ShowClearButton = true;
sfNumericEntry.IsEditable = true;
@@ -157,7 +161,8 @@ The NumericEntry border color can be changed by using the [Stroke]() property. T
{% tabs %}
{% highlight xaml %}
-
@@ -165,6 +170,7 @@ The NumericEntry border color can be changed by using the [Stroke]() property. T
{% highlight C# %}
SfNumericEntry sfNumericEntry = new SfNumericEntry();
+sfNumericEntry.WidthRequest=200;
sfNumericEntry.HorizontalOptions = LayoutOptions.Center;
sfNumericEntry.VerticalOptions = LayoutOptions.Center;
sfNumericEntry.Stroke = Colors.Red;
@@ -249,6 +255,7 @@ N> Default value of ReturnType is `Default`.
{% highlight C# %}
SfNumericEntry sfNumericEntry = new SfNumericEntry();
+sfNumericEntry.WidthRequest=200;
sfNumericEntry.ReturnType = ReturnType.Next;
{% endhighlight %}
@@ -264,6 +271,7 @@ The [ClearButtonPath](https://help.syncfusion.com/cr/maui-toolkit/Syncfusion.Mau
{% highlight xaml %}
@@ -288,6 +296,7 @@ var path = new Path()
};
SfNumericEntry numericEntry = new SfNumericEntry();
+numericEntry.WidthRequest=200;
numricEntry.Value=10;
numericEntry.ShowClearButton = true;
numericEntry.IsEditable = true;
@@ -313,6 +322,7 @@ The following image illustrates the result of the above code:
@@ -322,6 +332,7 @@ The following image illustrates the result of the above code:
var viewModel = new CommandDemoViewModel();
SfNumericEntry numericEntry = new SfNumericEntry();
+numericEntry.WidthRequest=200;
numericEntry.ReturnCommand = viewModel.AlertCommand;
numericEntry.ReturnCommandParameter = "Return key is pressed";
diff --git a/maui-toolkit/NumericEntry/Events.md b/maui-toolkit/NumericEntry/Events.md
index adc61a46..0b345103 100644
--- a/maui-toolkit/NumericEntry/Events.md
+++ b/maui-toolkit/NumericEntry/Events.md
@@ -21,7 +21,8 @@ The [ValueChanged](https://help.syncfusion.com/cr/maui-toolkit/Syncfusion.Maui.T
{% tabs %}
{% highlight xaml %}
-
@@ -29,6 +30,7 @@ The [ValueChanged](https://help.syncfusion.com/cr/maui-toolkit/Syncfusion.Maui.T
{% highlight C# %}
SfNumericEntry sfNumericEntry = new SfNumericEntry();
+sfNumericEntry.WidthRequest=200;
sfNumericEntry.HorizontalOptions = LayoutOptions.Center;
sfNumericEntry.VerticalOptions = LayoutOptions.Center;
sfNumericEntry.ValueChanged += sfNumericEntry_ValueChanged;
@@ -57,7 +59,8 @@ The `NumericEntry` control includes a [Completed](https://help.syncfusion.com/cr
{% tabs %}
{% highlight xaml %}
-
@@ -65,6 +68,7 @@ The `NumericEntry` control includes a [Completed](https://help.syncfusion.com/cr
{% highlight C# %}
SfNumericEntry sfNumericEntry = new SfNumericEntry();
+sfNumericEntry.WidthRequest=200;
sfNumericEntry.HorizontalOptions = LayoutOptions.Center;
sfNumericEntry.VerticalOptions = LayoutOptions.Center;
sfNumericEntry.Completed += sfNumericEntry_Completed;
diff --git a/maui-toolkit/NumericEntry/Formatting.md b/maui-toolkit/NumericEntry/Formatting.md
index 0093f663..4c55e3db 100644
--- a/maui-toolkit/NumericEntry/Formatting.md
+++ b/maui-toolkit/NumericEntry/Formatting.md
@@ -25,25 +25,37 @@ N> You can apply various custom formats available in [this page](), which are s
{% highlight xaml %}
// Format stock price in currency.
-
+
// Format product discount in percent.
-
+
// Format worked hours in decimal.
-
+
{% endhighlight %}
{% highlight c# %}
// Format stock price in currency.
-stockPrice.CustomFormat = "C2";
+SfNumericEntry stockPrice = new SfNumericEntry
+{
+ CustomFormat = "C2",
+ WidthRequest = 200
+};
// Format product discount in percent.
-productDiscount.CustomFormat = "P2";
+SfNumericEntry productDiscount = new SfNumericEntry
+{
+ CustomFormat = "P2",
+ WidthRequest = 200
+};
// Format worked hours in decimal.
-hoursWorked.CustomFormat = "N2";
+SfNumericEntry hoursWorked = new SfNumericEntry
+{
+ CustomFormat = "N2",
+ WidthRequest = 200
+};
{% endhighlight %}
{% endtabs %}
@@ -62,25 +74,37 @@ N> **0** (Zero placeholder) replaces the zero with the corresponding digit prese
{% highlight xaml %}
// Format stock price in currency.
-
+
// Format product discount in percentage.
-
+
// Format worked hours in decimal.
-
+
{% endhighlight %}
{% highlight c# %}
// Format stock price in currency.
-stockPrice.CustomFormat = "$00000.00";
+SfNumericEntry stockPrice = new SfNumericEntry
+{
+ CustomFormat = "$00000.00",
+ WidthRequest = 200
+};
// Format product discount in percentage.
-productDiscount.CustomFormat = "00000.00%";
+SfNumericEntry productDiscount = new SfNumericEntry
+{
+ CustomFormat = "00000.00%",
+ WidthRequest = 200
+};
// Format worked hours in decimal.
-hoursWorked.CustomFormat = "00000.00";
+SfNumericEntry hoursWorked = new SfNumericEntry
+{
+ CustomFormat = "00000.00",
+ WidthRequest = 200
+};
{% endhighlight %}
{% endtabs %}
@@ -98,16 +122,30 @@ N> **0** (Zero placeholder) replaces the zero with the corresponding digit in th
{% tabs %}
{% highlight xaml %}
-
-
-
+
+
+
{% endhighlight %}
{% highlight c# %}
-stockPrice.CustomFormat = "$000.000";
-productDiscount.CustomFormat = "00.000%";
-hoursWorked.CustomFormat = "00.000";
+SfNumericEntry stockPrice = new SfNumericEntry
+{
+ CustomFormat = "$000.000",
+ WidthRequest = 200
+};
+
+SfNumericEntry productDiscount = new SfNumericEntry
+{
+ CustomFormat = "00.000%",
+ WidthRequest = 200
+};
+
+SfNumericEntry hoursWorked = new SfNumericEntry
+{
+ CustomFormat = "00.000",
+ WidthRequest = 200
+};
{% endhighlight %}
{% endtabs %}
@@ -127,16 +165,30 @@ In the following example, the value of the `CustomFormat` property is **#.00##**
{% tabs %}
{% highlight xaml %}
-
-
-
+
+
+
{% endhighlight %}
{% highlight c# %}
-stockPrice.CustomFormat = "$00.00##";
-productDiscount.CustomFormat = "00.00##%";
-hoursWorked.CustomFormat = "00.00##";
+SfNumericEntry stockPrice = new SfNumericEntry
+{
+ CustomFormat = "$00.00##",
+ WidthRequest = 200
+};
+
+SfNumericEntry productDiscount = new SfNumericEntry
+{
+ CustomFormat = "00.00##%",
+ WidthRequest = 200
+};
+
+SfNumericEntry hoursWorked = new SfNumericEntry
+{
+ CustomFormat = "00.00##",
+ WidthRequest = 200
+};
{% endhighlight %}
{% endtabs %}
@@ -169,6 +221,7 @@ When the [SfNumericEntry](https://help.syncfusion.com/cr/maui-toolkit/Syncfusion
{% highlight xaml %}
@@ -178,7 +231,7 @@ When the [SfNumericEntry](https://help.syncfusion.com/cr/maui-toolkit/Syncfusion
{% highlight C# %}
SfNumericEntry sfNumericEntry= new SfNumericEntry();
-SfNumericEntry sfNumericEntry = new SfNumericEntry();
+sfNumericUpDown.WidthRequest = 200;
sfNumericEntry.Value = 1000;
sfNumericEntry.CustomFormat = "p";
sfNumericEntry.PercentDisplayMode = PercentDisplayMode.Value;
@@ -193,7 +246,8 @@ sfNumericEntry.PercentDisplayMode = PercentDisplayMode.Value;
{% tabs %}
{% highlight xaml %}
-
@@ -203,6 +257,7 @@ sfNumericEntry.PercentDisplayMode = PercentDisplayMode.Value;
{% highlight C# %}
SfNumericEntry sfNumericEntry= new SfNumericEntry();
+sfNumericUpDown.WidthRequest = 200;
sfNumericEntry.Value = 1000;
sfNumericEntry.CustomFormat = "p";
sfNumericEntry.PercentDisplayMode = PercentDisplayMode.Compute;
@@ -224,6 +279,7 @@ N> The `MaximumNumberDecimalDigits` property can only be set to a positive value
{% highlight xaml %}
@@ -232,6 +288,7 @@ N> The `MaximumNumberDecimalDigits` property can only be set to a positive value
{% highlight C# %}
SfNumericEntry sfNumericEntry= new SfNumericEntry();
+sfNumericUpDown.WidthRequest = 200;
sfNumericEntry.Value = 1000.23232;
sfNumericEntry.MaximumNumberDecimalDigits = 3;
diff --git a/maui-toolkit/NumericEntry/Getting-Started.md b/maui-toolkit/NumericEntry/Getting-Started.md
index d133e75a..ea8e26af 100644
--- a/maui-toolkit/NumericEntry/Getting-Started.md
+++ b/maui-toolkit/NumericEntry/Getting-Started.md
@@ -121,7 +121,8 @@ This ensures that only valid numeric input is accepted and displayed according t
{% tabs %}
{% highlight xaml %}
-
@@ -129,6 +130,7 @@ This ensures that only valid numeric input is accepted and displayed according t
{% highlight C# %}
SfNumericEntry sfNumericEntry = new SfNumericEntry();
+sfNumericEntry.WidthRequest=200;
sfNumericEntry.HorizontalOptions = LayoutOptions.Center;
sfNumericEntry.VerticalOptions = LayoutOptions.Center;
sfNumericEntry.CustomFormat = "0.000";
@@ -145,7 +147,8 @@ You can change the format in which the value should be displayed using the [Cust
{% tabs %}
{% highlight xaml %}
-
@@ -153,11 +156,12 @@ You can change the format in which the value should be displayed using the [Cust
{% endhighlight %}
{% highlight C# %}
-SfNumberBox sfNumberBox = new SfNumberBox();
-sfNumberBox.HorizontalOptions = LayoutOptions.Center;
-sfNumberBox.VerticalOptions = LayoutOptions.Center;
-sfNumberBox.Value = 12.5;
-sfNumberBox.CustomFormat = "C2";
+SfNumericEntry sfNumericEntry = new SfNumericEntry();
+sfNumericEntry.WidthRequest=200;
+sfNumericEntry.HorizontalOptions = LayoutOptions.Center;
+sfNumericEntry.VerticalOptions = LayoutOptions.Center;
+sfNumericEntry.Value = 12.5;
+sfNumericEntry.CustomFormat = "C2";
{% endhighlight %}
{% endtabs %}
@@ -171,7 +175,8 @@ By default, the [NumericEntry](https://help.syncfusion.com/cr/maui-toolkit/Syncf
{% tabs %}
{% highlight xaml %}
-
@@ -180,6 +185,7 @@ By default, the [NumericEntry](https://help.syncfusion.com/cr/maui-toolkit/Syncf
{% highlight C# %}
SfNumericEntry sfNumericEntry = new SfNumericEntry();
+sfNumericEntry.WidthRequest=200;
sfNumericEntry.Value=12315;
sfNumericEntry.HorizontalOptions = LayoutOptions.Center;
sfNumericEntry.VerticalOptions = LayoutOptions.Center;
diff --git a/maui-toolkit/NumericEntry/Restriction.md b/maui-toolkit/NumericEntry/Restriction.md
index 4a9345c8..b903e79b 100644
--- a/maui-toolkit/NumericEntry/Restriction.md
+++ b/maui-toolkit/NumericEntry/Restriction.md
@@ -22,7 +22,8 @@ N> When the value of the Minimum property is **15**, and the `AllowNull` propert
{% tabs %}
{% highlight xaml %}
-
@@ -31,6 +32,7 @@ N> When the value of the Minimum property is **15**, and the `AllowNull` propert
{% highlight C# %}
SfNumericEntry sfNumericEntry = new SfNumericEntry();
+sfNumericEntry.WidthRequest=200;
sfNumeriCEntry.HorizontalOptions = LayoutOptions.Center;
sfNumericEntry.VerticalOptions = LayoutOptions.Center;
sfNumericEntry.Value = 10;
@@ -48,7 +50,8 @@ You can restrict the users to enter input within a minimum and maximum range in
{% tabs %}
{% highlight xaml %}
-
@@ -87,6 +92,7 @@ You can prevent users from editing the numerical value in the editor using the [
{% highlight C# %}
SfNumericEntry sfNumericEntry = new SfNumericEntry();
+sfNumericEntry.WidthRequest=200;
sfNumericEntry.HorizontalOptions = LayoutOptions.Center;
sfNumericEntry.VerticalOptions = LayoutOptions.Center;
sfNumericEntry.IsEditable = true;
diff --git a/maui-toolkit/NumericUpDown/Basic-Features.md b/maui-toolkit/NumericUpDown/Basic-Features.md
index 14d93964..99f6f55c 100644
--- a/maui-toolkit/NumericUpDown/Basic-Features.md
+++ b/maui-toolkit/NumericUpDown/Basic-Features.md
@@ -16,7 +16,8 @@ You can prompt the user with any information using the [Placeholder](https://hel
{% tabs %}
{% highlight xaml %}
-
@@ -24,6 +25,7 @@ You can prompt the user with any information using the [Placeholder](https://hel
{% highlight C# %}
SfNumericUpDown numericUpDown= new SfNumericUpDown();
+numericUpDown.WidthRequest = 200;
numericUpDown.Placeholder = "Enter input here...";
numericUpDown.HorizontalOptions = LayoutOptions.Center;
numericUpDown.VerticalOptions = LayoutOptions.Center;
@@ -41,7 +43,8 @@ N> The clear button appears only when the text box is focused and the `IsEditabl
{% tabs %}
{% highlight xaml %}
-
@@ -50,6 +53,7 @@ N> The clear button appears only when the text box is focused and the `IsEditabl
{% highlight C# %}
SfNumericUpDown sfNumericUpDown = new SfNumericUpDown();
+sfNumericUpDown.WidthRequest = 200;
sfNumericUpDown.Value=10;
sfNumericUpDown.ShowClearButton = true;
sfNumericUpDown.IsEditable = true;
@@ -113,7 +117,7 @@ public partial class MainPage : ContentPage
WidthRequest = 200,
HeightRequest = 40,
VerticalOptions = LayoutOptions.Center,
- ValueChangeMode = ValueChangeMode.OnKeyFocus,
+ ValueChangeMode = Syncfusion.Maui.Toolkit.NumericEntry.ValueChangeMode.OnKeyFocus,
Value = 50
};
var horizontalStackLayout = new StackLayout
@@ -139,7 +143,7 @@ public partial class MainPage : ContentPage
Content = verticalStackLayout;
}
- private void NumericUpDown_ValueChanged(object sender, NumericUpDownValueChangedEventArgs e)
+ private void NumericUpDown_ValueChanged(object? sender, Syncfusion.Maui.Toolkit.NumericEntry.NumericEntryValueChangedEventArgs e)
{
valueDisplay.Text="$"+e.NewValue.ToString();
}
@@ -157,7 +161,8 @@ The NumericUpDown border color can be changed by using the [Stroke](https://help
{% tabs %}
{% highlight xaml %}
-
@@ -165,6 +170,7 @@ The NumericUpDown border color can be changed by using the [Stroke](https://help
{% highlight C# %}
SfNumericUpDown sfNumericUpDown = new SfNumericUpDown();
+sfNumericUpDown.WidthRequest = 200;
sfNumericUpDown.HorizontalOptions = LayoutOptions.Center;
sfNumericUpDown.VerticalOptions = LayoutOptions.Center;
sfNumericUpDown.Stroke = Colors.Red;
@@ -247,6 +253,7 @@ N> Default value of ReturnType is `Default`.
{% highlight C# %}
SfNumericUpDown sfNumericUpDown = new SfNumericUpDown();
+sfNumericUpDown.WidthRequest = 200;
sfNumericUpDown.ReturnType = ReturnType.Next;
{% endhighlight %}
@@ -262,6 +269,7 @@ The `ClearButtonPath` property allows users to set the path for customizing the
{% highlight xaml %}
@@ -286,6 +294,7 @@ var path = new Path()
};
SfNumericUpDown numericUpDown = new SfNumericUpDown();
+numericUpDown.WidthRequest = 200;
numericUpDown.Value=10;
numericUpDown.ShowClearButton = true;
numericUpDown.IsEditable = true;
@@ -311,6 +320,7 @@ The following image illustrates the result of the above code:
@@ -320,6 +330,7 @@ The following image illustrates the result of the above code:
var viewModel = new CommandDemoViewModel();
SfNumericUpDown NumericUpDown = new SfNumericUpDown();
+NumericUpDown.WidthRequest = 200;
NumericUpDown.ReturnCommand = viewModel.AlertCommand;
NumericUpDown.ReturnCommandParameter = "Return key is pressed";
diff --git a/maui-toolkit/NumericUpDown/Events.md b/maui-toolkit/NumericUpDown/Events.md
index b07c8102..29ec50fe 100644
--- a/maui-toolkit/NumericUpDown/Events.md
+++ b/maui-toolkit/NumericUpDown/Events.md
@@ -21,7 +21,8 @@ The [ValueChanged](https://help.syncfusion.com/cr/maui-toolkit/Syncfusion.Maui.T
{% tabs %}
{% highlight xaml %}
-
@@ -29,6 +30,7 @@ The [ValueChanged](https://help.syncfusion.com/cr/maui-toolkit/Syncfusion.Maui.T
{% highlight C# %}
SfNumericUpDown sfNumericUpDown = new SfNumericUpDown();
+sfNumericUpDown.WidthRequest = 200;
sfNumericUpDown.HorizontalOptions = LayoutOptions.Center;
sfNumericUpDown.VerticalOptions = LayoutOptions.Center;
sfNumericUpDown.ValueChanged += sfNumericUpDown_ValueChanged;
@@ -57,7 +59,8 @@ The `NumericUpDown` control includes a [Completed](https://help.syncfusion.com/c
{% tabs %}
{% highlight xaml %}
-
@@ -65,6 +68,7 @@ The `NumericUpDown` control includes a [Completed](https://help.syncfusion.com/c
{% highlight C# %}
SfNumericUpDown sfNumericUpDown = new SfNumericUpDown();
+sfNumericUpDown.WidthRequest = 200;
sfNumericUpDown.HorizontalOptions = LayoutOptions.Center;
sfNumericUpDown.VerticalOptions = LayoutOptions.Center;
sfNumericUpDown.Completed += sfNumericUpDown_Completed;
diff --git a/maui-toolkit/NumericUpDown/Formatting.md b/maui-toolkit/NumericUpDown/Formatting.md
index be8bca18..0cbf2d18 100644
--- a/maui-toolkit/NumericUpDown/Formatting.md
+++ b/maui-toolkit/NumericUpDown/Formatting.md
@@ -25,25 +25,37 @@ N> You can apply various custom formats available in [this page](https://docs.m
{% highlight xaml %}
// Format stock price in currency.
-
+
// Format product discount in percent.
-
+
// Format worked hours in decimal.
-
+
{% endhighlight %}
{% highlight c# %}
// Format stock price in currency.
-stockPrice.CustomFormat = "C2";
+SfNumericUpDown stockPrice = new SfNumericUpDown
+{
+ CustomFormat = "C2",
+ WidthRequest = 200
+};
// Format product discount in percent.
-productDiscount.CustomFormat = "P2";
+SfNumericUpDown productDiscount = new SfNumericUpDown
+{
+ CustomFormat = "P2",
+ WidthRequest = 200
+};
// Format worked hours in decimal.
-hoursWorked.CustomFormat = "N2";
+SfNumericUpDown hoursWorked = new SfNumericUpDown
+{
+ CustomFormat = "N2",
+ WidthRequest = 200
+};
{% endhighlight %}
{% endtabs %}
@@ -62,25 +74,37 @@ N> **0** (Zero placeholder) replaces the zero with the corresponding digit prese
{% highlight xaml %}
// Format stock price in currency.
-
+
// Format product discount in percentage.
-
+
// Format worked hours in decimal.
-
+
{% endhighlight %}
{% highlight c# %}
// Format stock price in currency.
-stockPrice.CustomFormat = "$00000.00";
+SfNumericUpDown stockPrice = new SfNumericUpDown
+{
+ CustomFormat = "$00000.00",
+ WidthRequest = 200
+};
// Format product discount in percentage.
-productDiscount.CustomFormat = "00000.00%";
+SfNumericUpDown productDiscount = new SfNumericUpDown
+{
+ CustomFormat = "00000.00%",
+ WidthRequest = 200
+};
// Format worked hours in decimal.
-hoursWorked.CustomFormat = "00000.00";
+SfNumericUpDown hoursWorked = new SfNumericUpDown
+{
+ CustomFormat = "00000.00",
+ WidthRequest = 200
+};
{% endhighlight %}
{% endtabs %}
@@ -98,16 +122,30 @@ N> **0** (Zero placeholder) replaces the zero with the corresponding digit in th
{% tabs %}
{% highlight xaml %}
-
-
-
+
+
+
{% endhighlight %}
{% highlight c# %}
-stockPrice.CustomFormat = "$000.000";
-productDiscount.CustomFormat = "00.000%";
-hoursWorked.CustomFormat = "00.000";
+SfNumericUpDown stockPrice = new SfNumericUpDown
+{
+ CustomFormat = "$000.000",
+ WidthRequest = 200
+};
+
+SfNumericUpDown productDiscount = new SfNumericUpDown
+{
+ CustomFormat = "00.000%",
+ WidthRequest = 200
+};
+
+SfNumericUpDown hoursWorked = new SfNumericUpDown
+{
+ CustomFormat = "00.000",
+ WidthRequest = 200
+};
{% endhighlight %}
{% endtabs %}
@@ -127,16 +165,30 @@ In the following example, the value of the `CustomFormat` property is **#.00##**
{% tabs %}
{% highlight xaml %}
-
-
-
+
+
+
{% endhighlight %}
{% highlight c# %}
-stockPrice.CustomFormat = "$00.00##";
-productDiscount.CustomFormat = "00.00##%";
-hoursWorked.CustomFormat = "00.00##";
+SfNumericUpDown stockPrice = new SfNumericUpDown
+{
+ CustomFormat = "$00.00##",
+ WidthRequest = 200
+};
+
+SfNumericUpDown productDiscount = new SfNumericUpDown
+{
+ CustomFormat = "00.00##%",
+ WidthRequest = 200
+};
+
+SfNumericUpDown hoursWorked = new SfNumericUpDown
+{
+ CustomFormat = "00.00##",
+ WidthRequest = 200
+};
{% endhighlight %}
{% endtabs %}
@@ -168,7 +220,8 @@ When the [SfNumericUpDown](https://help.syncfusion.com/cr/maui-toolkit/Syncfusio
{% tabs %}
{% highlight xaml %}
-
@@ -179,6 +232,7 @@ When the [SfNumericUpDown](https://help.syncfusion.com/cr/maui-toolkit/Syncfusio
SfNumericUpDown sfNumericUpDown= new SfNumericUpDown();
SfNumericUpDown sfNumericUpDown = new SfNumericUpDown();
+sfNumericUpDown.WidthRequest = 200;
sfNumericUpDown.Value = 1000;
sfNumericUpDown.CustomFormat = "p";
sfNumericUpDown.PercentDisplayMode = PercentDisplayMode.Value;
@@ -194,6 +248,7 @@ sfNumericUpDown.PercentDisplayMode = PercentDisplayMode.Value;
{% highlight xaml %}
@@ -203,6 +258,7 @@ sfNumericUpDown.PercentDisplayMode = PercentDisplayMode.Value;
{% highlight C# %}
SfNumericUpDown sfNumericUpDown= new SfNumericUpDown();
+sfNumericUpDown.WidthRequest = 200;
sfNumericUpDown.Value = 1000;
sfNumericUpDown.CustomFormat = "p";
sfNumericUpDown.PercentDisplayMode = PercentDisplayMode.Compute;
@@ -224,6 +280,7 @@ N> The `MaximumNumberDecimalDigits` property can only be set to a positive value
{% highlight xaml %}
@@ -232,6 +289,7 @@ N> The `MaximumNumberDecimalDigits` property can only be set to a positive value
{% highlight C# %}
SfNumericUpDown sfNumericUpDown= new SfNumericUpDown();
+sfNumericUpDown.WidthRequest = 200;
sfNumericUpDown.Value = 1000.23232;
sfNumericUpDown.MaximumNumberDecimalDigits = 3;
diff --git a/maui-toolkit/NumericUpDown/Getting-Started.md b/maui-toolkit/NumericUpDown/Getting-Started.md
index 7e23c2b5..de1ecf39 100644
--- a/maui-toolkit/NumericUpDown/Getting-Started.md
+++ b/maui-toolkit/NumericUpDown/Getting-Started.md
@@ -120,7 +120,8 @@ This ensures that only valid numeric input is accepted and displayed according t
{% tabs %}
{% highlight xaml %}
-
@@ -128,6 +129,7 @@ This ensures that only valid numeric input is accepted and displayed according t
{% highlight C# %}
SfNumericUpDown sfNumericUpDown = new SfNumericUpDown();
+sfNumericUpDown.WidthRequest = 200;
sfNumericUpDown.HorizontalOptions = LayoutOptions.Center;
sfNumericUpDown.VerticalOptions = LayoutOptions.Center;
sfNumericUpDown.CustomFormat = "0.000";
@@ -150,7 +152,8 @@ N> Clicking the up or down button increases or decreases the value based on the
{% tabs %}
{% highlight xaml %}
-
@@ -159,6 +162,7 @@ N> Clicking the up or down button increases or decreases the value based on the
{% highlight C# %}
SfNumericUpDown sfNumericUpDown = new SfNumericUpDown();
+sfNumericUpDown.WidthRequest = 200;
sfNumericUpDown.HorizontalOptions = LayoutOptions.Center;
sfNumericUpDown.VerticalOptions = LayoutOptions.Center;
sfNumericUpDown.CustomFormat = "0.000";
@@ -176,7 +180,8 @@ You can change the format in which the value should be displayed using the [Cust
{% tabs %}
{% highlight xaml %}
-
@@ -185,6 +190,7 @@ You can change the format in which the value should be displayed using the [Cust
{% highlight C# %}
SfNumericUpDown sfNumericUpDown = new SfNumericUpDown();
+sfNumericUpDown.WidthRequest = 200;
sfNumericUpDown.HorizontalOptions = LayoutOptions.Center;
sfNumericUpDown.VerticalOptions = LayoutOptions.Center;
sfNumericUpDown.Value = 12.5;
@@ -202,7 +208,8 @@ By default, the [NumericUpDown](https://help.syncfusion.com/cr/maui-toolkit/Sync
{% tabs %}
{% highlight xaml %}
-
@@ -211,6 +218,7 @@ By default, the [NumericUpDown](https://help.syncfusion.com/cr/maui-toolkit/Sync
{% highlight C# %}
SfNumericUpDown sfNumericUpDown = new SfNumericUpDown();
+sfNumericUpDown.WidthRequest = 200;
sfNumericUpDown.Value=12315;
sfNumericUpDown.HorizontalOptions = LayoutOptions.Center;
sfNumericUpDown.VerticalOptions = LayoutOptions.Center;
diff --git a/maui-toolkit/NumericUpDown/Restriction.md b/maui-toolkit/NumericUpDown/Restriction.md
index 43850b0d..685ca591 100644
--- a/maui-toolkit/NumericUpDown/Restriction.md
+++ b/maui-toolkit/NumericUpDown/Restriction.md
@@ -22,7 +22,8 @@ N> When the value of the Minimum property is **15**, and the `AllowNull` propert
{% tabs %}
{% highlight xaml %}
-
@@ -31,6 +32,7 @@ N> When the value of the Minimum property is **15**, and the `AllowNull` propert
{% highlight C# %}
SfNumericUpDown sfNumericUpDown = new SfNumericUpDown();
+sfNumericUpDown.WidthRequest = 200;
sfNumericUpDown.HorizontalOptions = LayoutOptions.Center;
sfNumericUpDown.VerticalOptions = LayoutOptions.Center;
sfNumericUpDown.Value = 10;
@@ -48,7 +50,8 @@ You can restrict the users to enter input within a minimum and maximum range in
{% tabs %}
{% highlight xaml %}
-
@@ -87,6 +92,7 @@ You can prevent users from editing the numerical value in the editor using the [
{% highlight C# %}
SfNumericUpDown sfNumericUpDown = new SfNumericUpDown();
+sfNumericUpDown.WidthRequest = 200;
sfNumericUpDown.HorizontalOptions = LayoutOptions.Center;
sfNumericUpDown.VerticalOptions = LayoutOptions.Center;
sfNumericUpDown.IsEditable = true;
diff --git a/maui-toolkit/NumericUpDown/UpDown-Button.md b/maui-toolkit/NumericUpDown/UpDown-Button.md
index 1b43d462..17d1a462 100644
--- a/maui-toolkit/NumericUpDown/UpDown-Button.md
+++ b/maui-toolkit/NumericUpDown/UpDown-Button.md
@@ -20,7 +20,8 @@ N> The value in the `NumericUpDown` can also be changed by mouse scrolling. The
{% tabs %}
{% highlight xaml %}
- The value in the `NumericUpDown` can also be changed by mouse scrolling. The
{% highlight C# %}
SfNumericUpDown sfNumericUpDown= new SfNumericUpDown();
+sfNumericUpDown.WidthRequest = 200;
sfNumericUpDown.Value=10;
sfNumericUpDown.SmallChange=5;
sfNumericUpDown.LargeChange=10;
@@ -50,7 +52,8 @@ N> When using the up-down button, the `NumericUpDown` control value changes base
{% tabs %}
{% highlight XAML %}
-
@@ -59,6 +62,7 @@ N> When using the up-down button, the `NumericUpDown` control value changes base
{% highlight c# %}
SfNumericUpDown sfNumericUpDown = new SfNumericUpDown();
+sfNumericUpDown.WidthRequest = 200;
sfNumericUpDown.HorizontalOptions = LayoutOptions.Center;
sfNumericUpDown.VerticalOptions = LayoutOptions.Center;
sfNumericUpDown.Value=360;
@@ -82,7 +86,8 @@ The default updown button alignment is **Right**.
{% tabs %}
{% highlight XAML %}
-
@@ -91,6 +96,7 @@ The default updown button alignment is **Right**.
{% highlight c# %}
SfNumericUpDown sfNumericUpDown = new SfNumericUpDown();
+sfNumericUpDown.WidthRequest = 200;
sfNumericUpDown.HorizontalOptions = LayoutOptions.Center;
sfNumericUpDown.VerticalOptions = LayoutOptions.Center;
sfNumericUpDown.Value=360;
@@ -152,7 +158,7 @@ N> The UpDownButton template only supports Inline Placement mode.
-