JSF design view - visual components are shrinking

Question

Hello,
I have some strange issue while using Design view for JSF and data binding.
Once I drop any data control elements into visual component (panel, etc) my visual components are shrinking to such size, that I cannot distinguish any elements within design view. I cannot use design view since then and have to place all elements base on structure panel.
How to reproduce:
1. Create new JSF page with wizard and accept defaults.
2. Drop one of the panels (panel box, panel group layout) into JSF layout
At this stage my visual elements occupy 100% of design view screen and represent anticipated outcome
3. Drag and drop one of the data control elements (data control panel) into created panels on JSF and create table or form
Immediately after it visual panel where data control was dropped shrinks to approximately 1/4 of the screen and I cannot see neither available space nor created table for my data components.
I figured out, that if I remove created by wizard default <af:messages> tag from the top of my JSF, then design view representation fixes. Not sure if I should remove <af:messages> from all my pages.
Above all looks to me as and bug.
Environment:
-Jdeveloper 11g
-Windows Vista 64b
-Not bundled JDK 6

Answer 1

Hi Shay,
Thank you for response.
1. I tried to play with screen size without result
2. I checked your video post, but this does not resolve my issue
3. This issue occures with all JSF pages and can be reproduced even when following official Oracle step by step tutorials.
4. I figured out, that removing <af:messages> tag resolves the issue ?! It seems this tag is added by default during drag and drop binding.
5. On this link http://drop.io/jdev_001 you can see how design view is changes with and without <af:messages> tag
6. Below is code example from one of the tutorials, that leads to shrinking as well:
7. Once app is deployed and running page get normal view in IE as expected, so it seems to me, it is issue with Jdev design view, probably influenced by my environment, if nobody reported it before.
Thank you for your help.
===========================================================================
<?xml version='1.0' encoding='windows-1252'?>
<jsp:root xmlns:jsp="http://java.sun.com/JSP/Page" version="2.1" xmlns:f="http://java.sun.com/jsf/core" xmlns:h="http://java.sun.com/jsf/html"
xmlns:af="http://xmlns.oracle.com/adf/faces/rich">
<jsp:directive.page contentType="text/html;charset=windows-1252"/>
<f:view>
<af:document id="d1">
<af:messages id="m1"/>
<af:form id="f1">
<af:panelStretchLayout id="psl1">
<f:facet name="center">
<!-- id="af_one_column_stretched" -->
<af:decorativeBox theme="dark" id="db1">
<f:facet name="center">
<af:decorativeBox theme="medium" id="db2">
<f:facet name="center">
<af:panelFormLayout id="pfl1">
<af:inputText value="#{bindings.p_name.inputValue}" label="#{bindings.p_name.hints.label}"
required="#{bindings.p_name.hints.mandatory}" columns="#{bindings.p_name.hints.displayWidth}"
maximumLength="#{bindings.p_name.hints.precision}" shortDesc="#{bindings.p_name.hints.tooltip}" id="it1">
<f:validator binding="#{bindings.p_name.validator}"/>
</af:inputText>
<af:commandButton actionListener="#{bindings.getEmployeesFindByName.execute}" text="getEmployeesFindByName"
disabled="#{!bindings.getEmployeesFindByName.enabled}" id="cb1"/>
<af:panelFormLayout id="pfl2">
<af:inputText value="#{bindings.commissionPct.inputValue}" label="#{bindings.commissionPct.hints.label}"
required="#{bindings.commissionPct.hints.mandatory}" columns="#{bindings.commissionPct.hints.displayWidth}"
maximumLength="#{bindings.commissionPct.hints.precision}" shortDesc="#{bindings.commissionPct.hints.tooltip}"
id="it4">
<f:validator binding="#{bindings.commissionPct.validator}"/>
<af:convertNumber groupingUsed="false" pattern="#{bindings.commissionPct.format}"/>
</af:inputText>
<af:inputText value="#{bindings.email.inputValue}" label="#{bindings.email.hints.label}"
required="#{bindings.email.hints.mandatory}" columns="#{bindings.email.hints.displayWidth}"
maximumLength="#{bindings.email.hints.precision}" shortDesc="#{bindings.email.hints.tooltip}" id="it7">
<f:validator binding="#{bindings.email.validator}"/>
</af:inputText>
<af:inputText value="#{bindings.employeeId.inputValue}" label="#{bindings.employeeId.hints.label}"
required="#{bindings.employeeId.hints.mandatory}" columns="#{bindings.employeeId.hints.displayWidth}"
maximumLength="#{bindings.employeeId.hints.precision}" shortDesc="#{bindings.employeeId.hints.tooltip}"
id="it6">
<f:validator binding="#{bindings.employeeId.validator}"/>
<af:convertNumber groupingUsed="false" pattern="#{bindings.employeeId.format}"/>
</af:inputText>
<af:inputText value="#{bindings.firstName.inputValue}" label="#{bindings.firstName.hints.label}"
required="#{bindings.firstName.hints.mandatory}" columns="#{bindings.firstName.hints.displayWidth}"
maximumLength="#{bindings.firstName.hints.precision}" shortDesc="#{bindings.firstName.hints.tooltip}" id="it3">
<f:validator binding="#{bindings.firstName.validator}"/>
</af:inputText>
<af:inputDate value="#{bindings.hireDate.inputValue}" label="#{bindings.hireDate.hints.label}"
required="#{bindings.hireDate.hints.mandatory}" shortDesc="#{bindings.hireDate.hints.tooltip}" id="id1">
<f:validator binding="#{bindings.hireDate.validator}"/>
<af:convertDateTime pattern="#{bindings.hireDate.format}"/>
</af:inputDate>
<af:inputText value="#{bindings.jobId.inputValue}" label="#{bindings.jobId.hints.label}"
required="#{bindings.jobId.hints.mandatory}" columns="#{bindings.jobId.hints.displayWidth}"
maximumLength="#{bindings.jobId.hints.precision}" shortDesc="#{bindings.jobId.hints.tooltip}" id="it2">
<f:validator binding="#{bindings.jobId.validator}"/>
</af:inputText>
<af:inputText value="#{bindings.lastName.inputValue}" label="#{bindings.lastName.hints.label}"
required="#{bindings.lastName.hints.mandatory}" columns="#{bindings.lastName.hints.displayWidth}"
maximumLength="#{bindings.lastName.hints.precision}" shortDesc="#{bindings.lastName.hints.tooltip}" id="it8">
<f:validator binding="#{bindings.lastName.validator}"/>
</af:inputText>
<af:inputText value="#{bindings.phoneNumber.inputValue}" label="#{bindings.phoneNumber.hints.label}"
required="#{bindings.phoneNumber.hints.mandatory}" columns="#{bindings.phoneNumber.hints.displayWidth}"
maximumLength="#{bindings.phoneNumber.hints.precision}" shortDesc="#{bindings.phoneNumber.hints.tooltip}"
id="it9">
<f:validator binding="#{bindings.phoneNumber.validator}"/>
</af:inputText>
<af:inputText value="#{bindings.salary.inputValue}" label="#{bindings.salary.hints.label}"
required="#{bindings.salary.hints.mandatory}" columns="#{bindings.salary.hints.displayWidth}"
maximumLength="#{bindings.salary.hints.precision}" shortDesc="#{bindings.salary.hints.tooltip}" id="it5">
<f:validator binding="#{bindings.salary.validator}"/>
<af:convertNumber groupingUsed="false" pattern="#{bindings.salary.format}"/>
</af:inputText>
<f:facet name="footer">
<af:panelGroupLayout layout="vertical" id="pgl1">
<af:panelGroupLayout layout="horizontal" id="pgl2">
<af:commandButton actionListener="#{bindings.First.execute}" text="First" disabled="#{!bindings.First.enabled}"
partialSubmit="true" id="cb2"/>
<af:commandButton actionListener="#{bindings.Previous.execute}" text="Previous" disabled="#{!bindings.Previous.enabled}"
partialSubmit="true" id="cb3"/>
<af:commandButton actionListener="#{bindings.Next.execute}" text="Next" disabled="#{!bindings.Next.enabled}"
partialSubmit="true" id="cb4"/>
<af:commandButton actionListener="#{bindings.Last.execute}" text="Last" disabled="#{!bindings.Last.enabled}"
partialSubmit="true" id="cb6"/>
</af:panelGroupLayout>
<af:commandButton text="Save" id="cb5" actionListener="#{bindings.mergeDepartments.execute}"
disabled="#{!bindings.mergeDepartments.enabled}" action="browse"/>
</af:panelGroupLayout>
</f:facet>
</af:panelFormLayout>
</af:panelFormLayout>
</f:facet>
</af:decorativeBox>
</f:facet>
</af:decorativeBox>
</f:facet>
</af:panelStretchLayout>
</af:form>
</af:document>
</f:view>
</jsp:root>
Edited by: user555411 on May 2, 2010 2:08 PM