Richfaces-rich-tree

提供:Dev Guides
移動先:案内検索

RichFaces-リッチツリー

この章では、RichFacesでのツリー処理について学習します。 RichFacesは、ツリーを作成および操作するために必要なすべてのコンポーネントを提供します。

<rich:treeNode>

このタグは、階層ツリーを作成するために使用されます。 <treeNode>内に提供される各ノードは、ツリーの子ノードになります。 このタグは、<rich:tree>という別のタグとともに使用されます。 ツリーの作成に使用しているすべてのインスタンス変数は、これら3つのインターフェース(* org.richfaces.model.TreeNode、org.richfaces.model.TreeDataModel、および *javax.swing.tree.TreeNode )のいずれかを実装する必要があります。

次の例では、バックエンドから<rich:treeNode>タグを使用してツリーを作成します。

<?xml version = "1.0" encoding = "UTF-8"?>
<!DOCTYPE html>
<html xmlns = "http://www.w3.org/1999/xhtml"
   xmlns:h = "http://java.sun.com/jsf/html"
   xmlns:f = "http://java.sun.com/jsf/core"
   xmlns:ui = "http://java.sun.com/jsf/facelets"
   xmlns:a4j = "http://richfaces.org/a4j"
   xmlns:rich = "http://richfaces.org/rich">

   <h:head>
      <title>TreeNode Example</title>
      <meta name = "viewport" content = "width = device-width, initial-scale = 1.0"/>
   </h:head>

   <h:body>
      <h:form>
         <rich:tree value = "#{tree.populateNode}" var = "tree">
            <rich:treeNode>
               <rich:treeModelRecursiveAdaptor>
               </rich:treeModelRecursiveAdaptor>
               <h:outputText value = "#{tree.data}"/>
            </rich:treeNode>
         </rich:tree>
      </h:form>
   </h:body>

</html>

以下は、*“ TreeNodeImpl” *インターフェースを実装する関連Javaクラスです。

import javax.faces.bean.ManagedBean;
import javax.faces.bean.RequestScoped;
import org.richfaces.model.TreeNodeImpl;

@ManagedBean
@RequestScoped

public class Tree extends TreeNodeImpl {
   private Tree stationRoot;
   private Tree populateNode;
   private Object data;

   public Tree() {
      super();
   }
   public Tree(boolean leaf, Object data) {
      super(leaf);
      this.data = data;
   }
   public Object getData() {
      return data;
   }
   public Tree getPopulateNode() {
      if (populateNode == null) {
         String[] List_OF_Node = {
            "Frist Node", "Second Node", "Third Node", "Fourth Node", "Fifth Node"};
         stationRoot = new Tree(false, "Example Of Tree");

         for (int i = 0; i < List_OF_Node.length; i++) {
            Tree child = new Tree(true, List_OF_Node[i]);
            stationRoot.addChild(i, child);
         }
         populateNode = new Tree();
         populateNode.addChild(0, stationRoot);
      }
      return populateNode;
   }
}

上記のコードは、ブラウザに次の出力を生成します。

リッチツリー

<rich:treeModelAdaptor>

このコンポーネントは、Mapを入力として受け取り、繰り返し処理を行い、必要な出力をブラウザーに生成します。 再帰マップを作成する必要があるときはいつでも、 <rich:recursiveTreeModelAdaptor> という別のタグを使用できます。

次の例は、ブラウザでプロジェクト構造をレンダリングする方法を示しています。 RichFaces 3では、これら2つのタグは<rich:treeNodeAdaptor>および<rich:recursiveTreeNodeAdaptor>で使用されます。

