は、ツリービュー

Question

にアニメーションを展開する追加私はツリービューのこの例があります：

import java.util.Arrays; 
import java.util.List; 
import javafx.application.Application; 
import javafx.beans.property.SimpleStringProperty; 
import javafx.event.EventHandler; 
import javafx.scene.Scene; 
import javafx.scene.control.TextField; 
import javafx.scene.control.TreeCell; 
import javafx.scene.control.TreeItem; 
import javafx.scene.control.TreeView; 
import javafx.scene.input.KeyCode; 
import javafx.scene.input.KeyEvent; 
import javafx.scene.layout.VBox; 
import javafx.scene.paint.Color; 
import javafx.stage.Stage; 
import javafx.util.Callback; 

public class MainApp extends Application 
{ 

    //private final Node rootIcon = new ImageView(new Image(getClass().getResourceAsStream("picture.png"))); 
    //private final Image depIcon = new Image(getClass().getResourceAsStream("picture.png")); 
    List<Employee> employees = Arrays.<Employee>asList(
     new Employee("Ethan Williams", "Sales Department"), 
     new Employee("Emma Jones", "Sales Department"), 
     new Employee("Michael Brown", "Sales Department"), 
     new Employee("Anna Black", "Sales Department"), 
     new Employee("Rodger York", "Sales Department"), 
     new Employee("Susan Collins", "Sales Department"), 
     new Employee("Mike Graham", "IT Support"), 
     new Employee("Judy Mayer", "IT Support"), 
     new Employee("Gregory Smith", "IT Support"), 
     new Employee("Jacob Smith", "Accounts Department"), 
     new Employee("Isabella Johnson", "Accounts Department")); 
    TreeItem<String> rootNode = new TreeItem<>("MyCompany Human Resources");//, rootIcon); // Set picture 

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

    @Override 
    public void start(Stage stage) 
    { 
     rootNode.setExpanded(true); 
     for (Employee employee : employees) 
     { 
      TreeItem<String> empLeaf = new TreeItem<>(employee.getName()); 
      boolean found = false; 
      for (TreeItem<String> depNode : rootNode.getChildren()) 
      { 
       if (depNode.getValue().contentEquals(employee.getDepartment())) 
       { 
        depNode.getChildren().add(empLeaf); 
        found = true; 
        break; 
       } 
      } 
      if (!found) 
      { 
       TreeItem<String> depNode = new TreeItem<>(
        employee.getDepartment()//,new ImageView(depIcon) // Set picture 
       ); 
       rootNode.getChildren().add(depNode); 
       depNode.getChildren().add(empLeaf); 
      } 
     } 

     stage.setTitle("Tree View Sample"); 
     VBox box = new VBox(); 
     final Scene scene = new Scene(box, 400, 300); 
     scene.setFill(Color.LIGHTGRAY); 

     TreeView<String> treeView = new TreeView<>(rootNode); 
     //treeView.setEditable(true); 
     treeView.setCellFactory(new Callback<TreeView<String>, TreeCell<String>>() 
     { 
      @Override 
      public TreeCell<String> call(TreeView<String> p) 
      { 
       return new TextFieldTreeCellImpl(); 
      } 
     }); 

     box.getChildren().add(treeView); 
     stage.setScene(scene); 
     stage.show(); 
    } 

    private final class TextFieldTreeCellImpl extends TreeCell<String> 
    { 

     private TextField textField; 

     public TextFieldTreeCellImpl() 
     { 
     } 

     @Override 
     public void startEdit() 
     { 
      super.startEdit(); 

      if (textField == null) 
      { 
       createTextField(); 
      } 
      setText(null); 
      setGraphic(textField); 
      textField.selectAll(); 
     } 

     @Override 
     public void cancelEdit() 
     { 
      super.cancelEdit(); 
      setText((String) getItem()); 
      setGraphic(getTreeItem().getGraphic()); 
     } 

     @Override 
     public void updateItem(String item, boolean empty) 
     { 
      super.updateItem(item, empty); 

      if (empty) 
      { 
       setText(null); 
       setGraphic(null); 
      } 
      else 
      { 
       if (isEditing()) 
       { 
        if (textField != null) 
        { 
         textField.setText(getString()); 
        } 
        setText(null); 
        setGraphic(textField); 
       } 
       else 
       { 
        setText(getString()); 
        setGraphic(getTreeItem().getGraphic()); 
       } 
      } 
     } 

     private void createTextField() 
     { 
      textField = new TextField(getString()); 
      textField.setOnKeyReleased(new EventHandler<KeyEvent>() 
      { 

       @Override 
       public void handle(KeyEvent t) 
       { 
        if (t.getCode() == KeyCode.ENTER) 
        { 
         commitEdit(textField.getText()); 
        } 
        else if (t.getCode() == KeyCode.ESCAPE) 
        { 
         cancelEdit(); 
        } 
       } 
      }); 
     } 

     private String getString() 
     { 
      return getItem() == null ? "" : getItem().toString(); 
     } 
    } 

    public static class Employee 
    { 

     private final SimpleStringProperty name; 
     private final SimpleStringProperty department; 

     private Employee(String name, String department) 
     { 
      this.name = new SimpleStringProperty(name); 
      this.department = new SimpleStringProperty(department); 
     } 

     public String getName() 
     { 
      return name.get(); 
     } 

     public void setName(String fName) 
     { 
      name.set(fName); 
     } 

     public String getDepartment() 
     { 
      return department.get(); 
     } 

     public void setDepartment(String fName) 
     { 
      department.set(fName); 
     } 
    } 
} 

私は、ツリーを展開すると、アニメーションを追加します。どのようにこれを行うことができますか？

Answer 1

これを見て、オンラインで検索しました。私はそれを見つけたhere、 "javafx TreeViewアニメーション"を検索した後。

[OK]を、コードを調べ、いくつかの瞬間を過ごした後、私は、コードの重要な部分はこれですと推定しているので：

rootItem.expandedProperty().addListener(new ChangeListener<Boolean>() { 
    public void changed(ObservableValue<? extends Boolean> observable, Boolean oldValue, Boolean newValue) { 
     new Timeline(
      new KeyFrame(Duration.seconds(0), new KeyValue(tree.opacityProperty(), 0)), 
      new KeyFrame(Duration.seconds(1), new KeyValue(tree.opacityProperty(), 1.0)) 
     ).play(); 
    } 
}); 

このコードは、すべての目的のアニメーションを実行するコードをトリガーするリスナーを追加します時間rootItem.expandedProperty()が変更されます。つまり、ユーザーはツリーを展開または折りたたんでいます。

何かによってexpandedPropertyが変更されるたびに、新しいTimelineオブジェクトが作成されます。このオブジェクトは、特定のアニメーションの実際のステップを表しています。現在のコードではツリーの不透明度が変更されており、rootItemのサブツリーは1秒間に「フェードイン」します。

ツリーを閉じるための別個のアニメーションを実装するには、リスナー内のメソッドパラメータchangedを使用して、2つのケースを区別することができます。

このようなアニメーションを各サブツリーで発生させるには、そのようなリスナーをツリー内の子を持つすべてのノードに追加する必要があります。ツリーのすべての要素を列挙することは、データ構造を学習したときに学んだ非常に基本的な操作です。したがって、これをどのように実行するのかを正確に把握する必要はありません。

しかし、フェードインアニメーションがアプリケーションにとって十分でない場合は、this question doesのようなネストされたアコーディオンを使用することをお勧めします。あなたが与えるサンプル項目だけから、アコーデオンは、従業員リストをとにかく表示するためのより良い方法になります。