Saltar al contenido

cómo usar botones de radio en formularios xamarin

Solución:

Los formularios de Xamarin no proporcionan el botón de opción.

Puedes usar

1) interruptor

2) Selector

o cualquier otro componente para cumplir con su requerimiento

ACTUALIZAR

La actualización de formularios de xamarin versión 4.6 ha introducido el control del botón de radio, aquí está la documentación oficial

Creo que hay una solución más simple que es bastante fácil y no requiere bibliotecas. Realmente un grupo de radio es solo un ListView elegante. Solo necesitaría crear un viewModel para cada botón de radio que tenga una marca IsSelected y cambiar entre 2 imágenes. Tenía la necesidad de permitir que un usuario seleccionara cuánto tiempo persistía un token:

XAML

<ListView
    HasUnevenRows="True"
    HorizontalOptions="FillAndExpand"
    ItemsSource="{Binding Durations}"
    ItemSelected="ListView_ItemSelected"
    SelectedItem="{Binding SelectedDuration}">
    <ListView.ItemTemplate>
        <DataTemplate>
            <ViewCell>
                <StackLayout
                    Orientation="Horizontal">
                    <Image
                        HeightRequest="18"
                        IsVisible="{Binding IsSelected}"
                        Source="radioButtonChecked.png"
                        WidthRequest="18"/>
                    <Image
                        HeightRequest="18"
                        IsVisible="{Binding IsUnselected}"
                        Source="radioButtonUnchecked.png"
                        WidthRequest="18"/>
                    <Label
                        Margin="8,0,0,0"
                        Text="{Binding Caption}"/>
                </StackLayout>
            </ViewCell>
         </DataTemplate>
      </ListView.ItemTemplate>
   </ListView>

Creamos una vista de lista en nuestra página de contenido y escuchamos el evento ItemSelected. Cada elemento de la lista es un panel de pila horizontal donde cambiamos entre dos imágenes según el estado seleccionado

Código detrás

public partial class LoginPage : ContentPage
{
    LoginPageViewModel LoginPageViewModel { get; }

    public LoginTwoFactorFrequencyPage ()
    {
        BindingContext = LoginPageViewModel = new LoginPageViewModel();

        InitializeComponent ();
    }

    private void ListView_ItemSelected(object sender, SelectedItemChangedEventArgs e)
    {
        LoginPageViewModel.UpdateSelected(e.SelectedItem as PersistenceDuration);
    }
}
  • El código de la página subyacente crea una instancia de un modelo de vista y llama a un método UpdateSelected con el elemento recién seleccionado en el modelo de vista de la página *

RadioButton ViewModel

El modelo de vista para cada botón de opción:

public class PersistenceDuration : ViewModelBase
{
    bool isSelected;

    public string Caption { get; set; }
    public TwoFactorTokenPersistenceDuration Duration { get; set; }
    public bool IsSelected
    {
        get => isSelected;
        set
        {
            isSelected = value;
            OnPropertyChanged();
            OnPropertyChanged("IsUnselected");
        }
    }
    public bool IsUnselected => !IsSelected;

    public PersistenceDuration(string caption, TwoFactorTokenPersistenceDuration duration)
    {
        Caption = caption;
        Duration = duration;
        IsSelected = false;
    }
}

El modelo de vista de botón de opción contiene información de selección y el título. Nos aseguramos de activar OnPropertyChanged siempre que cambie el estado seleccionado

Modelo de vista de página

public class LoginPageViewModel : ViewModelBase
{
    PersistenceDuration duration;
    PersistenceDuration selectedDuration;

    public ObservableCollection<PersistenceDuration> Durations { get; }
    public PersistenceDuration SelectedDuration
    {
        get => selectedDuration;
        set
        {
            if (value != null)
            {
                duration = value;
                UpdateSelected(duration);
            }
            OnPropertyChanged();
        }
    }

    public LoginTwoFactorFrequencyViewModel()
    {
        Durations = new ObservableCollection<PersistenceDuration>(
            new List<PersistenceDuration>()
            {
                new PersistenceDuration(AppResources.Save_code__forever, TwoFactorTokenPersistenceDuration.Forever),
                new PersistenceDuration(AppResources.ChatRequireEvery30Days, TwoFactorTokenPersistenceDuration.ThirtyDays),
                new PersistenceDuration(AppResources.ChatRequireEveryLogin, TwoFactorTokenPersistenceDuration.None),
            });
    }

    public void UpdateSelected(PersistenceDuration persistenceDuration)
    {
        foreach (var item in Durations)
            item.IsSelected = persistenceDuration == item;
    }
}

En el modelo de vista de página, creamos una lista de modelos de vista de botón de opción a los que se vincula el XAML. Cuando UpdateSelected () todos los estados de IsSelected se actualizan, lo que desencadena actualizaciones de enlace que invierten la imagen.

Aún tendrá que hacer algo sobre lo destacado cuando alguien seleccione un elemento, pero eso es bastante fácil de encontrar en Internet 🙂

Puede usar el complemento XLabs desde administrar el paquete NuGets. Después de la instalación, puede usarlo así:

En Xaml:

controls:BindableRadioGroup x:Name="Radiobtn"

C ª#:

string[] gender = {"MAlE","FEMALE"}
Radiobtn.Add(gender)

Enlace de referencia
https://github.com/XLabs/Xamarin-Forms-Labs/tree/master/samples/XLabs.Samples/XLabs.Samples/Pages/Controls

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *