Challenge Engineer Life !

エンジニア人生を楽しみたい!仕事や趣味で学んだ技術的なことを書いていくブログです。

PrimeFaces 5.0 RC1がリリースされました!

JSFのコンポーネントライブラリであるPrimeFacesの5.0 RC1がリリースされました。

少し前に5.0で、どんなコンポーネントが追加されるか、簡単に紹介させて頂きました。

PrimeFaces 5.0の新コンポーネントや新機能!

というわけで早速RC1をちょっと触ってみました。

Maven使うのが楽なのでMavenと、今回はJava EE7(GlassFish 4.0), JDK 8でサンプル作ってみました。

PrimeFaces用のMavenリポジトリがあるのでrepositoriesタグに以下を追加して

<repositories>
    <repository>
        <id>prime-repo</id>
        <name>PrimeFaces Maven Repository</name>
        <url>http://repository.primefaces.org</url>
        <layout>default</layout>
    </repository>
</repositories>

依存性は以下定義すれば準備OKです。

<dependency>
    <groupId>org.primefaces</groupId>
    <artifactId>primefaces</artifactId>
    <version>5.0.RC1</version>
</dependency>

PrimeFacesのDataTableは結構いろんなことができるので、業務システム的にはありがたかったのですが、なぜか今までずっと行固定しかなくてカラム固定がありませんでした…。

海外はそういうものなのか?と思っていましたが、やはり海外でもあちこちそういう要望あって、今回の5.0で無事に入ったみたいです。

ということで、今回はそれをサンプルに。

先に結果から。

カラムを2個固定した場合

f:id:kikutaro777:20140416224847j:plain

スクロールすると

f:id:kikutaro777:20140416224856j:plain

カラムを3個固定に変えてみると

f:id:kikutaro777:20140416224908j:plain

ふむふむ、悪くない。

固定するカラムの数はビュー定義でfrozenColumns属性を指定するだけなので簡単です。
以下、ビューの定義

<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:p="http://primefaces.org/ui">
    <h:head>
        <title>女優さん一覧</title>
    </h:head>
    <h:body>
        <h:form>
            <p:dataTable var="actress" value="#{actressBean.listActress}" 
              frozenColumns="3" scrollable="true" scrollWidth="400">
                <p:column headerText="名前">
                    <h:outputText value="#{actress.name}" />
                </p:column>
                <p:column headerText="年齢">
                    <h:outputText value="#{actress.age}" />
                </p:column>
                <p:column headerText="生年月日">
                    <h:outputText value="#{actress.birth}" />
                </p:column>
                <p:column headerText="身長">
                    <h:outputText value="#{actress.height}" />
                </p:column>
                <p:column headerText="血液型">
                    <h:outputText value="#{actress.blood}" />
                </p:column>
                <p:column headerText="所属事務所">
                    <h:outputText value="#{actress.company}" />
                </p:column>
            </p:dataTable>
        </h:form>
    </h:body>
</html>

Backing Beanは

import java.io.Serializable;
import java.time.LocalDateTime;
import java.time.LocalTime;
import java.util.Arrays;
import java.util.List;
import javax.annotation.PostConstruct;
import javax.faces.view.ViewScoped;
import javax.inject.Named;
import lombok.Getter;

@ViewScoped
public class ActressBean implements Serializable{

    @Getter
    private List<Actress> listActress;
    
    @PostConstruct
    public void init(){
        System.out.println("hello");
        listActress = Arrays.asList(
                new Actress("堀北真希", 25, LocalDateTime.of(1988, 10, 6, 0, 0), "SweetPower", 160, BloodType.B),
                new Actress("宮崎あおい", 28, LocalDateTime.of(1985, 11, 30, 0, 0), "ヒラタオフィス", 163, BloodType.O),
                new Actress("有村架純", 21, LocalDateTime.of(1993, 2, 13, 0, 0), "フラーム", 160, BloodType.B)
        );
    }
}

Java 8のDate and Time API全然使い慣れず…ちょっと適当です(^^;汗 勉強せんと。

あとは女優さんクラスと

import java.time.LocalDateTime;
import lombok.AllArgsConstructor;
import lombok.Getter;
import lombok.Setter;

@Getter @Setter
@AllArgsConstructor
public class Actress {
    private String name;
    private int age;
    private LocalDateTime birth;
    private String company;
    private int height;
    private BloodType blood;
}

enumだけ

public enum BloodType {
    A,
    B,
    O,
    AB
}

これから少しずつ5.0RC1触っていこうと思います~。

にほんブログ村 IT技術ブログへ
にほんブログ村 にほんブログ村 IT技術ブログ Javaへ
にほんブログ村