PanelTabSetとInputRichText
ようやく動かせるようになってきたので、前から興味のあったコンポーネントを試してみます。
まずはPanelTabSetからで、そのままパレットからドロップします。デフォルトでいろいろなコンポーネントがついてきました。
<?xml version="1.0" encoding="UTF-8"?> <jsp:root version="2.1" xmlns:f="http://java.sun.com/jsf/core" xmlns:h="http://java.sun.com/jsf/html" xmlns:ice="http://www.icesoft.com/icefaces/component" xmlns:jsp="http://java.sun.com/JSP/Page"> <jsp:directive.page contentType="text/html;charset=UTF-8" pageEncoding="UTF-8"/> <f:view> <html id="outputHtml1"> <head id="outputHead1"> <ice:outputStyle href="./resources/stylesheet.css" id="outputStyle1"/> <ice:outputStyle href="./xmlhttp/css/xp/xp.css" id="outputStyle2"/> </head> <body id="outputBody1" style="-rave-layout: grid"> <ice:form id="form1"> <ice:panelTabSet height="264" id="panelTabSet1" selectedIndex="2" style="position: absolute; left: 48px; top: 24px" tabPlacement="Top" width="504"> <ice:panelTab id="panelTab1" label="panelTab1"> <ice:panelLayout id="panelLayout1" style="position: inherit; width: 100%; height: 100%;"> <ice:selectOneRadio id="selectOneRadio1" partialSubmit="true"> <f:selectItems id="selectOneRadio1selectItems" value="#{Page2.selectOneRadio1DefaultItems}"/> </ice:selectOneRadio> </ice:panelLayout> </ice:panelTab> <ice:panelTab id="panelTab2" label="panelTab2"> <ice:panelLayout id="panelLayout2" style="position: inherit; width: 100%; height: 100%;"> <ice:inputText id="inputText1" value="inputText value"/> </ice:panelLayout> </ice:panelTab> <ice:panelTab id="panelTab3" label="panelTab3"> <ice:panelLayout id="panelLayout3" style="position: inherit; width: 100%; height: 100%;"> <ice:selectOneMenu id="selectOneMenu1" partialSubmit="true"> <f:selectItems id="selectOneMenu1selectItems" value="#{Page2.selectOneMenu1DefaultItems}"/> </ice:selectOneMenu> </ice:panelLayout> </ice:panelTab> </ice:panelTabSet> </ice:form> </body> </html> </f:view> </jsp:root>
この状態のまま実行します。すると画面いっぱいにタブ画面が表示されます。PanelTabSet自体にはWidth設定はないようですね。
そこでPanelLayoutをドロップし、その中にPanelTabSetをドロップするとWidth設定ができました。なるほど。
でも、SelectOneRadioの縦位置が真ん中になっています。うーん、それぞれの位置関係がよく分からない。それぞれの領域の左上が原点ではないということか?要調査です。
InputRichTextはツールバーがごちゃごちゃしているのでカスタマイズしたいと思い、ICEFaces.orgのInputRichTextの解説を見ながら試してみました。
The following steps are involved in creating the custom toolbar: 1. Create a config file under the webapp, defining the custom toolbar(e.g.) js/config.js FCKConfig.ToolbarSets["MyToolbar"] = [['Bold','Italic', 'Underline'], ['Save']] ; 2. Set the "toolbar" attribute on the inputRichText component to define the custom toolbar name and set the "customConfigPath" attribute to reference the custom config.js.(e.g.) <ice:inputRichText toolbar="MyToolbar" customConfigPath="js/config.js"/>
結果はちゃんと動きませんでした。MyToolbarがありませんとエラーがでています。
デザイナ画面でもToolbarは選択制になっていて、他に選ぶ余地がなさそうです。・・・・訳が分からない。
NetBeansとの統合環境はICEFaces.orgから最新をダウンロードしてきています。NetBeansのデフォルトのデザイナでも同じ現象なので、何かうまくいかない理由があるのでしょうね・・・とほほな感じです。