2016-03-18 22 views
1

Bazı daire şekillerine sahip bir JavaFX FXML sahnesine sahibim. Her daire bir ampulü temsil eder. Belirli bir JavaFX CSS sınıfı olduğunda, "lightOn" deyince bir ampul açılır, aksi halde kapalıdır. CSS, dairenin görünümünü tanımlar, böylece "lightOn" sınıfına sahip olduğunda parıldamaya başlar ve sınıfsız olduğunda kararır.JavaFX stil sınıfını model durumuna göre değiştirin

Ayrıca Boolean değerlerinin bir koleksiyonunu içeren model olarak düz bir Java nesnesine sahibim. Her bir boole değeri, görüntünün tek bir ampulüne aittir ve ışığın açık mı yoksa kapalı mı olduğunu gösterir.

Görünümün tek tek "ampullerini" stil sınıfını, durumunu temsil eden modelin Boole alanına nasıl bağlayabilirsiniz? Yani Boole değeri değiştiğinde stil sınıfı güncellenmelidir.

(Stil sınıfının bir tür özellik bağlaması aracılığıyla otomatik olarak güncelleştirilmesi gerekmez; ancak bu da Tamam olur. Görünüm, örneğin bir denetleyici tarafından güncellenirse yeterli olur. Örneğin, periyodik olarak modeli yoklar.)

cevap

0

Bunun için CSS based psuedo-class tabanlı bir özellik kullanabilirsiniz.

İsterseniz, CSS psuedo sınıfı tarafından desteklenen özelliği model nesnesinin bir özelliğine bağlayabilirsiniz, böylece modeli güncelleştirdiğinizde, ilişkilendirilmiş görünümün CSS sözde sınıfı otomatik olarak değiştirilir ve Görünüm uygun şekilde güncellendi.

Aşağıdaki resimde, her daire bir ampulü temsil eder. Her bir ampulün durumunu temsil eden ilişkili bir özelliği vardır (ampulün açık olup olmadığını belirten bir BooleanProperty). Özelliğin invalidated() yöntemi, ampulün açık olup olmadığına bağlı olarak ampülün stilini güncelleyen ilişkili bir CSS psödo-sınıfı durumuna yapılan değişiklik bildirimlerini tetiklemek için kullanılır.

onProperty()'un açık olması, ampulün modeline uygun bir boole özelliğine bağlanabilir. Bu, JavaFX API'sindeki diğer CSS pseudo-class destekli kontrollerin, check-box ve toggle butonları gibi bazı şekillerde benzer bir uygulamadır.

image

bulb.css

.bulb { 
    -fx-fill: lightslategray; 
} 

.bulb:on { 
    -fx-fill: gold; 
} 

LightArray.java

import javafx.application.Application; 
import javafx.beans.property.*; 
import javafx.css.PseudoClass; 
import javafx.geometry.Insets; 
import javafx.scene.Scene; 
import javafx.scene.layout.HBox; 
import javafx.scene.shape.Circle; 
import javafx.stage.Stage; 

public class LightArray extends Application { 
    @Override 
    public void start(final Stage stage) throws Exception { 
     Bulb bulb1 = new Bulb(); 
     Bulb bulb2 = new Bulb(); 
     bulb2.setOn(true); 

     final HBox layout = new HBox(10, bulb1, bulb2); 
     layout.setPadding(new Insets(10)); 
     Scene scene = new Scene(layout); 
     scene.getStylesheets().add(
       this.getClass().getResource("bulb.css").toExternalForm() 
     ); 
     stage.setScene(scene); 
     stage.show(); 
    } 

    public static void main(String[] args) { 
     launch(args); 
    } 

    static private class Bulb extends Circle { 
     Bulb() { 
      super(30); 
      getStyleClass().add("bulb"); 
     } 

     public void setOn(boolean on) { 
      this.on.set(on); 
     } 

     public boolean isOn() { 
      return on.get(); 
     } 

     public BooleanProperty onProperty() { 
      return on; 
     } 

     public BooleanProperty on = 
       new BooleanPropertyBase(false) { 
        @Override protected void invalidated() { 
         pseudoClassStateChanged(ON_PSEUDO_CLASS, get()); 
        } 

        @Override public Object getBean() { 
         return Bulb.this; 
        } 

        @Override public String getName() { 
         return "on"; 
        } 
       }; 

     private static final PseudoClass 
       ON_PSEUDO_CLASS = PseudoClass.getPseudoClass("on"); 
    } 
} 
+0

Bu sizin çözüm sindirmek için biraz zaman aldı. Birçok açıdan gerçekten harika. Özellikle çevrelerin özel "Ampul" kontrollerine dönüştürülmesini seviyorum. Bu, rollerini düz "çember" ten çok daha net bir şekilde gösterir. – jhunovis

İlgili konular