wicket-user-guide/src/docs/guide/helloWorld/helloWorld_3.gdoc - wicket - Git at Google



 To complete our first Wicket application we must explore the home page class that is returned by the @Application@'s method @getHomePage()@ seen above.
 In Wicket a web page is a subclass of @org.apache.wicket.WebPage@. This subclass must have a corresponding HTML file which will be used by the framework as template to generate its HTML markup. This file is a regular plain HTML file (its extension must be html).

 By default this HTML file must have the same name of the related page class and must be in the same package:

 !samepackage.png!

 _Illustration :Page class and its related HTML file_

 If you don't like to put class and html side by side (let's say you want all your HTML files in a separated folder) you can use Wicket settings to specify where HTML files can be found. We will cover this topic later in [chapter 16.9|guide:resources_9].

 The Java code for the @HomePage@ class is the following:

 {code}
 package org.wicketTutorial;

 import org.apache.wicket.request.mapper.parameter.PageParameters;
 import org.apache.wicket.markup.html.basic.Label;
 import org.apache.wicket.markup.html.WebPage;

 public class HomePage extends WebPage {
     public HomePage() {
 	add(new Label("helloMessage", "Hello WicketWorld!"));
     }
 }
 {code}

 Apart from subclassing @WebPage@, @HomePage@ defines a constructor that adds a @Label@ component to  itself.
 Method @add(Component component)@ is inherited from ancestor class @org.apache.wicket.MarkupContainer@ and is used to add children components to a web page. We'll see more about @MarkupContainer@ later in [chapter 5.2|guide:layout_2].
 Class @org.apache.wicket.markup.html.basic.Label@ is the simplest component shipped with Wicket. It just inserts a string (the second argument of its constructor) inside the corresponding HTML tag.
 Just like any other Wicket component, @Label@ needs a textual id (@'helloMessage'@ in our example) to be instantiated. At runtime Wicket will use this value to find the HTML tag we want to bind to the component. This tag must have a special attribute called @wicket:id@ and its value must be identical to the component id (comparison is case-sensitive!).

 Here is the HTML markup for @HomePage@ (file HomePage.html):

 {code:html}
 <!DOCTYPE html>
 <html>
 	<head>
 		<meta charset="utf-8" />
 		<title>Apache Wicket HelloWorld</title>
 	</head>
 	<body>

 		<div wicket:id="helloMessage">
 		[Label's message goes here]
 		</div>
 	</body>
 </html>
 {code}

 We can see that the @wicket:id@ attribute is set according to the value of the component id. If we run this example we will see the text @Hello WicketWorld!@ Inside a @<div>@ tag.

 {note}
 @Label@ replaces the original content of its tag (in our example @[Label's message goes here]@) with the string passed as value (@Hello WicketWorld!@ in our example).
 {note}

 {warning}
 If we specify a @wicket:id@ attribute for a tag without adding the corresponding component in our Java code, Wicket will throw a @ComponentNotFound@ Exception.  On the contrary if we add a component in our Java code without specifying a corresponding @wicket:id@ attribute in our markup, Wicket will throw a @WicketRuntimeException@.
 {warning}


	To complete our first Wicket application we must explore the home page class that is returned by the @Application@'s method @getHomePage()@ seen above.
	In Wicket a web page is a subclass of @org.apache.wicket.WebPage@. This subclass must have a corresponding HTML file which will be used by the framework as template to generate its HTML markup. This file is a regular plain HTML file (its extension must be html).

	By default this HTML file must have the same name of the related page class and must be in the same package:

	!samepackage.png!

	_Illustration :Page class and its related HTML file_

	If you don't like to put class and html side by side (let's say you want all your HTML files in a separated folder) you can use Wicket settings to specify where HTML files can be found. We will cover this topic later in [chapter 16.9\|guide:resources_9].

	The Java code for the @HomePage@ class is the following:

	{code}
	package org.wicketTutorial;

	import org.apache.wicket.request.mapper.parameter.PageParameters;
	import org.apache.wicket.markup.html.basic.Label;
	import org.apache.wicket.markup.html.WebPage;

	public class HomePage extends WebPage {
	public HomePage() {
	add(new Label("helloMessage", "Hello WicketWorld!"));
	}
	}
	{code}

	Apart from subclassing @WebPage@, @HomePage@ defines a constructor that adds a @Label@ component to itself.
	Method @add(Component component)@ is inherited from ancestor class @org.apache.wicket.MarkupContainer@ and is used to add children components to a web page. We'll see more about @MarkupContainer@ later in [chapter 5.2\|guide:layout_2].
	Class @org.apache.wicket.markup.html.basic.Label@ is the simplest component shipped with Wicket. It just inserts a string (the second argument of its constructor) inside the corresponding HTML tag.
	Just like any other Wicket component, @Label@ needs a textual id (@'helloMessage'@ in our example) to be instantiated. At runtime Wicket will use this value to find the HTML tag we want to bind to the component. This tag must have a special attribute called @wicket:id@ and its value must be identical to the component id (comparison is case-sensitive!).

	Here is the HTML markup for @HomePage@ (file HomePage.html):

	{code:html}
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8" />
	<title>Apache Wicket HelloWorld</title>
	</head>
	<body>

	<div wicket:id="helloMessage">
	[Label's message goes here]
	</div>
	</body>
	</html>
	{code}

	We can see that the @wicket:id@ attribute is set according to the value of the component id. If we run this example we will see the text @Hello WicketWorld!@ Inside a @<div>@ tag.

	{note}
	@Label@ replaces the original content of its tag (in our example @[Label's message goes here]@) with the string passed as value (@Hello WicketWorld!@ in our example).
	{note}

	{warning}
	If we specify a @wicket:id@ attribute for a tag without adding the corresponding component in our Java code, Wicket will throw a @ComponentNotFound@ Exception. On the contrary if we add a component in our Java code without specifying a corresponding @wicket:id@ attribute in our markup, Wicket will throw a @WicketRuntimeException@.
	{warning}