<?xml version = "1.0" encoding = "UTF-8"?>
<!DOCTYPE html>
<html xmlns = "http://www.w3.org/1999/xhtml"
   xmlns:h = "http://java.sun.com/jsf/html"
   xmlns:f = "http://java.sun.com/jsf/core"
   xmlns:ui = "http://java.sun.com/jsf/facelets"
   xmlns:a4j = "http://richfaces.org/a4j"
   xmlns:rich = "http://richfaces.org/rich">

   <h:head>
      <title>Tree Model and Recursive Model Example</title>
   </h:head>

   <h:body>
      <h:form id = "form">
         <rich:tree toggleType = "AJAX" var = "item" style = "max-width: 400px">
            <rich:treeModelRecursiveAdaptor roots = "#{fileSystemBean.sourceRoots}"
               nodes = "#{item.directories}">

               <rich:treeNode>
                  #{item.shortPath}
               </rich:treeNode>

               <rich:treeModelAdaptor nodes = "#{item.files}">
                  <rich:treeNode>#{item}</rich:treeNode>
               </rich:treeModelAdaptor>
            </rich:treeModelRecursiveAdaptor>

         </rich:tree>
      </h:form>
   </h:body>

</html>

この例では、2つの新しいJava Beanを作成する必要があります。 以下は、必要なフォルダー名を保持するBeanクラス「FileSystemBean.java」のコードスニペットです。

import java.util.List;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.RequestScoped;

@ManagedBean
@RequestScoped

public class FileSystemBean {
   private static final String SRC_PATH = "/WEB-INF";
   private List<FileSystemNode> srcRoots;

   public synchronized List<FileSystemNode> getSourceRoots() {
      if (srcRoots == null) {
         srcRoots = new FileSystemNode(SRC_PATH).getDirectories();
      }
      return srcRoots;
   }
}

以下は、プロジェクトの必要なリーフノードを保持するBeanクラス「FileSystemNode.java」のコードスニペットです。

import static com.google.common.base.Predicates.containsPattern;
import static com.google.common.base.Predicates.not;
import static com.google.common.collect.Iterables.filter;
import static com.google.common.collect.Iterables.transform;

import java.util.ArrayList;
import java.util.Collections;
import java.util.List;
import java.util.Set;

import javax.faces.context.ExternalContext;
import javax.faces.context.FacesContext;

import com.google.common.base.Function;
import com.google.common.collect.Iterables;
import com.google.common.collect.Lists;

public class FileSystemNode {
   private static final Function<String, FileSystemNode>
      FACTORY = new Function<String, FileSystemNode>() {

      public FileSystemNode apply(String from) {
         return new FileSystemNode(from.substring(0, from.length() - 1));
      };
   };
   private static final Function<String, String>
      TO_SHORT_PATH = new Function<String, String>() {

      public String apply(String from) {
         int idx = from.lastIndexOf('/');
         if (idx < 0) {
            return from;
         }
         return from.substring(idx + 1);
      };
   };
   private String path;
   private List<FileSystemNode> directories;
   private List<String> files;
   private String shortPath;

   public FileSystemNode(String path) {
      this.path = path;
      int idx = path.lastIndexOf('/');

      if (idx != -1) {
         shortPath = path.substring(idx + 1);
      } else {
         shortPath = path;
      }
   }
   public synchronized List<FileSystemNode> getDirectories() {
      if (directories == null) {
         directories = Lists.newArrayList();

         Iterables.addAll(directories, transform(filter(
            getResourcePaths(), containsPattern("/$")), FACTORY));
      }
      return directories;
   }
   public synchronized List<String> getFiles() {
      if (files == null) {
         files = new ArrayList<String>();

         Iterables.addAll(files, transform(filter(
            getResourcePaths(), not(containsPattern("/$"))), TO_SHORT_PATH));
      }
      return files;
   }
   private Iterable<String> getResourcePaths() {
      FacesContext facesContext = FacesContext.getCurrentInstance();
      ExternalContext externalContext = facesContext.getExternalContext();
      Set<String> resourcePaths = externalContext.getResourcePaths(this.path);

      if (resourcePaths == null) {
         resourcePaths = Collections.emptySet();
      }
      return resourcePaths;
   }
   public String getShortPath() {
      return shortPath;
   }
}

上記の例では、ブラウザに次の出力が生成されます。

リッチツリーモデルアダプター