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でっす。

 メニューのイメージだけ色にしてみました。上のメニューをみてみてください。みどり色です。

ぃいじょーです。

最近歯医者通ってるんですけど。

治療してる虫歯を金属の棒でごちごち叩いて、「痛いですか?」って聞いてきます。

その時は「痛いです」と答えましたが、

「そんなにごちごち叩いたら、虫歯じゃなくても痛いです!叩くなっ!」

って答えたいです。これが伝わるよな「痛いです」の方法はないでしょうか。

それでは。

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

CAPTCHA


前の記事

Wicket 挑戦記 Vol.6

次の記事

Wicket 挑戦記 Vol.8