如何居中并防止滚动登录

时间:2016-04-04 15:08:05

标签: oracle-adf jdeveloper

基本上我正在尝试在我的应用程序的登录页面上工作。我差不多完成了它,但窗口是可滚动的,panelBox(请参阅下面的登录源代码)位于窗口的最左侧。我认为将它置于中心方面可以解决问题,但事实并非如此。如何防止窗口滚动并居中panelBox

<?xml version='1.0' encoding='UTF-8'?>
<!DOCTYPE html>
<f:view xmlns:f="http://java.sun.com/jsf/core" xmlns:af="http://xmlns.oracle.com/adf/faces/rich">
    <af:document title="LoginPage.jsf" id="d1">
        <af:form id="f1" inlineStyle="background-color:#c3de2f;" defaultCommand="b1">
            <af:panelStretchLayout id="psl1" dimensionsFrom="children" startWidth="100" endWidth="100" topHeight="200"
                                   bottomHeight="500">
                <f:facet name="bottom">
                    <af:spacer width="10" height="100" id="s1"/>
                </f:facet>
                <f:facet name="center">
                    <af:panelBox text="Hi!" id="pb1" showDisclosure="false" background="light"
                                 type="stretch"
                                 immediate="true" inlineStyle="background-color:#c3de2f;">
                        <af:outputText value="Testing" id="ot1"
                                       inlineStyle="font-size:x-large; font-weight:bolder;"/>
                        <af:panelFormLayout id="pfl1"
                                            inlineStyle="background-image:none;  ">
                            <f:facet name="footer">
                                <af:button id="b1" action="#{loginBean.Login.doLogin}"
                                           icon="resources/images/button.png"/>
                                <af:message id="m1"
                                            message="see admin for assistance"/>
                            </f:facet>
                            <af:outputText value="enter username and password" id="ot2"
                                           inlineStyle="font-style:italic; font-weight:bold; font-size:small;"/>
                            <af:inputText label="Username:" id="it1"
                                          value="#{loginBean.Login.username}"/>
                            <af:inputText label="Password:" id="it2"
                                          value="#{loginBean.Login.password}"
                                          secret="true" showRequired="true"/>
                        </af:panelFormLayout>
                    </af:panelBox>
                </f:facet>
                <f:facet name="start"/>
                <f:facet name="end"/>
                <f:facet name="top">
                    <af:panelGridLayout id="pgl2">
                        <af:gridRow height="auto" id="gr1">
                            <af:gridCell width="100%" id="gc1">
                                <af:image source="/resources/images/logo.png" id="i1"/>
                            </af:gridCell>
                        </af:gridRow>
                    </af:panelGridLayout>
                </f:facet>
            </af:panelStretchLayout>
        </af:form>
    </af:document>
</f:view>

2 个答案:

答案 0 :(得分:0)

试试这个,这会对你有帮助

<?xml version='1.0' encoding='UTF-8'?>
<jsp:root xmlns:jsp="http://java.sun.com/JSP/Page" version="2.1"
          xmlns:f="http://java.sun.com/jsf/core"
          xmlns:af="http://xmlns.oracle.com/adf/faces/rich">
  <jsp:directive.page contentType="text/html;charset=UTF-8"/>
  <f:view>
    <af:document id="d1" title="Login Page">
      <af:form id="f1" defaultCommand="#{'pgTplt:cbLogin'}">
            <af:panelStretchLayout id="psl1" startWidth="33%" endWidth="33%"
                                   topHeight="33%" bottomHeight="33%">
              <f:facet name="center">
                <af:panelGroupLayout id="pgl1" layout="vertical"
                                     halign="center">
                  <af:panelFormLayout id="pflLogin" rows="2" maxColumns="1">
                    <af:inputText id="itUsername" label="Username"
                                  value="#{Login.username}"/>
                    <af:inputText label="Password" id="itPassword" secret="true"
                                  value="#{Login.password}"/>
                    <af:spacer width="10" height="10" id="s1"/>
                    <af:commandButton text="Login" id="cbLogin"
                                      actionListener="#{Login.doLogin}"/>
                  </af:panelFormLayout>
                </af:panelGroupLayout>
              </f:facet>
              <f:facet name="bottom">
                <af:panelGroupLayout id="pgl2"/>
              </f:facet>
              <f:facet name="top">
                <af:panelGroupLayout id="pgl3"/>
              </f:facet>
            </af:panelStretchLayout>
      </af:form>
    </af:document>
  </f:view>
</jsp:root>

答案 1 :(得分:0)

非常简单。

PanelStretch布局 中,更改 bottomHeight =&#34; 100&#34; 值,500非常高 减少它。如果增加bottomHeight,它将自动添加页面滚动选项。