| Panel |
|---|
| borderStyle | solid |
|---|
| title | Table of contents |
|---|
|
|
Scope
ComponentBackground | componentJavadoc=Panel
Background
A Panel is a reusable component that holds markup and other components. If you want to reuse a component without copying its markup into each page markup, extend the class Panel:
You can use Markup inheritance with Panels too.
See Panels and borders to see the difference between Panels and Borders and Fragment to see how to use 'in-line' panels.
Panels can be used to create dynamic markup hierarchies.
FAQ
Examples
Typical usage
UserPanel.java:
| Code Block |
|---|
public class UserPanel extends Panel {
public UserPanel(String id, User user) {
super(id);
add(new Label("username", user.getUsername()));
add(new Label("lastLogin", user.getLastLogin()));
}
}
|
UserPanel.html:
| Code Block |
|---|
|
<wicket:panel>
User: <span wicket:id="username">dummy name</span><br/>
Last log-in: <span wicket:id="lastLogin">2037-09-10 10:21:59h</span>
</wicket:panel>
|
That's for your reusable panel, which you can now use anywhere like:
| Code Block |
|---|
add(new UserPanel("user", user);
|
and:
| Code Block |
|---|
|
<span wicket:id="user">[user data]</span>
|
or for better previewability:
| Code Block |
|---|
|
<span wicket:id="user">
<wicket:remove>
User: dummy name<br/>
Last log-in: 2037-09-10 10:21:59h
<wicket:remove>
</span>
|
Advanced example using a ListView
UsersListPanel.java:
| Code Block |
|---|
public class UsersListPanel extends Panel {
public UsersListPanel(String id, List users) {
super(id);
add(new ListView("users", users) {
public void populateItem(final ListItem p_item) {
final User user = (User) p_item.getModelObject();
p_item.add(new Label("username", user.getUsername()));
p_item.add(new Label("lastLogin", user.getLastLogin()));
}});
}
}
|
UsersListPanel.html:
| Code Block |
|---|
|
<wicket:panel>
<table>
<tr>
<th>user name</th>
<th>last login</th>
</tr>
<tr wicket:id="users">
<td><span wicket:id="username"></span></td>
<td><span wicket:id="lastLogin"></span></td>
</tr>
</table>
</wicket:panel>
|
That's for your reusable panel, which you can now use anywhere like:
| Code Block |
|---|
add(new UsersListPanel("users", users));
|
and:
| Code Block |
|---|
|
<span wicket:id="users">[users here]</span>
|
or for better previewability:
| Code Block |
|---|
|
<span wicket:id="users">
<wicket:remove>
<table>
<tr>
<th>user name</th>
<th>last login</th>
</tr>
<tr>
<td>dummy Username</td>
<td>2037-09-10 10:21:59h</td>
</tr>
</table>
<wicket:remove>
</span>
|