Fight the Future

Java言語とJVM、そしてJavaエコシステム全般にまつわること

プレゼン、ボランティアコーチします!

勉強会でスピーカーをやりたいけど、プレゼンが初めて、苦手という方に無償でコーチします!資料レビューや録画リハへアドバイスします。Twitter@jyukutyoまでメンションでもDMでも。

私はデブサミやJJUG CCCなど200人規模で登壇経験ありです。海外での登壇も短いながらあり。デブサミ2017では公募スピーカー1位でした!

Introducing Apache Wicketの超意訳(8)

http://www.theserverside.com/tt/articles/article.tss?l=IntroducingApacheWicket

There are two things that probably caught your eye in the markup.
The first is the wicket:id="stylesheet" attribute on the element.
This is the markup portion of the StyleSheetReference added in the BasePage class.
The component ID must be the same in both the code and the markup.


Second, you probably noticed the element.
This tells the markup parser to include markup from subclasses where the tag occurs.
You'll see this in action when the ViewContact page is created.
Our next task is to create a reusable search form and add it to the BasePage.


As mentioned above in the discussion about components, Wicket has two primary types of components: components with markup and those without.
We've already looked at Pages, the primary type of markup container.
Now we're going to explore Panels.
Unlike Pages, Panels can't live on their own - they need to live in a Page.
However, Panels are very similar to Pages in that they have their own markup files and can take advantage of markup inheritance.
Let's build a panel with a form.


First, we create our Panel class:

おそらくマークアップで目を引くところが2ヶ所あります。
1つは要素にあるwicket:id="stylesheet"属性です。
これはBasePageクラスに追加したStyleSheetReferenceへのマークアップの一部です。
コンポーネントIDはコードとマークアップで一致していなければなりません。


2つめはおそらく要素でしょう。
これはタグを使ったときにサブクラスのマークアップも含めることをマークアップのパーサーに伝えます。
ViewContactページが生成されたときに実際にこれを見つけるでしょう。
次のタスクは再利用可能な検索フォームを作成しBasePageに追加することです。


コンポーネントの議論においてすでに述べたように、Wicketにはコンポーネントの主要な型が2つあります。マークアップがあるコンポーネントとそうでないコンポーネントです。
マークアップコンテナの主要な型であるPageについてすでに見てきました。
ではPanelに迫りましょう。
Pageと違い、Panelはそれ自身だけでは生存できません。Pageの中でしか生きられないのです。
しかしながら、Panelは自信のマークアップファイルを持ち、マークアップの継承を利用するという点でとてもPageに似ています。
フォームとともにパネルを構築してみましょう。


初めにPanelクラスを作成します。

public class SearchPanel extends Panel {

    public SearchPanel(String id) {
        super(id);
        add(new SearchForm("searchForm"));
    }

    private class SearchForm extends Form {

        private String searchString;

        public SearchForm(String id) {
            super(id);

            add(new TextField("searchString",
                  new PropertyModel(this, "searchString")));
            add(new BookmarkablePageLink("addContact",
                  EditContact.class));
        }

        public void onSubmit() {
            PageParameters params = new PageParameters();
            params.add("searchString", getSearchString());
            setResponsePage(ListContacts.class, params);
        }

        public String getSearchString() {
            return searchString;
        }

        public void setSearchString(String searchString) {
            this.searchString = searchString;
        }
    }

}

This is the largest chunk of code we've examined, so let's take it one piece at a time.
First, the constructor:

これは今までで最も長いコードです。なので、1度に少しずつ見ていきましょう。
まずはコンストラクタからです。

public SearchPanel(String id) {
super(id);
add(new SearchForm("searchForm"));
}

Our SeachPanel extends Panel, so it has to call the super constructor passing in the component ID.
Remember that Panels can't live on their own; they have to be added to Pages.
Since they have to be added, they need a component ID referenced in the Page's markup.

SeachPanelはPanelを継承します。そのため、コンポーネントのIDを渡してスーパークラスのコンストラクタを呼び出す必要があります。
Panelはそれ自身だけでは生存できないことを思い出してください。Pageに追加する必要があります。
追加した以降は、Pageのマークアップにおいて参照するときにコンポーネントIDが必要です。