Wicket 挑戦記 Vol.7
~メニュー編~
大分かかってしまいました。一週間はかかってしまいました。
サンプル毎にメニューを追加したいと思い、どうせやるならとwicket-jqueryに挑戦してみました。それでは、本編スタート。
まずはmvnリポジトリからあさります。いつもお世話になっております。
いまのところ9.x系で最新の9.12でいきます。
LicenseはApache 2.0です。OKですね。Mavenの文字をコピーします。
これを、pom.xmlにはりつけます。最初にダウンロードしたwicket.versionは9.14ですが、
ぷろばいでど でぃぺんでんしー(日本語がわかりません。)は9.12.0とあるのでpom.xmlもそれにあわせます。
wicketのversionを9.12.0にさげて、wicket-jquery-uiのversionも変数に変更します。
pom.xmlに保存したら、勝手にダウンどーろが始まります。ライブラりのなかをのぞきます。
jquery-ui.jsが入っています。v1.13.2のようです。リソースリファレンスのコメントはv.1.11.1とありますが、気にしません。
あと名前がでてしまうところの削除がめんどーです。どこかで消し忘れてもそっとしておいてください。
メニューはベースhtmlに置きます。
①:メニューの1階層目にSampleを入れます。
②:1階層目のSampleの子メニューにSample001を入れてます。Sample001~と続けていきたいと思います。
③:ベースHtmlのwicket:idにメニューを追加します。
④:画面左側に設定したcss(left)に差し込みます。
⑤:Sample001メニュークリックでSample001のページを開くようにします。
⑥:自前のスタイルシートを登録します。下で説明します。
メニューがどーてきに作成できてうれしいですね。メニューがどーてきに作成できる。うれしいですね。昔懐かしいJava Swingみたいです。
これがWebでできるんですから時代はかわりましたね。
それでは起動してみます。
マウスを重ねたときのメニュー表示です。
画面遷移もばっちりです。
マウスを重ねたとき、”Sample”メニューが”Hello Wicket World”よりも前に来ていますが、最初は来ませんでした。
なので、前にくるよう自前で作成しました。
⑦:自前のクエリを登録します。
⑧:前にくるようにz-index:2としました。ほかはそのままです。
⑨:これも自前。というかもともとのjQueryのアイコンpngでっす。
メニューのイメージだけ緑色にしてみました。上のメニューをみてみてください。みどり色です。
ぃいじょーです。
最近歯医者通ってるんですけど。
治療してる虫歯を金属の棒でごちごち叩いて、「痛いですか?」って聞いてきます。
その時は「痛いです」と答えましたが、
「そんなにごちごち叩いたら、虫歯じゃなくても痛いです!叩くなっ!」
って答えたいです。これが伝わるよな「痛いです」の方法はないでしょうか。
それでは。