ubuntu-makeのこと
Android Studioをインストールしてみようと思って、
取得場所を探してみると、
ubuntu-makeの記事が目についた。
開発ツールの導入をサポートしてくれるアプリで、
これを使うと開発環境(この場合OSか)に合わせた"最新版"を導入できる、とのこと。
対象のツールも下記サイトによると多岐にわたっている。
はてなブックマーク - 第372回 Ubuntu Makeで簡単にAndroid開発環境を構築する:Ubuntu Weekly Recipe|gihyo.jp … 技術評論社
ファイルを探してページをめくるより、
こっちのほうが楽そうなので使ってみた。
ubuntu-makeはppaから導入する。
sudo add-apt-repository ppa:ubuntu-desktop/ubuntu-make sudo apt-get update sudo apt-get install ubuntu-make
使い方は簡単。
ターミナルから下記を実行すればOK。
umake android android-studio --accept-license
オプションの'--accept-license'はライセンス同意をスキップするオプション。
これを付けない場合は、ターミナルにライセンス条項が表示され、
同意をするかしないかを選ぶ必要があったらしいのだが、
実際に実行してみると、
そもそもライセンスが条項が取得できずにエラー終了してしまう。
そのため、このオプションを付けて実行した。
ubuntu-makeを実行するとインストールパスを問われるので、
適時修正後、enterを押すとダウンロードが始まる。
ダウンロードが終了するとubuntu-makeは終了してしまうので、
インストール先にあるandroid studioのインストーラを実行する必要がある。
結局のところ、
今回のubuntu-makeはインストーラのダウンロードだけしかしていないけど、
ファイルを探しまわる手間を考えると、
これはこれでありのような気がした。
あとは、eclipseをインストールするとどうなるかを試してみたいが、
eclipseはすでにあるので、
次のLTSをインストールする際に試してみようかな。
ちなみに、android-sdkやらndkもインストールできるとマニュアルには書いてあったけど、
ファイルが見つからないとかなんとかで、sdkのインストールはできなかった。
結局、sdkやndkはandroid studioのメニューからインストールした。
Android-x86のこと
スマホ嫌いでガラケー持ちだけど、androidが触りたくて
PC用Android OSであるAndroid-x86をインストールしてみた。
VirtualBoxにインストールするのが楽だけど、
速度が出ないのでノートPCに入れてみた。
ISOイメージはAndroid-x86の開発元から取得した。
インストールメディアを焼くのが面倒だったので
Unetbootinを使ってブータブルUSBメモリを作り、
ノートPCにインストールした。
UNetbootin - Homepage and Downloads
インストールで迷うところはあまりないが、
ディスクのパーティションについては、
予め作成しておくほうが楽みたい。
ちなみにLVMは使えないので、
インストールにはプライマリパーティションが必要。
ファイルシステムには
Android 4.4ベースの場合はext3まで、5以降はext4が使用できる。
Ubuntuなどとのデュアルブート環境を構築している場合は、
Grubを上書きしないように注意が必要かも。(yes, noの選択でスキップできる)
また、EFI用のBootメニューを作るかどうかも聞かれるので、
EFIが不要の場合は間違って設定してしまわないように注意する。
GrubのメニューにAndroid-x86の起動メニューを追加した際は、
Grub設定を直接編集せず、Grub Customizerをインストールして、ツールから編集を行った。
編集内容については、Unetbootinで作成したUSBメディア内のsysLinux.cfgを参考に書き加えた。
ちなみに1行目のroot='hd0,3'(sda3の意)やカーネルなどのパスについては、環境によって当然変える必要がある。
set root='hd0,3' linux /android-4.4-r5/kernel quiet root=/dev/ram0 androidboot.hardware=android_x86 src=/android-4.4-r5 initrd /android-4.4-r5/initrd.img
アプリによっては動かないものもあるけれど、
エミュレータよりはサクサク動かせるし、ストレスは少ない。
Ubuntu インストール時に手動でLVMパーティションを編成する方法
Ubuntuをインストールする際、
ディスクのパーティションをどうするかを選ぶことができるが、
位しかできない。
インストーラでは手動パーティション編成を選んでも、LVM管理の操作は行えない。
パーティションを自分で編集し、
なおかつLVM管理としたい場合はどうしたら良いのかがわからなかった。
調べてみると、インストーラを起動する前に、事前にディスク操作が必要らしい。
少し古いがこの記事が役に立った。
ubuntu12.04 LTSまでの記述だったが、14.04 LTSでも同じ操作で問題なかった。
UbuntuDesktopLVM - Community Help Wiki
ここの手順は基本コマンドで対応するのだけれど、
なるべくGUIで操作したかったので、
そのあたりを記録しておく。
以下、実施した手順。
UbuntuのLive CDなりUSBメディアなりで起動。
ルートを含む起動中のディスクは編集できないので、別のメディアから起動する。
Dashからディスクを起動
画面から既存のパーティションを削除して、まずは物理的にパーティションを切る。
ここではBoot領域、Ubuntu領域、別OS領域とした。
領域名 | タイプ | フォーマット | 備考 |
boot領域 | primary | ext2 | 自動インストール時に/bootがext2だったので。 |
Ubuntu領域 | extended | - | 拡張領域に論理領域を作る事になる。 |
別OS領域 | primary | ext4 | ここにインストールするOSがLVMを扱えるなら、このようにパーティションをわけずに、LVM論理パーティションの一つにできるのだが。 |
Gparted (Gparted パーティション編集ツール)を起動
Live CDに含まれるGpartedを使用して拡張領域に論理領域を作成する。
(画像は作成後のもの。作成時はマウントポイントもラベルもブランクでOK)
/dev/sda2の拡張領域上にカーソルを合わせると、ツールバーの追加ボタンが有効になるので押す。
領域サイズとファイルシステムタイプを問われるので、
領域サイズは"すべて"、ファイルシステムタイプは"lvm2 pv"とする。
ダイアログを閉じるとパーティションは"新規追加"みたいな表示だけで、まだ確定されていない。
編集内容はツールバーの保存ボタンを押すと反映される。
ここまではLVM管理の受け皿を作ったに過ぎず、
実際のボリューム設定はコマンドで行った。
参考元の記事を見ながらやれば、間違いが少ない。
pvcreate 論理領域に物理ボリュームを作る
sudo pvcreate /dev/sda5
vgcreate ボリュームグループを作る
sudo vgcreate ubuntu-vg /dev/sda5
lvcreate 論理ボリューム、論理swapを作る
sudo lvcreate -L 16G -n lvswap ubuntu-vg sudo lvcreate -l 100%FREE -n lvroot ubuntu-vg
lvdisplay 論理ボリュームの確認
sudo lvdisplay
mkfs.XXX mkswap ファイルシステムの作成
sudo mkfs.ext4 /dev/mapper/ubuntu--vg-lvroot
sudo mkswap -f /dev/mapper/ubuntu--vg-lvswap
ファイルシステムの名前(/dev/mapper以下)はグループ名+"-"+倫理ボリューム名にする。
その際、名称に"-"を含んでいる場合は、"--"としてエスケープしないといけない。
コマンドはファイルシステムがext4用のものとswap用のもので異なるが、
使い方はだいたい同じ。
インストーラを起動
インストーラで手動選択を選ぶと、インストール先選択にLVM管理の論理ボリュームが表示されるので、
boot領域に/boot, ubuntu-vg-lvrootに/, ubuntu-vg-lvswapにswapをそれぞれ設定する。
ブートローダのインストール先は/dev/sdaとする。
インストールが完了し、再起動後、問題がなければOK。
参考記事では、再起動前にマウントしてみろとか書いてあったけど、
イマイチ理由が読み取れなかったので無視した。
というわけで、手動でディスク割り+LVM適用は、結構めんどくさいが、
最初にやっておけば、LVM管理の論理ボリュームは領域の増減が楽なので後々悩む必要がなくなるかもしれない。
ソフトウェアアップデートに失敗する時の対処方法
一度サボりぐせがつくと、いけませんね。
このブログ、1ヶ月以上放置してしまった。
ま、気を取り直して、書くだよ。
えっと、表題どおり、
ウチのPCが更新できなくなってしまった。
apt-get updateをかけると、こんなエラーで止まってしまう。
W: http://jp.archive.ubuntu.com/ubuntu/dists/trusty-updates/main/binary-amd64/Packages の取得に失敗しました ハッシュサムが適合しません W: http://jp.archive.ubuntu.com/ubuntu/dists/trusty-updates/universe/binary-amd64/Packages の取得に失敗しました ハッシュサムが適合しません W: http://jp.archive.ubuntu.com/ubuntu/dists/trusty-updates/main/binary-i386/Packages の取得に失敗しました ハッシュサムが適合しません W: http://jp.archive.ubuntu.com/ubuntu/dists/trusty-updates/universe/binary-i386/Packages の取得に失敗しました ハッシュサムが適合しません E: いくつかのインデックスファイルのダウンロードに失敗しました。これらは無視されるか、古いものが代わりに使われます。
URLにあるサーバーが何らかの事情で変わってしまったみたい。
更新できないのも困りものなので、更新サーバーを変更して対処してみる。
これは知らなかったのだが、
一口に日本サーバーといっても複数あるようなので、
別のサーバーをチョイスしてみることにした。
- [システム設定]のパネルから[ソフトウェアとアップデート]を選択し、ダイアログを表示する。
- Ubuntuソフトウェアのタブにあるダウンロード元を「日本のサーバー」から「その他..」を選ぶ。
- サーバー選択のツリーにある日本のサーバー群から好きなものを選ぶ。迷ったら[最適なサーバーを探す]ボタンを押して選んでもらう。
- [サーバーの選択]ボタンを押してダイアログを閉じる。
これで問題なく更新ができるようになった。
Ubuntuを使っていると日々、色々なことがあるねぇ。。
JavaEE 7をやってみよう。 JSF 画面遷移 その2
その1のつづき。
登録画面用のManaged Beanを作る。
その前に、Managed Beanで使う艦種情報検索用の機能をJPAの回で作ったEJBに追加する。
WarshipServiceLocal.java
EJBモジュールのインターフェイス。
ここにgetAllTypeList()とgetWarship(Warship key)を追加する。
getAllTypeList()は艦種リストを取得するメソッド。
主に艦種選択リストのデータ取得に使用する。
getWarship(Warship key)は艦艇IDから艦艇情報を取得するメソッド。
これはまだ使う予定は無いが、更新を作るときに使うのでついでに作る。
package ejbModule; import java.util.List; import javax.ejb.Local; import model.Warship; import model.WarshipType; @Local public interface WarshipServiceLocal { public List<Warship> getAllList(); public List<WarshipType> getAllTypeList(); public Warship getWarship(Warship key); }
WarshipService.java
getAllTypeList()とgetWarship(Warship key)の実装を追加する。
getAllTypeList()に関しては、getAllListメソッドと同じ作りなので楽勝。
条件を付ける方にしても、プライマリキーで検索する場合では、
すでにEntityManaegerに用意されているfindメソッドを使えば良いのでこれまた楽勝。
findメソッドの第1パラメータが取得するクラス、第2パラメータがキー値。
この場合、取得クラスはWarshipクラスで、キー値はStringのID。
もっとも、対象テーブルが複合キーだったりすると、
このやり方は通用しないのだが(なんせ、第2パラメータに渡せるのはキー値そのものだから)、
そのことについてはまた、別の機会に。
package ejbModule; import java.util.List; import javax.ejb.LocalBean; import javax.ejb.Stateless; import javax.ejb.TransactionAttribute; import javax.ejb.TransactionAttributeType; import javax.persistence.EntityManager; import javax.persistence.PersistenceContext; import model.Warship; import model.WarshipType; /** * Session Bean implementation class WarshipService */ @Stateless @LocalBean @TransactionAttribute(TransactionAttributeType.REQUIRED) public class WarshipService implements WarshipServiceLocal { @PersistenceContext private EntityManager entityManager; /** * Default constructor. */ public WarshipService() { } @Override public List<Warship> getAllList() { return entityManager.createNamedQuery("Warship.findAll", Warship.class).getResultList(); } @Override public List<WarshipType> getAllTypeList() { return entityManager.createNamedQuery("WarshipType.findAll", WarshipType.class).getResultList(); } @Override public Warship getWarship(Warship key) { return entityManager.find(Warship.class, key.getId()); } }
EJBを直したら、次はManaged Bean。
WarshipDefault.java
艦種、艦名保持用のフィールド、
艦種リスト取得、
艦艇取得を共通化するためのabstractクラス。
編集画面でも同じような構成の画面になるので、こんなクラスを作成してみた。
新規登録画面でのManaged Beanはこれを継承したものとなる。
package app.manage; import javax.annotation.PostConstruct; import javax.ejb.EJB; import javax.faces.model.ListDataModel; import model.Warship; import model.WarshipType; import ejbModule.WarshipServiceLocal; public abstract class WarshipDefault { @EJB protected WarshipServiceLocal ejb; /** 入力フィールド値の格納用 **/ private Warship warship; @PostConstruct private void init() { warship = new Warship(); warship.setWarshipType(new WarshipType()); } public ListDataModel<WarshipType> findAllWarshipType() { return new ListDataModel<WarshipType>(ejb.getAllTypeList()); } public void find() { Warship key = new Warship(); key.setId(getWarshipId()); warship = ejb.getWarship(key); } public Warship getWarship() { return warship; } public void setWarship(Warship warship) { this.warship = warship; } public abstract Integer getWarshipId(); public abstract void update(); }
WarshipRegister.java
今のところ登録処理は作ってないので、
実質、空実装に等しいが、登録メソッドも作った。
package app.manage; import javax.enterprise.context.RequestScoped; import javax.inject.Named; @RequestScoped @Named(value="WarshipReg") public class WarshipRegister extends WarshipDefault { @Override public Integer getWarshipId() { // 新規登録ではfindを使わないため、空実装 return null; } @Override public void update() { // TODO ejbに登録メソッドを作成後に実装 } }
ここまでで、ひとまず、Java側はおしまい。
新規登録画面のinsert.xhtmlに艦種リストの呼び出しと登録メソッドの呼び出しを追加する。
insert.xhtml
入力項目の格納先には、Managed Beanに用意したフィールドをあてがう*1。
フィールドはWarshipクラスなので、Warshipクラスのメンバをそれぞれ指定することになる。
艦種選択リストのOptionタグに当たる部分については、selectItemsタグを使ってListDataModelから生成できる。
selectItemsタグはselectOneMenuタグの中に記述する。
使い方はdataTableタグと似ている。
valueにはリスト値を、varにはその要素を表す変数名を指定できる点は、全く同じ。
他に、itemLabelには表示する値、itemValueには選択時に送信される値を設定する。
itemLabelEscpedは文字通り表示値をエスケープするか否かで、trueにすれば、
HTMLコードもそのまんま文字として出力できる。
あとは、登録時の呼び出しとして、
登録ボタンにactionListenerを追加した。
actionListenerには、登録メソッドたる、updateメソッドの呼び出しを記述した。
actionListenerはManaged Beanのメソッドの呼び出しが行える。
ただし、呼び出すメソッドにはパラメータを持たせることが出来ない。
戻り値はvoidかStringであることが条件。
JSFでは、actionLisener → actionの順で処理が行われるので、
actionListenerを使えば、メソッド呼び出し後に画面遷移を行うことができる。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core"> <h2><h:outputLabel value="#{staticText['warship.reg.lblSreenTitle']}" /></h2> <hr/> <h:messages id="errorText" layout="table" errorClass="error-message"/> <h:outputLabel value="#{staticText['warship.reg.lblWarshipType']}" /> <h:selectOneMenu id="warshipType" value="#{WarshipReg.warship.warshipType.typeId}" styleClass="warship-type-select" > <f:selectItems value="#{WarshipReg.findAllWarshipType()}" var="warshipType" itemLabel="#{warshipType.name}" itemValue="#{warshipType.typeId}" itemLabelEscaped="true" /> </h:selectOneMenu> <h:outputLabel value="#{staticText['warship.reg.lblWarshipName']}" /> <h:inputText id="warshipName" value="#{WarshipReg.warship.name}" styleClass="warship-name-input" required="true" autocomplete="off" /> <br/> <h:commandButton value="#{staticText['warship.reg.btnRegister']}" action="catalog" actionListener="#{WarshipReg.update()}" /> <h:commandButton value="#{staticText['warship.reg.btnRegisterAndRegister']}" /> </ui:composition>
といったところで、テスト実行。
画面を動かしてメニューから新規登録を選ぶと入力画面へ遷移でき、
入力画面では艦種選択リストが表示できている。
また、艦名を入力した後に登録ボタンを押すと一覧画面に遷移できる。
こんな感じで選択リストの表示と、登録ボタンの処理はできた。
次回はJPAの続きとして新規登録(Insert)の実装を行う。
*1:ほんとは、入力項目と1対1とフィールドを設けたほうがわかりやすいとは思うけど、色々思ってこうした
JavaEE 7をやってみよう。 JSF 画面遷移 その1 navigation-rule
前回、簡単な画面を作成したので、
今回はそれを拡張して、新規登録画面への画面遷移を作る。
サイドメニューの「艦艇登録」リンクを押下して、登録画面へ遷移するイメージ。
通常であれば、HTMLのリンクには、遷移先のURLを記載すればOKなのだが、
それではミもフタもないので、JSFの機能であるNavigation-ruleを使ってみる。
Navigation-ruleはfaces-config.xmlに記載する画面遷移設定のことで、
条件をXMLに記載しておけば、
JSF側のソースにURLを書かずとも画面遷移を構築できる。
遷移元→遷移先のURLを設定ファイルに持つため、
URL変更の手間も軽減できる*1……かもしれない。
といったところで、実装開始。
まず、遷移元のソースはあるので、遷移先のソースを作る。
はじめに書いた通り、新規登録の入力画面を作る。
jsf/contents/warship/insert.xhtml
入力項目である艦種と艦名、登録ボタンを持つ画面を画面部品として作る。
画面項目などの項目名、ボタン名はリソースファイルに持たせた。
入力値の格納や登録処理を行うManaged Beanはまだ未作成のため、
画面のソースにも処理は記載していない。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core"> <h2><h:outputLabel value="#{staticText['warship.reg.lblSreenTitle']}" /></h2> <hr/> <h:messages id="errorText" layout="table" errorClass="error-message"/> <h:outputLabel value="#{staticText['warship.reg.lblWarshipType']}" /> <h:selectOneMenu id="warshipType" value="" styleClass="warship-type-select" > </h:selectOneMenu> <h:outputLabel value="#{staticText['warship.reg.lblWarshipName']}" /> <h:inputText id="warshipName" value="" styleClass="warship-name-input" required="true" autocomplete="off" /> <br/> <h:commandButton value="#{staticText['warship.reg.btnRegister']}" action="catalog" /> <h:commandButton value="#{staticText['warship.reg.btnRegisterAndRegister']}" /> </ui:composition>
site-title= 艦艇これくしょん copyright=(C) ひこぽん(nagamitsu1976) # 画面ラベル # サイドメニュー warship.menu.lnkCatalog=艦艇図鑑 warship.menu.lnkRegister=艦艇登録 warship.menu.lnkEdit=艦艇編集 warship.menu.lnkRemove=艦艇削除 # 艦艇登録 warship.reg.lblSreenTitle=艦艇登録 warship.reg.lblWarshipType=艦種 warship.reg.lblWarshipName=艦名 warship.reg.btnRegister=登録 warship.reg.btnRegisterAndRegister=連続登録 warship.reg.btnEdit=編集 warship.reg.btnBack=戻る
.warship-type-select { width: 120px; margin: 10px; } .warship-name-input { width: 220px; margin: 10px; }
jsf/view/warship/insert.xhtml
上で書いた入力画面部品をレイアウトに適用した登録画面のソース。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:h="http://java.sun.com/jsf/html" template="/jsf/layout/common/layout.xhtml"> <ui:define name="title">#{staticText['warship.menu.lnkRegister']}</ui:define> <ui:define name="content"> <ui:include src="/jsf/contents/warship/insert.xhtml"/> </ui:define> </ui:composition>
jsf/contents/common/menu.xhtml
メニューの画面部品。
commandLinkタグを使って、メニューのリンクを追加した。
また、文字列をリソースファイルから取得するように合わせて修正。
ここで注目するのは、リンク先の指定について。
URLはタグ内に一切含めていない。action属性に文字列を設定しただけ。
comandLinkやcommandButtonタグのaction属性には基本、文字列を定義する。
JSFではリンクやボタンを押した時、action属性の値を使ってnavigation-ruleを参照し、
条件に該当するルールを特定する。
特定できたnaviation-ruleから遷移先のURLを取得して画面遷移を行う、というわけ。
ここでは"catalog", "register", "edit", "remove"というルールがあると想定している。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:h="http://java.sun.com/jsf/html"> <div><h:commandLink action="catalog" value="#{staticText['warship.menu.lnkCatalog']}" immediate="true"/></div> <div><h:commandLink action="register" value="#{staticText['warship.menu.lnkRegister']}" immediate="true" /></div> <div><h:commandLink action="edit" value="#{staticText['warship.menu.lnkEdit']}" immediate="true" /></div> <div><h:commandLink action="remove" value="#{staticText['warship.menu.lnkRemove']}" immediate="true" /></div> </ui:composition>
faces-config.xml
navigation-ruleをfaces-config.xmlに追加した。
navigation-ruleタグで囲った部分が今回の追加部分。
from-view-idタグはこのルールを適用するページのURLを指定する。
サンプルのようにアスタリスクを使ったりして条件範囲を指定することも可能。
サンプルではサイドメニュー用のnavigation-ruleなので、
遷移元画面が/jsf/view/配下すべての画面が対象となっている。
navigation-caseタグに囲われたブロックに
判定条件であるfrom-outcomeタグと
遷移先を指定するためのto-view-idを記載する。
from-outcomeタグに定義した値を
HTML側のcommandLinkタグのaction属性に設定すれば、
ここの値を読み取ってサーバーが勝手にリンクを作ってくれる。
<?xml version="1.0" encoding="UTF-8"?> <faces-config xmlns="http://xmlns.jcp.org/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-facesconfig_2_2.xsd" version="2.2"> <application> <locale-config> <default-locale>ja</default-locale> </locale-config> <resource-bundle> <base-name>resources.statictext</base-name> <var>staticText</var> </resource-bundle> </application> <navigation-rule> <!-- 遷移元のJSP名を記述 --> <from-view-id>/jsf/view/*</from-view-id> <!-- アクションの結果によって遷移先を変更 --> <navigation-case> <from-outcome>catalog</from-outcome> <to-view-id>/jsf/view/warship.xhtml</to-view-id> </navigation-case> <navigation-case> <from-outcome>register</from-outcome> <to-view-id>/jsf/view/insert.xhtml</to-view-id> </navigation-case> </navigation-rule> </faces-config>
画面とリンクの定義をしたら、動作確認をしてみる。
サイドメニューから艦艇図鑑や艦艇登録のリンクを押すと、
ルール通り遷移することが確認できる。
艦艇編集や艦艇削除のリンクは、
ルールを定義していないので押下してもなにも起きない。
次回は登録画面用のManaged Beanを作って、
登録処理のイベントを作る。
といったところで次回へ続く。
*1:軽減可能かどうかは定義次第だと思うよ、実際。
JavaEE 7をやってみよう。 JSF テンプレートXML その3
JSF テンプレートについて補足。
JSF テンプレートXML その1でHTML画面の合成について書いたが、
その際に載せたHTMLがあんまり良くないらしい。
実行時に合成された画面のソースを表示してみると複数のBODYタグが含まれている。
というのも"画面パーツ"として掲載したHTMLはすべて、
HTMLタグから始まって、BODYタグなどをもつ、HTML4の形式で作った。
それらをJSFのテンプレートを通して合成しているので、
出来上がるページにはHTMLタグやBODYタグが複数存在してしまう。
それであっても、ブラウザは想定通りに画面を表示してしまうので、
無視していたのだが、後々、これが原因で問題が発生した。
必須入力チェックのエラーメッセージ表示処理を作成した際、
画面には正しくエラーメッセージが表示できるのだが、
その度にサーバーログに警告が書き込まれる、といった事象がそれ。
警告: FacesMessage がキューに入っていますが、表示されていません。
この警告をいくら調べても解決方法がわからない。
以前、バリデータの回ですでに確認済みの記法で書いたのに警告が出る。
しかも、バリデータの回ではこんな警告は出なかった。
結局のところ、テンプレートを使わずにHTMLを書いてみたら警告が出なくなったので、
画面合成に問題があることがわかった。
正しい合成の仕方としては、次のようになる。
- 画面パーツとなるHTMLにはHTMLタグは使わない。
すべてcompositionタグから始め、compositionタグに利用するxmlnsのURLを記載する。 - HTMLタグやBODYタグはテンプレート用HTMLにだけ使用する。
- FORMタグについてはテンプレートのみに持たせる方が無難。
画面パーツにも持たせられるが、合成時には注意が必要。
そんなわけで、前回掲載したHTMLは以下のようにするのが正しいので、
修正版を掲載する。
[修正後のHTMLはこちら](クリックで開く)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:f="http://java.sun.com/jsf/core" xmlns:h="http://java.sun.com/jsf/html"> <ui:include src="/jsf/contents/common/htmlHeader.xhtml"/> <ui:insert name="extHeader" /> <body> <h:form id="form1"> <div id="wrapper"> <div id="header"> <div id="header_body"> <ui:include src="/jsf/contents/common/header.xhtml"/> </div> </div> <div id="contents"> <ui:insert name="content" /> </div> <div id="left-sidebar"> <ui:include src="/jsf/contents/common/menu.xhtml"/> </div> <div id="footer"> <ui:include src="/jsf/contents/common/footer.xhtml"/> </div> </div> </h:form> </body> </html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:h="http://java.sun.com/jsf/html"> <h:head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <meta http-equiv="Pragma" content="no-cache" /> <meta http-equiv="Cache-Control" content="no-cache" /> <title><ui:insert name="title">Default title</ui:insert></title> <h:outputStylesheet library="css" name="default.css" /> </h:head> </ui:composition>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:h="http://java.sun.com/jsf/html"> <h:outputLabel value="#{staticText['site-title']}" /> </ui:composition>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:h="http://java.sun.com/jsf/html"> <h:outputLabel value="#{staticText['copyright']}" /> </ui:composition>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:h="http://java.sun.com/jsf/html"> <div>艦艇図鑑</div> <div>艦艇登録</div> <div>艦艇編集</div> <div>艦艇削除</div> </ui:composition>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:f="http://java.sun.com/jsf/core" xmlns:h="http://java.sun.com/jsf/html" xmlns:c="http://java.sun.com/jsp/jstl/core" xmlns:fn="http://java.sun.com/jsp/jstl/functions" xmlns:fmt="http://java.sun.com/jsp/jstl/fmt" xmlns:x="http://java.sun.com/jsp/jstl/xml"> <h2><h:outputLabel value="艦艇図鑑" /></h2> <h:dataTable var="item" value="#{warShipCat.allList}" styleClass="table" headerClass="headerrow" rowClasses="oddrow,evenrow"> <h:column> <f:facet name="header">No.</f:facet> <h:outputText value="#{warShipCat.allList.rowIndex + 1}" /> </h:column> <h:column> <f:facet name="header">艦種</f:facet> <h:outputText value="#{item.warshipType.name}" /> </h:column> <h:column> <f:facet name="header">名前</f:facet> <h:outputText value="#{item.name}" /> </h:column> </h:dataTable> </ui:composition>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:h="http://java.sun.com/jsf/html" template="/jsf/layout/common/layout.xhtml"> <ui:define name="title">#{staticText['warship.menu.lnkCatalog']}</ui:define> <ui:define name="content"> <ui:include src="/jsf/contents/warship/content.xhtml"/> </ui:define> </ui:composition>