Tutoriel 4: liste déroulante pour changer de langue #

Créer l’événement EvtChangerLangue #

1. Dans le paquet evenements, créer la classe EvtChangerLangue

   public class EvtChangerLangue extends Event {
   
           private String langue;
   
           public String getLangue() {
               return langue;
           }
   
           public EvtChangerLangue setLangue(String langue) {
               this.langue = langue;
   
               return this;
           }
   
           public void appliquer() {
   
               Locale newLocale = Ntro.buildLocale(langue);
   
               Ntro.changeLocale(newLocale);
           }
   
       }
   

2. Dans le FrontalPong, déclarer l’événement

   public class FrontalPong implements FrontendFx {
   
   
           // ...
   
           @Override
           public void registerEvents(EventRegistrar registrar) {
   
               // ...
   
               // ajouter
               registrar.registerEvent(EvtChangerLangue.class);
           }
   
           // ...
   

Dans racine.xml, ajouter les éléments graphiques suivants #

<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.scene.layout.* ?>
<?import javafx.scene.control.* ?>  

<StackPane xmlns:fx="http://javafx.com/fxml" 
    fx:controller="pong.frontal.vues.VueRacine" 
    styleClass="conteneur"
    id="vue-racine">

    <VBox>

        <Pane styleClass="mini-espace-vertical"/>

        <HBox styleClass="conteneur,menu">
            <ComboBox fx:id="comboLangues" >
            </ComboBox>
        </HBox>

        <Pane styleClass="mini-espace-vertical"/>

        <StackPane fx:id="conteneurSousVue" styleClass="conteneur" VBox.vgrow="ALWAYS">
        </StackPane>

    </VBox>

</StackPane>

Dans dev.css et prod.css, ajouter le CSS suivant #

.combo-box {
    -fx-padding: 0.6em 1.15em 1.15em 1.15em;
    -fx-background-insets: 0,0 0 0.4em 0, 0 0 0.45em 0, 0 0 0.5em 0;
    -fx-background-radius: 0.6em;
    -fx-background-color: 
        linear-gradient(from 0% 93% to 0% 100%, #a34313 0%, #903b12 100%),
        #9d4024,
        #d86e3a,
        radial-gradient(center 50% 50%, radius 100%, #d86e3a, #c54e2c);
    -fx-effect: dropshadow( gaussian , rgba(0,0,0,0.75) , 0.3em,0,0, 0.08em);
    -fx-font-weight: bold;
    -fx-font-size: 1.1em;
}

.combo-box-popup {
    -fx-background-color:derive(orange, 30%);
}

.combo-box-popup .list-view {
    -fx-background-color:derive(orange, 30%);
}

.combo-box-popup .list-view .list-cell {
    -fx-padding: 0.6em 1.15em 1.15em 1.15em;
    -fx-background-insets: 0,0 0 0.4em 0, 0 0 0.45em 0, 0 0 0.5em 0;
    -fx-background-radius: 0.6em;
    -fx-background-color:derive(orange, 40%);
    -fx-font-weight: bold;
    -fx-font-size: 1.1em;
}

.combo-box-popup .list-view .list-cell:selected {
    -fx-background-color:#d86e3a;
    -fx-padding: 0.6em 1.15em 1.15em 1.15em;
    -fx-background-insets: 0,0 0 0.4em 0, 0 0 0.45em 0, 0 0 0.5em 0;
    -fx-background-radius: 0.6em;
    -fx-effect: dropshadow( gaussian , rgba(0,0,1.0,1.0) , 4,0,0,1 );
}

.combo-box-popup .list-view .list-cell:hover {
    -fx-background-color:#9d4024;
    -fx-padding: 0.6em 1.15em 1.15em 1.15em;
    -fx-background-insets: 0,0 0 0.4em 0, 0 0 0.45em 0, 0 0 0.5em 0;
    -fx-background-radius: 0.6em;
    -fx-effect: dropshadow( gaussian , rgba(0,0,1.0,1.0) , 4,0,0,1 );
}

.menu {
    -fx-alignment:center-right;
}

Dans VueRacine, ajouter le code suivant #

public class VueRacine extends ViewFx {


    @FXML
    private ComboBox<String> comboLangues; // ajouter

    @FXML
    private StackPane conteneurSousVue; // ajouter
    
    @Override
    public void initialize() {
        // ajouter
        Ntro.assertNotNull(comboLangues);
        Ntro.assertNotNull(conteneurSousVue);

        // ...
    }

    // ajouter
    public void initialiserComboLangues() {
        comboLangues.setFocusTraversable(false);
        comboLangues.getItems().add("fr");
        comboLangues.getItems().add("en");

        comboLangues.getSelectionModel().select(Ntro.currentLocale().language());
        
        comboLangues.setOnAction(evtFx -> {

            String langue = comboLangues.getSelectionModel().getSelectedItem();

            Ntro.newEvent(EvtChangerLangue.class)
                .setLangue(langue)
                .trigger();

        });
    }

    // modifier cette méthode
    public void afficherSousVue(ViewFx nouvelleVue) {
        conteneurSousVue.getChildren().clear();
        conteneurSousVue.getChildren().add(nouvelleVue.rootNode());
    }

Modifier CreerVues.creerVueRacine pour appeler initialiserComboLangues #

public class CreerVues {
    
    // ...

    private static void creerVueRacine(FrontendTasks subTasks) {

        subTasks.task(create(VueRacine.class))

             .waitsFor(viewLoader(VueRacine.class))

             .executesAndReturnsValue(inputs -> {

                 ViewLoader<VueRacine> viewLoader = inputs.get(viewLoader(VueRacine.class));

                 VueRacine vueRacine = viewLoader.createView();

                 // ajouter
                 vueRacine.initialiserComboLangues();
                 
                 return vueRacine;
             });
    }