1. Home
  2. Forum
  3. Xamarin.Forms
  4. SFnumericUpDown look with buttons at both side

SFnumericUpDown look with buttons at both side


Hi , I am trying to implement the SfNumericUpDown control and wondering if is possible to achieve below look with both android and iOS.
I have tried few customization but I couldn't. Before going down the route of putting together a control at my end I wanted to check with yourselves if it can be done.

thanks a lot!






3 Replies 1 reply marked as answer
RS Ramya Soundar Rajan Syncfusion Team October 13, 2020 03:19 PM UTC

Hi Mobileguy, 
 
We would like to let you know that the we can align the increment and decrement button at both side of the control using the property SpinButtonAlignment as both. Please refer the below link for more information. 
 
 
You can customize the spin button instead of default increment and decrement icon using the IncrementButtonSettings and DecrementButtonSettings of the SfNumericUpDown. Please refer the below link for more information. 
 
 
You can also customize the color of the border, background and text color of the control. Please refer the below link for more information. 
 
 
In our current implementation, SfNumericUpDown border will be placed, including the increment and decrement button. Currently we are checking the possibility to achieve in a workaround sample as like in your provided image and update you the details on or before October 15, 2020. 
 
Regards, 
Ramya S 


MO mobileguy October 14, 2020 08:01 AM UTC


Hi there thank you very much for your detailed response.
I have managed to put together as below however in iOS it places a border all around the control.
Is it possible to have the same look in iOS as android without border at the top? Can the bottom border be a bit detached from the side?

I am just trying to see if I can achieve the look without me writing a control from scratch and make the customer happy?



thanks again for all your suggestions .

RS Ramya Soundar Rajan Syncfusion Team October 15, 2020 04:35 PM UTC

Hi Mobileguy, 
 
We would like to inform you that we have rendered our SfNumericUpDown with Entry native controls. In Xamarin.Forms Entry itself doesn’t have same look in all platform.  
 
 
For your information, you can obtain the similar UI with the help of SfTextInputLayout along with SfNumericTextBox (but you have to do the + - button tap validation at your end, by restricting the updated Value should not be below the minimum value and greater than of maximum value) 
 
 
Then set the increment image button as trailing view with the TrailingViewPosition as outside and decrement image button as leading view with the LeadingViewPosition as outside. Please refer the links below. 
 
 
You can also set the container type for the SfTextInputLayout. Please refer the below link. 
 
 
In the button click, you can increment/ decrement the values and also set the minimum and maximum values. 
 
Regards, 
Ramya S 


Marked as answer
Loader.
Up arrow icon