【iDempiere Lab】ZK10.3よりVboxとHboxがDeprecatedになった事による修正

 iDempiereのUIのフレームワークとして使用しているZKにおいて、v10.3よりVBoxとHBoxがDeprecated(非推奨)になっています。

 非推奨になった理由は主に下記の３つの様子です。

• <table>タグベースでレイアウトが重い
• width/height の制御がブラウザ仕様で効きにくい
• DIV ベースの Vlayout/Hlayout の方が高速で柔軟

基本的な対応

Vbox -> Vlayoutへの変更

• Vbox.setAlign("stretch") -> vbox.setVflex("1");

Hbox -> Hlayoutへの変更

• Hbox.setAlign("center") -> CSSでtext-align:center
• Hbox.setPack("start") -> CSS で justify-content:flex-start
• Hbox.setPack("center") -> CSS で justify-content:center
• Hbox.setPack("end") -> CSS で justify-content:flex-end

Vbox/Hboxで “splitter” の機能を使用していた場合 -> Splitlayoutへの変更

参考サイト

ZKドキュメント

• https://docs.zkoss.org/zk_component_ref/vbox
• https://docs.zkoss.org/zk_component_ref/hbox