Commits

Micha Kops committed 7868b08

Examples for mobile components and header-footer layouts added.

  • Participants
  • Parent commits d18f29c

Comments (0)

Files changed (4)

File src/main/java/com/hascode/tutorial/DemoBean.java

 @ManagedBean
 @RequestScoped
 public class DemoBean {
-	public String output() {
+	public String getOutput() {
 		return "It is " + new Date().toString();
 	}
 }

File src/main/webapp/ajax.xhtml

 			<pm:header title="AJAX Sample" />
 			<pm:content>
 				<h:form>
+					<p:commandButton value="Click" update="result"/> 
+					<h:outputText id="result" value="#{demoBean.output}" /> 
 				</h:form>
 			</pm:content>
 		</pm:view>

File src/main/webapp/components.xhtml

+<f:view xmlns="http://www.w3.org/1999/xhtml"
+	xmlns:f="http://java.sun.com/jsf/core"
+	xmlns:h="http://java.sun.com/jsf/html"
+	xmlns:ui="http://java.sun.com/jsf/facelets"
+	xmlns:p="http://primefaces.org/ui"
+	xmlns:pm="http://primefaces.org/mobile" contentType="text/html">
+	<pm:page
+		title="hasCode.com PrimeFaces Mobile Tutorial - Mobile Components">
+		<pm:view id="components">
+			<pm:header title="Mobile Components" />
+			<pm:content>
+				<h:form>
+					<h:outputText value="Button Group" />
+					<pm:buttonGroup>
+						<p:commandButton value="Accept" />
+						<p:commandButton value="Deny" />
+					</pm:buttonGroup>
+					<p:separator />
+					<h:outputText value="Input Range" />
+					<pm:inputRange value="23" />
+					<p:separator />
+					<h:outputText value="Nav Bar" />
+					<pm:content>
+						<pm:navBar>
+							<p:button value="Home" icon="home" href="#components"
+								styleClass="ui-btn-active" />
+							<p:button value="Settings" icon="gear" href="#components" />
+							<p:button value="About" icon="info" href="#components" />
+						</pm:navBar>
+					</pm:content>
+					<p:separator />
+					<h:outputText value="Switch" />
+					<pm:switch value="#{true}" onLabel="Accept" offLabel="deny" />
+				</h:form>
+			</pm:content>
+		</pm:view>
+	</pm:page>
+</f:view>

File src/main/webapp/segments.xhtml

+<f:view xmlns="http://www.w3.org/1999/xhtml"
+	xmlns:f="http://java.sun.com/jsf/core"
+	xmlns:h="http://java.sun.com/jsf/html"
+	xmlns:ui="http://java.sun.com/jsf/facelets"
+	xmlns:p="http://primefaces.org/ui"
+	xmlns:pm="http://primefaces.org/mobile" contentType="text/html">
+
+	<pm:page
+		title="hasCode.com PrimeFaces Mobile Tutorial - Mobile Components">
+		<pm:view id="segments">
+			<pm:header title="The header">
+				<f:facet name="left">
+					<p:button value="Back" icon="back" href="#segments" />
+				</f:facet>
+				<f:facet name="right">
+					<p:button value="Config" icon="gear" href="#config" />
+				</f:facet>
+			</pm:header>
+			<pm:content>
+				<h:outputText value="This is our content.." />
+				<p:calendar mode="inline" />
+			</pm:content>
+			<pm:footer>
+				<pm:buttonGroup orientation="horizontal">
+					<p:button value="Like" href="#segments" />
+					<p:button value="Share" href="#segments" />
+				</pm:buttonGroup>
+			</pm:footer>
+		</pm:view>
+	</pm:page>
+
+</f:view>