es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

  • es.davy.ai/
  • Programación /
  • Interruptor de palanca no cambia de posición después de cambiar el idioma de la aplicación utilizando el paquete GETX de Flutter.

Interruptor de palanca no cambia de posición después de cambiar el idioma de la aplicación utilizando el paquete GETX de Flutter.

01 Aug, 2023 Programación

Tengo un interruptor de alternancia en mi aplicación, donde el usuario hace clic para cambiar el idioma. Estoy utilizando el paquete toggle_switch en mi vista. Mi vista se ve así:

class Welcome extends GetView<welcomecontroller> {
  final WelcomeController _controller = Get.put(WelcomeController());
  Welcome({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    var _toggleValue = 0.obs;

    return Scaffold(
      body: Obx(() => Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Text('Valor del interruptor: ${_controller.selectedLanguage.value}'),
          ToggleSwitch(
            minWidth: 90.0,
            cornerRadius: 20.0,
            activeBgColors: [[Colors.cyan], [Colors.redAccent]],
            activeFgColor: Colors.white,
            inactiveBgColor: Colors.grey,
            inactiveFgColor: Colors.white,
            totalSwitches: 2,
            labels: ['Inglés', 'Bangla'],
            onToggle: (index) {
              print('cambiado a: $index');
              changeLanguage(index);
            },
          ),
          // algunos otros widgets
        ],
      ))
    );
  }

  void changeLanguage(int value) {
    if (value == 0) {
      _controller.changeLang('en');
    } else {
      _controller.changeLang('bn');
    }
  }
}

Mi controlador tiene la función changeLang que hace lo siguiente:

class WelcomeController extends GetxController {
  var selectedLanguage = Get.locale!.languageCode.obs;

  void changeLang(String lang) {
    Locale locale = Locale(lang);
    Get.updateLocale(locale);
    selectedLanguage.value = lang;
  }
}

Si uso la función anterior dentro de la función onToggle del interruptor de alternancia, la posición del interruptor no se mueve al índice seleccionado actualmente y el color no cambia, pero el idioma cambia cada vez que hago clic en Inglés o Bangla. ¿Qué estoy haciendo mal?

Tags:  , , , ,

Answer

  1. Avatar for davy.ai
    davy.ai

    El problema con la posición y el color del interruptor no cambian cuando se cambia el idioma es porque solo estás actualizando el valor de la variable observable selectedLanguage en tu función changeLang. También necesitas actualizar el valor de _toggleValue para que el interruptor refleje la selección de idioma actual.

    Puedes lograr esto pasando selectedLanguage como un parámetro al widget Obx y actualizando _toggleValue en consecuencia. Aquí tienes una versión actualizada de tu código:

    class Welcome extends GetView<welcomecontroller> {
  final WelcomeController _controller = Get.put(WelcomeController());
  Welcome({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    var _toggleValue = 0.obs;

    return Scaffold(
      body: Obx(() => Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              Text('Valor de interruptor: ${_controller.selectedLanguage.value}'),
              ToggleSwitch(
                minWidth: 90.0,
                cornerRadius: 20.0,
                activeBgColors: [[Colors.cyan], [Colors.redAccent]],
                activeFgColor: Colors.white,
                inactiveBgColor: Colors.grey,
                inactiveFgColor: Colors.white,
                totalSwitches: 2,
                labels: ['Inglés', 'Bangla'],
                initialLabelIndex: _controller.selectedLanguage.value == 'en' ? 0 : 1,
                onToggle: (index) {
                  print('cambiado a: $index');
                  changeLanguage(index, _toggleValue);
                },
              ),
              // otros widgets
            ],
          )),
    );
  }

  void changeLanguage(int value, RxInt toggleValue) {
    if (value == 0) {
      _controller.changeLang('en');
      toggleValue.value = 0;
    } else {
      _controller.changeLang('bn');
      toggleValue.value = 1;
    }
  }
}

    En este código actualizado, pasamos _toggleValue como un parámetro al widget Obx y actualizamos su valor dentro de la función changeLanguage cada vez que se cambia el idioma. También establecemos la propiedad initialLabelIndex del widget ToggleSwitch para reflejar la selección de idioma actual al iniciar la aplicación.

    Esto debería solucionar el problema con la posición y el color del interruptor que no cambian cuando se cambia el idioma.

Comments are closed.