I am using the Syncfusion Xamarin.Forms v22.214.171.124 in my MVVM application. What I am effectively trying to achieve is a number of radio buttons (ideally in a 3 column 2 row layout), with custom images and text. Despite the many Syncfusion controls available to me and the flexibility they offer, I have not yet managed to achieve what I am looking for.
Option 1 - SfRadioButton
This was my first port of call and the documentation shows me that I could use a FlexLayout to achieve the 2 x 3 layout I was looking for,
However it would seem that there is no way to use any image except the default circular radiobutton icon.
As a feature suggestion I offer that SfRadioButton could be extended to offer ImageSourceSelected and ImageSourceUnselected properties. This would have allowed me to achieve my objective easily
Option 2 - Toggle Button via SfButton
So then I looked at using an SfButton as a toggle button by setting IsCheckable to true. However I can't seem to work out how to achieve a mutually exclusive selection so they work like radio buttons. I have identified that SfButton offers RadioButtonGroup.GroupName and RadioButtonGroup.SelectedValue properties but the documentation and the API reference do not appear to mention these properties at all, nor do the sample projects. Do you have any samples that show how to use these properties?
I've had a look at your Toggle Button sample project, and whilst it does look to be a mutually exclusive selection, in actual fact you are relying on the code behind to re-colour the button to make it look selected. I might be able to make use of this method as a workaround, but it doesn't seem as convenient as any component which would effectively offer me something like SelectedItem property bound to property on my page model.
Option 3 - SfSegmentedControl
My third consideration was to try SfSegmentedControl.
I haven't yet tried it using Segment items, but the offered method of using images by using an external application (Metro Studio) to create a ttf file of "font" images seems a bit overly complex to me.
As a feature suggestion, perhaps SfSegmentItem could be extended to have an ImageSource property so I can reuse the image assets already available to me in my application.
What I have tried is using custom views (SfButtons) to populate my SfSegementedControl. What I am finding is not ideal with this are:
Are you able to:
So I have now looked at Metro Studio. It seems to me that this application allows you to create custom font files, using only the icon offered by Metro Studio itself, and I cannot import my own graphic to use as an icon?
We generally cannot find common icons that represent the features we offer, in any obvious way. As an example, feature might include: Claims, Handpays, Refills, Engineer, Promotional.
We already have our own icons to represent features in our applications and were looking to re-use the same icons in this mobile app for consistency.
So unless I am wrong and there is actually some way to import images into Metro Studio, it looks to me like using SfSegmentedControl with SfSegementItems and font files, is no longer an option.
Has anybody at Syncfusion spotted this post? You are usually pretty good at responding with a quick turnaround.
As previously mentioned, it is not possible to fulfill your current requirement using Syncfusion controls.
Query 1: Offer any information on how the SfRadioButtonGroup properties may be used to make a number of SfButtons act like radio buttons in a common group. If this is possible, then how best for my ViewModel to determine which is the selected button (given the ViewModel knows nothing about the buttons on the view)?
The SfButton component does not support mutually exclusive selection, making it impossible to use for achieving the behavior of a radio button in a common group. Therefore, it is not suitable for the current requirement.
Query 2: Suggest my best method to implement what I am trying to achieve, whether by improving on what I have been trying already, or offering an alternate solution.
Unfortunately, as previously mentioned, it is not currently possible to fully customize the appearance of a SfRadioButton. The only customization option available is for the content of the button. For more information on customizing the content, please refer to the following link: https://www.syncfusion.com/kb/12586/how-to-create-beautiful-custom-radiobutton-with-xamarin-forms
Query 3: Suggest how SfSegementedControl may be forced to offer an alternate layout.
We have added the ability to use custom views in the SfSegmentedControl. You can find more information on how to implement this feature in our user guide link below:
Query 4: Use an SfButton as a view item within it, yet have multi-line text?
The SfButton component does not have the capability for mutually exclusive selection, and also it cannot display multi-line text.
Query 5: SfRadioButton could be extended to offer ImageSourceSelected and ImageSourceUnselected properties.
We consider your feature suggestions such as ImageSourceSelected and ImageSourceUnselected properties in SfRadioButton for improving the control. Below is the feedback link,
Please cast your vote to make it count. We will prioritize the features every release based on the demands and we do not have an immediate plan to implement this feature since we have committed to already planned work. So, this feature will be available in any of our upcoming releases.
Query 6: I have now looked at Metro Studio. It seems to me that this application allows you to create custom font files, using only the icon offered by Metro Studio itself, and I cannot import my own graphic to use as an icon.
We are currently in the process of reviewing this issue with the Metro Studio team and will provide updates on or before January 18th, 2023.