开发者

Horizontal placement of components in JSF

开发者 https://www.devze.com 2022-12-25 01:05 出处:网络
Should be simple but I couldn\'t find the answer, I would like to place components horizontally instead of vertically.

Should be simple but I couldn't find the answer, I would like to place components horizontally instead of vertically.

What I'm trying to achieve is a rich:toolbar with 2 or more rows. I've been tryin开发者_StackOverflow中文版g to do that with a toolbar that has a panelgrid and two panelgroups like this:

<rich:toolbar...>
  <f:panelgrid columns="1"...>
    <f:panelgroup id="row1" .../>  <-- Should be horizontal placement
    <f:panelgroup id="row2" .../>  <-- Should be horizontal placement
  <f:panelgrid/>
<rich:toolbar/>

So how do I make the panelgroup layout horizontal (Or should I use something else?)

Thanks!


You probably already know that JSF in webserver ends up as HTML in webbrowser. In HTML, there are several ways to place elements horizontally (eventually with help of CSS):

  1. Group them in inline elements (like <span> or any element with display: inline;).
  2. Group them in block elements (like <div> or any element with display: block;) and give them all a float: left;.

The JSF <h:panelGrid> renders a HTML <table> element wherein each child component is taken as a <td>. The columns attribute represents the max amount of <td> elements in a single <tr> (so that the <h:panelGrid> knows when to put a </tr><tr> in). The JSF <h:panelGroup> renders a <span> element.

To achieve way 1 with JSF, you just need to group them in separate <h:panelGroup> components.

<rich:toolbar ...>
    <h:panelgroup id="row1" ... />
    <h:panelgroup id="row2" ... />
</rich:toolbar>

Way 2 can be done the same way, but then with <h:panelGroup layout="block"> instead and a float: left; in their CSS.

0

精彩评论

暂无评论...
验证码 换一张
取 消