Primefaces页面布局不起作用

<html xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core"
      xmlns:p="http://primefaces.org/ui" >
     <p:layout fullPage="true">
       <p:layoutUnit position="north" size="50">
          <h:outputText value="Top content." />
       </p:layoutUnit>
       <p:layoutUnit position="south" size="100">
         <h:outputText value="Bottom content." />
       </p:layoutUnit>
       <p:layoutUnit position="west" size="300">
         <h:outputText value="Left content" />
       </p:layoutUnit>
       <p:layoutUnit position="east" size="200">
         <h:outputText value="Right Content" />
       </p:layoutUnit>
       <p:layoutUnit position="center">
         <h:outputText value="Center Content" />
       </p:layoutUnit>
     </p:layout>
 </html>

上述代码的目标是使用 primefaces 5.0 创建一个具有 5 种布局的网页，分别为西、东、北、南、中心。我只得到了outputtext一个在另一个下面，而不是面板单元。我正在使用ecplise，javaee iee luna，primefaces 5.0.jar，其他primefaces组件(如textbox(工作正常。

你必须使用 JSF 标准标签(h：head， h：body(，我在下面举了一个例子。

<?xml version="1.0" encoding="UTF-8"?>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui">
    <h:head>
        <f:facet name="first">
            <meta http-equiv="Content-Type" 
                  content="text/html; charset=UTF-8" />
            <meta name="viewport" 
                  content="user-scalable=no, 
                  width=device-width, 
                  initial-scale=1.0, 
                  maximum-scale=1.0"/>
        </f:facet>
        <title>layout</title>
    </h:head>
    <h:body>
        <p:layout fullPage="true">
            <p:layoutUnit position="north" size="50">
                <h:outputText value="Top content." />
            </p:layoutUnit>
            <p:layoutUnit position="south" size="100">
                <h:outputText value="Bottom content." />
            </p:layoutUnit>
            <p:layoutUnit position="west" size="300">
                <h:outputText value="Left content" />
            </p:layoutUnit>
            <p:layoutUnit position="east" size="200">
                <h:outputText value="Right Content" />
            </p:layoutUnit>
            <p:layoutUnit position="center">
                <h:outputText value="Center Content" />
            </p:layoutUnit>
        </p:layout>
    </h:body>
</html>

相关内容

最新更新

热门标签：