Mantener la configuración del tema oscuro después de reiniciar y aplicarla en Vaadin 14.
Hola, quiero aplicar el tema oscuro en el inicio de sesión del usuario en Vaadin 14. Pero no funciona cuando llamo a la función de alternancia programáticamente. Seguí este ejemplo: https://vaadin.com/learn/tutorials/toggle-dark-theme
La configuración ya está persistida, pero ¿cómo puedo aplicar la configuración del tema? Solo funciona cuando la solicitud viene de un hilo de solicitud. Aquí está mi código:
/**
* Cambia el tema de oscuro a claro y viceversa
*/
private static void toogleTheme() {
boolean darkThemeEnabled = ConfigManager.isLightThemeEnabled();
ThemeList themeList = UI.getCurrent().getElement().getThemeList(); //
if (themeList.contains(Lumo.DARK)) { //
themeList.remove(Lumo.DARK);
themeList.add(Lumo.LIGHT);
} else {
themeList.remove(Lumo.LIGHT);
themeList.add(Lumo.DARK);
}
ConfigManager.setLightThemeEnabled(!darkThemeEnabled);
}
El método se llama desde el botón de cambio de tema.
davy.ai
Parece que el problema que está enfrentando está relacionado con el momento de aplicar el cambio de tema programáticamente. Según el ejemplo proporcionado en el sitio web de Vaadin, la función de alternancia se activa mediante un punto final HTTP dedicado, lo que asegura que la función se ejecute en el contexto del lado del servidor, donde el cambio de tema se puede aplicar correctamente.
En su caso, está activando la función de alternancia directamente desde el botón de cambio de tema, lo que podría no ejecutarse en el hilo de solicitud. Esto puede causar problemas con la aplicación correcta del tema.
Para resolver este problema, debe considerar activar la función de alternancia a través de un punto final HTTP dedicado, como se muestra en el ejemplo de Vaadin. Esto asegura que la alternancia del tema se realice en el contexto correcto y garantiza que el tema se aplique correctamente.
Otra alternativa es utilizar el método
UI.access()para asegurar que el cambio de tema se ejecute en el hilo correcto. Aquí hay un ejemplo de cómo utilizar el métodoUI.access():UI.getCurrent().access(() -> {
boolean darkThemeEnabled = ConfigManager.isLightThemeEnabled();
ThemeList themeList = UI.getCurrent().getElement().getThemeList(); //
if (themeList.contains(Lumo.DARK)) { //
themeList.remove(Lumo.DARK);
themeList.add(Lumo.LIGHT);
} else {
themeList.remove(Lumo.LIGHT);
themeList.add(Lumo.DARK);
}
ConfigManager.setLightThemeEnabled(!darkThemeEnabled);
});
Al envolver la función de alternancia de tema en el método
UI.access(), se asegura de que el código se ejecute en el hilo correcto, lo que debería resolver el problema con el tema no se aplica correctamente.