Panel box in ADFcore
Hi
I want to customize panel box by writing a new template (css file).
I want a box like panel box , but the edges should be curved.
I have seen the template for panelbox , but could not understand it.
Can any one tell me an example about how to go with it.
please help me.
Thanks.
There are a number of posts on the subject of skinning that can help you in this area. In order to tweak, the panelBox look and feel you need to create a custom skin.
List of all skinning keys:
http://www.oracle.com/webapps/online-help/jdeveloper/10.1.3?topic=af_rcf_resourcekeys_html
Skin Postings:
http://forums.oracle.com/forums/search.jspa?objID=f83&q=skin
Similar Messages
-
How to align text in Panel Box to the center
Hi,
I would like to align the text in the Panel Box to the center. Here is my code snipplet:
+<af:panelBox text="22" id="pb8"+
titleHalign="center" ramp="highlight"
background="dark"
icon="/images/warningind_active.gif"
showDisclosure="false"
contentStyle="height: 50px; width: 100%; horizontal-align:center;">
+<f:facet name="toolbar"/>+
+<af:outputText value="Update RFC with Approval Info"+
id="ot8"
inlineStyle="font-size:medium; font-weight:bold;"/>
+</af:panelBox>+
But it didn't work. The text "Update RFC with Approval Info" is still align to the left by default.
Any ideas?
Thanks.
-MinaYou can't do it without panelGroupLayout. Try this way...
<af:panelBox text="PanelBox1" id="pb1" titleHalign="center" ramp="highlight"
background="dark">
<f:facet name="toolbar"/>
<af:panelGroupLayout id="pgl1" layout="horizontal" halign="center" valign="top">
<af:outputText value="***centered***" id="ot1"/>
</af:panelGroupLayout>
</af:panelBox> -
Centering panel boxes horizontally on a page
Experts,
I have a panelStretchLayout component on my page having 3 facets top, center and bottom. In the bottom facet i have to display 5 images inside a panel box such that they are aligned equiv distance from the left and right side. That is the same on the left side of the page and right side of the page (if the resolution changes - left hand border of the first image and right side border of the last image should be same) should be same and the panel boxes should start occupying space from the center of the bottom facet.
thks
Jdev 11.1.1.5.Can you try this?
<af:panelBox text="PanelBox1" id="pb1">
<af:panelGroupLayout layout="horizontal" id="pgl1" halign="center"
styleClass="AFStretchWidth">
<af:commandButton text="commandButton 1" id="cb1"
styleClass="AFStretchWidth"/>
<af:commandButton text="commandButton 2" id="cb2"
styleClass="AFStretchWidth"/>
<af:commandButton text="commandButton 3" id="cb3"
styleClass="AFStretchWidth"/>
<af:commandButton text="commandButton 4" id="cb4"
styleClass="AFStretchWidth"/>
<af:commandButton text="commandButton 5" id="cb5"
styleClass="AFStretchWidth"/>
<f:facet name="separator">
<af:spacer width="5" id="s1"/>
</f:facet>
</af:panelGroupLayout>
</af:panelBox>Thanks,
Navaneeth -
Hide/Show a Panel group or Panel Box with a command link
I need to show and hide a panel group/box that has a lot of components inside ..with a command link ...I need to do this with partial submit ....please advise.
<af:commandLink >
hide the panel box with all the comps inside it ..change commandlink text ....
use the same command link to show the panel box and change the command link
text back
</af:commandLink>
<af:panelGroup layout="vertical">
<af:panelBox>
<af:panelGroup>
ALOT of components .......
</af:panelGroup>
</af:panelBox>
</af:panelGroup>
I tried with partial trigger ..I tried everything i know ..it did not work .....it only worked I do a I full submit and setting some processScope(session) variables ..
Thanks.Hi,
- have a managed bean in session scope
- define a boolean variable that is set to true
- expose the variable through a public method
- use EL on the panelBox rendered property to link to this boolean method
- define an action listener on the command link and set the autosubmit property to true
- use the action listener to set the boolean value
- define a value for the ID property of the command link
- set the ID vaule to the PartialTrigger property of the panelGroup component
Frank -
Remove panel box in search criteria
Hi!
I am using jdeveloper 11.1.1.5
I had dragged and dropped my view criteria in y jspx page
I need to remove the panel box which had been set default to the querry
Could any body pls help meHi,
how about this one
<af:query id="qryId1" headerText=" Search" disclosed="true"
value=""
model="}"
queryListener=""
queryOperationListener="}"
displayMode="compact" saveQueryMode="hidden" rows="2" maxColumns="2">
<f:verbatim>
<blockquote>
<p>
</p>
</blockquote>
</f:verbatim>
<f:facet name="toolbar"/>
<f:facet name="footer"/> // look like you added some button here
<f:facet name="info"/>
</af:query>
JDeveloper generated Default query like,
<af:panelHeader>
<af:query>
</af:query>
</af:panelHeader>
your one is look like(I"m not sure)
<af:panelBox text="General Journal">
<af:panelHeader>
<af:query>
</af:query>
<af:panelHeader>
<af:panelCollection>
<af:table>
</af:panelCollection>
<af:panelBox>
if I were you, I will use panlesplitter like this,
<af:panelSplitter id="" splitterPosition="" orientation="vertical" disabled="false">
<f:facet name="first">
<af:panelHeader text=" General Journal ">
<af:query>
</af:query>
</af:panelHeader>
</f:facet>
<f:facet name="second">
<af:panelCollection>
<af:table>
</af:table>
</af:panelCollection>
</facet>
</af:panelSplitter>
Regards
KT
Edited by: KT on Dec 8, 2011 12:20 PM
Edited by: KT on Dec 8, 2011 12:21 PM
Edited by: KT on Dec 8, 2011 12:22 PM -
ADF 11 generating differents ids for panel box
Hello,
I want to generate differents ids for panel box from an iterator because the drag and drop functionality doesn't work. I saw that the component ids doesn't support EL.
It is any chance to generate my ids dinamically and how?
My code from my page is :
<af:panelGroupLayout id="pgl8">
<af:iterator id="i2" var="row"
value="#{bindings.MeniuVO1.collectionModel}">
<af:panelBox text="#{row.Description}"
binding="#{WelcomeBean.pb1}"
inlineStyle="width:167px;">
<f:facet name="toolbar"/>
<af:dropTarget dropListener="#{DragAndDropBean.handleContainerDrag}"
actions="MOVE">
<af:dataFlavor flavorClass="javax.faces.component.UIComponent"/>
</af:dropTarget>
<af:componentDragSource/>
</af:panelBox>
</af:iterator>
</af:panelGroupLayout>
Thank you.Hi,
can you try with <af:forEach/>
like
<af:forEach var="row"
items="#{bindings.MeniuVO1.rangeSet}">
<af:panelBox text="#{row.Description}"
inlineStyle="width:167px;">
<f:facet name="toolbar"/>
<af:dropTarget dropListener="#{DragAndDropBean.handleContainerDrag}"
actions="MOVE">
<af:dataFlavor flavorClass="javax.faces.component.UIComponent"/>
</af:dropTarget>
<af:componentDragSource/>
</af:panelBox>
</af:forEach>Edited by: Santosh Vaza on Apr 10, 2012 12:56 PM -
hi
im using a panel box layout in my page. i have background color for my page.
i dont want the border of the panel box to be visible so tht the screen appears more perfect.
i tried giving the inline styles.but i didnt succeed.
and i didnt find any skin selectors for panel box also.
so plz tell me how to remove the border of the panel box.there is no text for panel box.
rgds.Hi,
at least in the upcoming TP3, the skin selectors for panelBox are
af|panelBox The selector on the root dom element of this component. The root style contains default setting of the width of the panel Box to 100%.
af|panelBox::header-start Style the start side of the header of the panel box. Used to render rounded corners for the panelBox. The available pseudo-classes are: ((:core or :highlight) and (:default, :light, :medium, or :dark). The pseudo-classes correspond with the ramp and background attributes of the component. For example, the ramp is set to 'core' and background set to 'default' the style used for this is "af:panelBox::header-start:core:default". This includes the .AFPanelBoxHeader* alias, for example af|panelBox::header-start:core:default includes .AFPanelBoxHeaderCoreDefault:alias.
af|panelBox::header-center Style the center side of the header of the panel box. Used to render rounded corners for the panelBox. The available pseudo-classes are: ((:core or :highlight) and (:default, :light, :medium, or :dark). The pseudo-classes correspond with the ramp and background attributes of the component. This includes the .AFPanelBoxHeader* alias, for example af|panelBox::header-center:core:default includes .AFPanelBoxHeaderCoreDefault:alias.
af|panelBox::header-end Style the end side of the header of the panel box. Used to render rounded corners for the panelBox. The available pseudo-classes are: ((:core or :highlight) and (:default, :light, :medium, or :dark). The pseudo-classes correspond with the ramp and background attributes of the component. This includes the .AFPanelBoxHeader* alias, for example af|panelBox::header-end:core:default includes .AFPanelBoxHeaderCoreDefault:alias.
af|panelBox::content Style the content area of the panel box. The available pseudo-classes are: ((:core or :highlight) and (:default, :light, :medium, or :dark). The pseudo-classes correspond with the ramp and background attributes of the component. This includes the .AFPanelBoxContent* alias, for example af|panelBox::content:core:default includes .AFPanelBoxContentCoreDefault:alias.
af|panelBox::icon-style Style to support an icon to the left of the header title
af|panelBox::disclosure-link Selector for the anchor element that contains the disclosure icon.
.AFPanelBoxHeaderCoreDefault:alias Alias to change the properties on the panelbox header for the panelbox whose 'ramp' is set to 'core' and 'color' is set to 'default'. Using this style class significantly simplifies the work required to style the header. Instead of changing three classes (for header-start, header, header-end) you only need to change this one. The region component uses this alias as well.
.AFPanelBoxContentCoreDefault:alias Alias to change the properties on the panelbox content for the panelbox whose 'ramp' is set to 'core' and 'color' is set to 'default'. The region component uses this alias as well.
.AFPanelBoxHeaderCoreLight:alias Same as .AFPanelBoxHeaderCoreDefault:alias, but for color=light.
.AFPanelBoxContentCoreLight:alias Same as .AFPanelBoxContentCoreDefault:alias, but for color=light.
.AFPanelBoxHeaderCoreMedium:alias Same as .AFPanelBoxHeaderCoreDefault:alias, but for color=medium.
.AFPanelBoxContentCoreMedium:alias Same as .AFPanelBoxContentCoreDefault:alias, but for color=medium.
.AFPanelBoxHeaderCoreDark:alias Same as .AFPanelBoxHeaderCoreDefault:alias, but for color=dark.
.AFPanelBoxContentCoreDark:alias Same as .AFPanelBoxContentCoreDefault:alias, but for color=dark.
.AFPanelBoxHeaderHighlightDefault:alias Alias to change the properties on the panelbox header for the panelbox whose 'ramp' is set to 'highlight' and 'color' is set to 'default'. Using this style class significantly simplifies the work required to style the header. Instead of changing three classes (for header-start, header, header-end) you only need to change this one. The region component uses this alias as well.
.AFPanelBoxContentHighlightDefault:alias Alias to change the properties on the panelbox content for the panelbox whose 'ramp' is set to 'highlight' and 'color' is set to 'default'. The region component uses this alias as well.
.AFPanelBoxHeaderHighlightLight:alias Same as .AFPanelBoxHeaderHighlightDefault:alias, but for color=light.
.AFPanelBoxContentHighlightLight:alias Same as .AFPanelBoxContentHighlightDefault:alias, but for color=light.
.AFPanelBoxHeaderHighlightMedium:alias Same as .AFPanelBoxHeaderHighlightDefault:alias, but for color=medium.
.AFPanelBoxContentHighlightMedium:alias Same as .AFPanelBoxContentHighlightDefault:alias, but for color=medium.
.AFPanelBoxHeaderHighlightDark:alias Same as .AFPanelBoxHeaderHighlightDefault:alias, but for color=dark.
.AFPanelBoxContentHighlightDark:alias Same as .AFPanelBoxContentHighlightDefault:alias, but for color=dark.
.AFPanelBoxHeaderStart:alias Alias to change the dom element at the start of the header. Use this alias to modify the css properties that are needed for all ramp/background of panelBoxes. Common css properties are padding and border.
.AFPanelBoxHeaderCenter:alias Alias to change the dom element at the center of the header. Use this alias to modify the css properties that are needed for all ramp/background of panelBoxes. Common css properties for the header center dom element are width and font information.
.AFPanelBoxHeaderEnd:alias Alias to change the dom element at the end of the header. Use this alias to modify the css properties that are needed for all ramp/background of panelBoxes. Common css properties are padding and border.
Frank -
hi folks ,
i have requirement what it is means, am showing only one image on jsff(dynamic region). by in additionally, i have to show a af:panelbox over the af:image. is this possible.?
Never supported like this.
af:image - parent container
- af:panelbox - child containeri dont want like this also
af:image container 1
af:panelbox container 2
af:panelbox container 1
af:image container 2how do i do?
using jdev 11.1.1.5.0 -adfbctry
<af:document id="d1" inlineStyle='background-image:url("images/xyz.gif"); background-repeat:no-repeat;'>
<af:form id="f1">
<af:panelStretchLayout topHeight="50px" id="psl1">
<f:facet name="top"/>
<f:facet name="center">
<!-- id="af_one_column_header_stretched" -->
<af:panelDashboard id="pd1">
<af:panelBox text="PanelBox1" id="pb1">
<f:facet name="toolbar"/>
</af:panelBox>
</af:panelDashboard>
</f:facet>
</af:panelStretchLayout>
</af:form>
</af:document>Timo -
Problem with Drag and drop in panel dashboard
Hi
I am having problem with drag and drop in panel dashboard.
I will explain what i am doing.
I am using Oracle three column template in First region i am having a table that showing all customer.
I drag one record from my table and drop it on customer info (CIF) page on second region it is working fine.
my CIF page has a dashboard with 6 panel box. i am showing 6 different jsff in 6 panel box.
I put drop target in each jsff
<af:dropTarget dropListener="#{backingBeanScope.backing_customerinformation.handleItemDrop}"
actions="COPY">
<af:dataFlavor flavorClass="org.apache.myfaces.trinidad.model.RowKeySet"
discriminant="CustomerSearchDnD"/>
</af:dropTarget>
when i put drop target my panel boxes moves only when i drag it to another panel box header not entire part of panel box.
if i remove the drop target then panel box move normally as the example given on: [http://adfui.us.oracle.com:7778/faces-trunk/faces/visualDesigns/dashboard.jspx?_afrLoop=2021391022520156&_afrWindowMode=0&_afrWindowId=null] but in taht case i am not able to drag and drop my dataYou must be an Oracle employee as you're referring to a component in the upcoming JDeveloper version which has yet been released to the general public. Oracle employee's are, I believe, directed to post on internal Oracle forums.
CM. -
Spry tabbed panels as menu system
Hi,
This is actually for Dreamweaver CS6. What I'm trying to do is use spry tabbed panels as horizontal my menu system. I want to have basically the functionality of the adobe.com menu system where the drop downs are tabbed and the content box size varies depending on the tab and the content box moves it's position relative to the tab that's selected. I did manage to get the mouseover working so the tab's change according to which tab the mouse passes over.
My current problems are these:
I managed to change the content panel box size so it's not the same width as the full panel tab group however I cannot get it to move relative to which tab is selected, it just stays fixed in one location.
The content tabs are pushing the body of my page down instead of showing up over top of it which is obvioulsy not very condusive for a menu system.
I would like the default to show none of the panels until someone mouseover's one of the tab's and for the panels to dissapear when the mouse is not in the menu system.
For something similar to the adobe.com menu system am i using the right feature (it looks like tabbed panels to me) or should I be using a different spry feature, I would like to have text and an image in the content box under each tab just for overall effect.
I'm quite inexperienced with CSS and Javascripting and have basically gotten this far with trial and error modifying the CSS settings but I'm unable to modify the javascript on my own.
Any help or suggestions would be greatly appreciated!!
Below is my tabbed panels css:
.TabbedPanels {
overflow: hidden;
margin: 0px;
padding: 0px;
clear: none;
width: 1000px; /* IE Hack to force proper layout when preceded by a paragraph. (hasLayout Bug)*/
-webkit-transition: all;
-moz-transition: all;
-ms-transition: all;
-o-transition: all;
transition: all;
.TabbedPanelsTabGroup {
margin: 0px;
padding: 0px;
color: #FFF;
background-color: #000;
width: 1000px;
height: 25px;
.TabbedPanelsTab {
position: relative;
top: 0px;
float: left;
padding: 4px 21px;
margin: 0px 0px 0px 0px;
background-color: #000;
list-style: none;
border-left: solid 0px #000;
border-bottom: solid 0px #000;
border-top: solid 2px #000;
border-right: solid 0px #000;
-moz-user-select: none;
-khtml-user-select: none;
cursor: pointer;
width: 1000;
height: 15px;
font-family: "Myriad Pro";
font-size: 1em;
font-weight: normal;
.TabbedPanelsTabHover {
background-color: #D31145;
-webkit-transition: all;
-moz-transition: all;
-ms-transition: all;
-o-transition: all;
transition: all;
.TabbedPanelsTabSelected {
background-color: #D31145;
border-bottom: 0px solid #D31145;
color: #FFFFFF;
.TabbedPanelsTab a {
color: black;
text-decoration: none;
.TabbedPanelsContentGroup {
clear: both;
border-left: solid 2px #D31145;
border-bottom: solid 2px #D31145;
border-top: solid 2px #D31145;
border-right: solid 2px #D31145;
background-color: #FFFFFF;
visibility: visible;
width: 50%;
position: inherit;
height: auto;
/* This is the selector for the Content panel. The Content panel holds the
* content for a single tabbed panel. For our default style, this container
* provides some padding, so that the content is not pushed up against the
* widget borders.
* The name of the class ("TabbedPanelsContent") used in this selector is
* not necessary to make the widget function. You can use any class name you
* want to style the Content container.
.TabbedPanelsContent {
overflow: hidden;
padding: 4px;
.TabbedPanelsContentVisible {
.VTabbedPanels {
overflow: hidden;
zoom: 1;
.VTabbedPanels .TabbedPanelsTabGroup {
float: left;
width: 10em;
height: 20em;
background-color: #EEE;
position: relative;
border-top: solid 1px #999;
border-right: solid 1px #999;
border-left: solid 1px #CCC;
border-bottom: solid 1px #CCC;
.VTabbedPanels .TabbedPanelsTab {
float: none;
margin: 0px;
border-top: none;
border-left: none;
border-right: none;
.VTabbedPanels .TabbedPanelsTabSelected {
background-color: #EEE;
border-bottom: solid 1px #999;
.VTabbedPanels .TabbedPanelsContentGroup {
clear: none;
float: left;
padding: 0px;
width: 30em;
height: 20em;
/* Styles for Printing */
@media print {
.TabbedPanels {
overflow: visible !important;
.TabbedPanelsContentGroup {
display: block !important;
overflow: visible !important;
height: auto !important;
.TabbedPanelsContent {
overflow: visible !important;
display: block !important;
clear:both !important;
.TabbedPanelsTab {
overflow: visible !important;
display: block !important;
clear:both !important;
THe Javascript for my tabbed panels are below:
// SpryTabbedPanels.js - version 0.7 - Spry Pre-Release 1.6.1
// Copyright (c) 2006. Adobe Systems Incorporated.
// All rights reserved.
// Redistribution and use in source and binary forms, with or without
// modification, are permitted provided that the following conditions are met:
// * Redistributions of source code must retain the above copyright notice,
// this list of conditions and the following disclaimer.
// * Redistributions in binary form must reproduce the above copyright notice,
// this list of conditions and the following disclaimer in the documentation
// and/or other materials provided with the distribution.
// * Neither the name of Adobe Systems Incorporated nor the names of its
// contributors may be used to endorse or promote products derived from this
// software without specific prior written permission.
// THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
// AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
// IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
// ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE
// LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
// CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
// SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
// INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
// CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
// ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
// POSSIBILITY OF SUCH DAMAGE.
(function() { // BeginSpryComponent
if (typeof Spry == "undefined") window.Spry = {}; if (!Spry.Widget) Spry.Widget = {};
Spry.Widget.TabbedPanels = function(element, opts)
this.element = this.getElement(element);
this.defaultTab = 0; // Show the first panel by default.
this.tabSelectedClass = "TabbedPanelsTabSelected";
this.tabHoverClass = "TabbedPanelsTabHover";
this.tabFocusedClass = "TabbedPanelsTabFocused";
this.panelVisibleClass = "TabbedPanelsContentVisible";
this.focusElement = null;
this.hasFocus = false;
this.currentTabIndex = 0;
this.enableKeyboardNavigation = true;
this.nextPanelKeyCode = Spry.Widget.TabbedPanels.KEY_RIGHT;
this.previousPanelKeyCode = Spry.Widget.TabbedPanels.KEY_LEFT;
Spry.Widget.TabbedPanels.setOptions(this, opts);
// If the defaultTab is expressed as a number/index, convert
// it to an element.
if (typeof (this.defaultTab) == "number")
if (this.defaultTab < 0)
this.defaultTab = 0;
else
var count = this.getTabbedPanelCount();
if (this.defaultTab >= count)
this.defaultTab = (count > 1) ? (count - 1) : 0;
this.defaultTab = this.getTabs()[this.defaultTab];
// The defaultTab property is supposed to be the tab element for the tab content
// to show by default. The caller is allowed to pass in the element itself or the
// element's id, so we need to convert the current value to an element if necessary.
if (this.defaultTab)
this.defaultTab = this.getElement(this.defaultTab);
this.attachBehaviors();
Spry.Widget.TabbedPanels.prototype.getElement = function(ele)
if (ele && typeof ele == "string")
return document.getElementById(ele);
return ele;
Spry.Widget.TabbedPanels.prototype.getElementChildren = function(element)
var children = [];
var child = element.firstChild;
while (child)
if (child.nodeType == 1 /* Node.ELEMENT_NODE */)
children.push(child);
child = child.nextSibling;
return children;
Spry.Widget.TabbedPanels.prototype.addClassName = function(ele, className)
if (!ele || !className || (ele.className && ele.className.search(new RegExp("\\b" + className + "\\b")) != -1))
return;
ele.className += (ele.className ? " " : "") + className;
Spry.Widget.TabbedPanels.prototype.removeClassName = function(ele, className)
if (!ele || !className || (ele.className && ele.className.search(new RegExp("\\b" + className + "\\b")) == -1))
return;
ele.className = ele.className.replace(new RegExp("\\s*\\b" + className + "\\b", "g"), "");
Spry.Widget.TabbedPanels.setOptions = function(obj, optionsObj, ignoreUndefinedProps)
if (!optionsObj)
return;
for (var optionName in optionsObj)
if (ignoreUndefinedProps && optionsObj[optionName] == undefined)
continue;
obj[optionName] = optionsObj[optionName];
Spry.Widget.TabbedPanels.prototype.getTabGroup = function()
if (this.element)
var children = this.getElementChildren(this.element);
if (children.length)
return children[0];
return null;
Spry.Widget.TabbedPanels.prototype.getTabs = function()
var tabs = [];
var tg = this.getTabGroup();
if (tg)
tabs = this.getElementChildren(tg);
return tabs;
Spry.Widget.TabbedPanels.prototype.getContentPanelGroup = function()
if (this.element)
var children = this.getElementChildren(this.element);
if (children.length > 1)
return children[1];
return null;
Spry.Widget.TabbedPanels.prototype.getContentPanels = function()
var panels = [];
var pg = this.getContentPanelGroup();
if (pg)
panels = this.getElementChildren(pg);
return panels;
Spry.Widget.TabbedPanels.prototype.getIndex = function(ele, arr)
ele = this.getElement(ele);
if (ele && arr && arr.length)
for (var i = 0; i < arr.length; i++)
if (ele == arr[i])
return i;
return -1;
Spry.Widget.TabbedPanels.prototype.getTabIndex = function(ele)
var i = this.getIndex(ele, this.getTabs());
if (i < 0)
i = this.getIndex(ele, this.getContentPanels());
return i;
Spry.Widget.TabbedPanels.prototype.getCurrentTabIndex = function()
return this.currentTabIndex;
Spry.Widget.TabbedPanels.prototype.getTabbedPanelCount = function(ele)
return Math.min(this.getTabs().length, this.getContentPanels().length);
Spry.Widget.TabbedPanels.addEventListener = function(element, eventType, handler, capture)
try
if (element.addEventListener)
element.addEventListener(eventType, handler, capture);
else if (element.attachEvent)
element.attachEvent("on" + eventType, handler);
catch (e) {}
Spry.Widget.TabbedPanels.prototype.cancelEvent = function(e)
if (e.preventDefault) e.preventDefault();
else e.returnValue = false;
if (e.stopPropagation) e.stopPropagation();
else e.cancelBubble = true;
return false;
Spry.Widget.TabbedPanels.prototype.onTabClick = function(e, tab)
this.showPanel(tab);
return this.cancelEvent(e);
Spry.Widget.TabbedPanels.prototype.onTabMouseOver = function(e, tab)
this.addClassName(tab, this.tabHoverClass);
return false;
Spry.Widget.TabbedPanels.prototype.onTabMouseOut = function(e, tab)
this.removeClassName(tab, this.tabHoverClass);
return false;
Spry.Widget.TabbedPanels.prototype.onTabFocus = function(e, tab)
this.hasFocus = true;
this.addClassName(tab, this.tabFocusedClass);
return false;
Spry.Widget.TabbedPanels.prototype.onTabBlur = function(e, tab)
this.hasFocus = false;
this.removeClassName(tab, this.tabFocusedClass);
return false;
Spry.Widget.TabbedPanels.KEY_UP = 38;
Spry.Widget.TabbedPanels.KEY_DOWN = 40;
Spry.Widget.TabbedPanels.KEY_LEFT = 37;
Spry.Widget.TabbedPanels.KEY_RIGHT = 39;
Spry.Widget.TabbedPanels.prototype.onTabKeyDown = function(e, tab)
var key = e.keyCode;
if (!this.hasFocus || (key != this.previousPanelKeyCode && key != this.nextPanelKeyCode))
return true;
var tabs = this.getTabs();
for (var i =0; i < tabs.length; i++)
if (tabs[i] == tab)
var el = false;
if (key == this.previousPanelKeyCode && i > 0)
el = tabs[i-1];
else if (key == this.nextPanelKeyCode && i < tabs.length-1)
el = tabs[i+1];
if (el)
this.showPanel(el);
el.focus();
break;
return this.cancelEvent(e);
Spry.Widget.TabbedPanels.prototype.preorderTraversal = function(root, func)
var stopTraversal = false;
if (root)
stopTraversal = func(root);
if (root.hasChildNodes())
var child = root.firstChild;
while (!stopTraversal && child)
stopTraversal = this.preorderTraversal(child, func);
try { child = child.nextSibling; } catch (e) { child = null; }
return stopTraversal;
Spry.Widget.TabbedPanels.prototype.addPanelEventListeners = function(tab, panel)
var self = this;
Spry.Widget.TabbedPanels.addEventListener(tab, "mouseover", function(e) { self.onTabClick(e, tab);return self.onTabMouseOver(e, tab); }, false);
Spry.Widget.TabbedPanels.addEventListener(tab, "mouseout", function(e) { return self.onTabMouseOut(e, tab); }, false);
if (this.enableKeyboardNavigation)
// XXX: IE doesn't allow the setting of tabindex dynamically. This means we can't
// rely on adding the tabindex attribute if it is missing to enable keyboard navigation
// by default.
// Find the first element within the tab container that has a tabindex or the first
// anchor tag.
var tabIndexEle = null;
var tabAnchorEle = null;
this.preorderTraversal(tab, function(node) {
if (node.nodeType == 1 /* NODE.ELEMENT_NODE */)
var tabIndexAttr = tab.attributes.getNamedItem("tabindex");
if (tabIndexAttr)
tabIndexEle = node;
return true;
if (!tabAnchorEle && node.nodeName.toLowerCase() == "a")
tabAnchorEle = node;
return false;
if (tabIndexEle)
this.focusElement = tabIndexEle;
else if (tabAnchorEle)
this.focusElement = tabAnchorEle;
if (this.focusElement)
Spry.Widget.TabbedPanels.addEventListener(this.focusElement, "focus", function(e) { return self.onTabFocus(e, tab); }, false);
Spry.Widget.TabbedPanels.addEventListener(this.focusElement, "blur", function(e) { return self.onTabBlur(e, tab); }, false);
Spry.Widget.TabbedPanels.addEventListener(this.focusElement, "keydown", function(e) { return self.onTabKeyDown(e, tab); }, false);
Spry.Widget.TabbedPanels.prototype.showPanel = function(elementOrIndex)
var tpIndex = -1;
if (typeof elementOrIndex == "number")
tpIndex = elementOrIndex;
else // Must be the element for the tab or content panel.
tpIndex = this.getTabIndex(elementOrIndex);
if (!tpIndex < 0 || tpIndex >= this.getTabbedPanelCount())
return;
var tabs = this.getTabs();
var panels = this.getContentPanels();
var numTabbedPanels = Math.max(tabs.length, panels.length);
for (var i = 0; i < numTabbedPanels; i++)
if (i != tpIndex)
if (tabs[i])
this.removeClassName(tabs[i], this.tabSelectedClass);
if (panels[i])
this.removeClassName(panels[i], this.panelVisibleClass);
panels[i].style.display = "none";
this.addClassName(tabs[tpIndex], this.tabSelectedClass);
this.addClassName(panels[tpIndex], this.panelVisibleClass);
panels[tpIndex].style.display = "block";
this.currentTabIndex = tpIndex;
Spry.Widget.TabbedPanels.prototype.attachBehaviors = function(element)
var tabs = this.getTabs();
var panels = this.getContentPanels();
var panelCount = this.getTabbedPanelCount();
for (var i = 0; i < panelCount; i++)
this.addPanelEventListeners(tabs[i], panels[i]);
this.showPanel(this.defaultTab);
})(); // EndSpryComponentNote - I agree with Nancy
As for your experiment, to prevent the "drop" reduce the spry CSS padding in line 76 selector from 21px to 18px.
.TabbedPanelsTab {
-moz-user-select: none;
background-color: #000000;
border-color: #000000;
border-left: 0 solid #000000;
border-style: solid;
border-width: 2px 0 0;
cursor: pointer;
float: left;
font-family: "Myriad Pro";
font-size: 1em;
font-weight: normal;
height: 15px;
list-style: none outside none;
margin: 0;
padding: 4px 18px;
position: relative;
top: 0;
Don't use dummy text without normal length text with breaks -
Displaying a timeline on a panel
Hi everyone!!
I am trying to develop a project management tool, so I need to know the best way of implementing a timeline (in months) to display on a JPanel. Basically, when the user selects a start date and duration of the project, I need a timeline to appear depending on what the user has selected from the combo box. The timeline needs to start from the start date and continue for x amount of months (where x is the duration). At the moment I have used loads of switch statements, but there must be a much better and efficient way of implementing this. If anyone can help me with this then it will be most appreciated. My code is provided below which can be complied and run from the "NewChartTest" class file. Thanks.
* NewChartTest.java
* 23/11/02 (Date start)
* This class is for test purposes for
* the "New Chart" wizard
import javax.swing.*;
import javax.swing.event.*;
import java.awt.*;
import java.awt.event.*;
import java.io.*;
public class NewChartTest extends JPanel
private JButton newButton;
public JFrame wizardFrame;
static NewChartTest instance;
public NewChartTest()
instance = this;
// create new button
newButton = new JButton("New Chart");
// create tooltip for every button
newButton.setToolTipText("New Chart");
// add our button to the JPanel
add(newButton);
// construct button action
NewButtonListener listener1 = new NewButtonListener();
// Add action listener to button
newButton.addActionListener(listener1);
private class NewButtonListener implements ActionListener
public void actionPerformed(ActionEvent evt)
wizardFrame = new JFrame("New Chart Wizard*");
NewWizardPanel wizardPanel = new NewWizardPanel();
wizardFrame.getContentPane().add(wizardPanel);
wizardFrame.setSize(410, 280);
wizardFrame.setVisible(true);
// Main entry point into the ToolBarPanel class
public static void main(String[] args)
// Create a frame to hold us and set its title
JFrame frame = new JFrame("New Chart Test");
// Set frame to close after user request
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
// Add our tab panel to the frame
NewChartTest nct = new NewChartTest();
frame.getContentPane().add(nct, BorderLayout.CENTER);
// Resize the frame
frame.setSize(680, 480);
// Make the windows visible
frame.setVisible(true);
* NewWizardPanel.java
* 23/11/02 (Date start)
* This class is for test purposes for
* the "New Chart" wizard
import javax.swing.*;
import javax.swing.event.*;
import javax.swing.border.*;
import java.awt.*;
import java.awt.event.*;
import java.io.*;
public class NewWizardPanel extends JPanel
private JLabel projectNameLabel;
private JLabel maxCharacterLabel;
private JLabel durationLabel;
private JLabel monthLabel;
private JLabel startDate;
private JLabel forwardDash;
private JLabel forwardDash1;
private JLabel dateFormatLabel;
public JTextField projectName;
private JComboBox projectDay;
private JComboBox projectMonth;
private JComboBox projectYear;
private JComboBox projectDuration;
public String daySelect;
public String monthSelect;
public String yearSelect;
public String durationSelect;
private JButton okButton;
private JButton cancelButton;
private JFrame wizardFrame;
private JFrame drawChart;
static NewWizardPanel instance1;
public NewWizardPanel()
instance1 = this;
// create additional panels to hold objects
JPanel topPanel = new JPanel();
JPanel middlePanel = new JPanel();
JPanel lowerPanel = new JPanel();
JPanel buttonPanel = new JPanel();
// Create a border around the "toppanel"
Border etched = BorderFactory.createBevelBorder(BevelBorder.RAISED, Color.black, Color.blue);
Border titled = BorderFactory.createTitledBorder(etched, "Please provide a title to your project");
topPanel.setBorder(titled);
// Create a border around the "middlepanel"
Border etched1 = BorderFactory.createBevelBorder(BevelBorder.RAISED, Color.black, Color.blue);
Border titled1 = BorderFactory.createTitledBorder(etched1, "Please enter the start date of your project");
middlePanel.setBorder(titled1);
// Create a border around the "lowerpanel"
Border etched2 = BorderFactory.createBevelBorder(BevelBorder.RAISED, Color.black, Color.blue);
Border titled2 = BorderFactory.createTitledBorder(etched2, "Please select the duration of your project");
lowerPanel.setBorder(titled2);
// initialise label objects
projectNameLabel = new JLabel("Project Name", JLabel.LEFT);
maxCharacterLabel = new JLabel("(Max 20 Chars)");
durationLabel = new JLabel("Duration (in months)", JLabel.LEFT);
monthLabel = new JLabel("(1 - 12 months)");
startDate = new JLabel("Project Start Date", JLabel.LEFT);
forwardDash = new JLabel("/");
forwardDash1 = new JLabel("/ 20");
dateFormatLabel = new JLabel("(e.g. 31/12/02)");
projectName = new JTextField(20);
projectName.setColumns(15);
topPanel.validate();
String[] theDay = {"01", "02", "03", "04", "05", "06", "07", "08", "09", "10", "11", "12", "13", "14", "15", "16",
"17", "18", "19", "20", "21", "22", "23", "24", "25", "26", "27", "28", "29", "30", "31"};
projectDay = new JComboBox(theDay);
projectDay.setEditable(false);
String[] theMonth = {"01", "02", "03", "04", "05", "06", "07", "08", "09", "10", "11", "12"};
projectMonth = new JComboBox(theMonth);
projectMonth.setEditable(false);
String[] theYear = {"01", "02", "03", "04", "05", "06", "07", "08", "09", "10", "11", "12"};
projectYear= new JComboBox(theYear);
projectYear.setEditable(false);
String[] theDuration = {"1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12"};
projectDuration = new JComboBox(theDuration);
projectDuration.setEditable(false);
// initialise buttons
okButton = new JButton("Ok", new ImageIcon("D:/My Uni Work/Final Year Project/Test/ok.gif"));
cancelButton = new JButton("Cancel", new ImageIcon("D:/My Uni Work/Final Year Project/Test/cancel.gif"));
// set tooltips for buttons
okButton.setToolTipText("Ok");
cancelButton.setToolTipText("Cancel");
// add objects to panels
topPanel.add(projectNameLabel);
topPanel.add(projectName);
topPanel.add(maxCharacterLabel);
middlePanel.add(startDate);
middlePanel.add(projectDay);
middlePanel.add(forwardDash);
middlePanel.add(projectMonth);
middlePanel.add(forwardDash1);
middlePanel.add(projectYear);
middlePanel.add(dateFormatLabel);
lowerPanel.add(durationLabel);
lowerPanel.add(projectDuration);
lowerPanel.add(monthLabel);
buttonPanel.add(okButton);
buttonPanel.add(cancelButton);
// create instance of cancelButtonListener
CancelButtonListener cancelListen = new CancelButtonListener();
// create instance of okButtonListner
OkButtonListener okListen = new OkButtonListener();
// add actionListener for the cancel/ok button
cancelButton.addActionListener(cancelListen);
okButton.addActionListener(okListen);
// use Box layout to arrange panels
Box hbox2 = Box.createHorizontalBox();
hbox2.add(topPanel);
Box hbox3 = Box.createHorizontalBox();
hbox3.add(middlePanel);
Box hbox4 = Box.createHorizontalBox();
hbox4.add(lowerPanel);
Box hbox5 = Box.createHorizontalBox();
hbox5.add(buttonPanel);
Box vbox = Box.createVerticalBox();
vbox.add(hbox2);
vbox.add(Box.createGlue());
vbox.add(hbox3);
vbox.add(Box.createGlue());
vbox.add(hbox4);
vbox.add(Box.createGlue());
vbox.add(hbox5);
this.add(vbox, BorderLayout.NORTH);
private class CancelButtonListener implements ActionListener
public void actionPerformed(ActionEvent event)
Object source = event.getSource();
if(source == cancelButton)
NewChartTest.instance.wizardFrame.setVisible(false);
private class OkButtonListener implements ActionListener
public void actionPerformed(ActionEvent event)
String nameText = projectName.getText().trim();
int textSize = nameText.length();
daySelect = (String)projectDay.getSelectedItem();
monthSelect = (String)projectMonth.getSelectedItem();
yearSelect = (String)projectYear.getSelectedItem();
durationSelect = (String)projectDuration.getSelectedItem();
if(textSize > 20)
//display a JOptionPane
JOptionPane.showMessageDialog(NewWizardPanel.instance1, "You have entered a title that is greater than 20 characters. Please change this.",
"Text too Long", JOptionPane.ERROR_MESSAGE);
else if(textSize == 0)
//display a JOptionPane
JOptionPane.showMessageDialog(NewWizardPanel.instance1, "You have not entered a project name. Please do so (Maximum 20 Characters).",
"No Project Name Entered", JOptionPane.ERROR_MESSAGE);
else if(daySelect == "30" && monthSelect == "02" || daySelect == "31" && monthSelect == "02" || daySelect == "31" && monthSelect == "04" ||
daySelect == "31" && monthSelect == "06" || daySelect == "31" && monthSelect == "09" || daySelect == "31" && monthSelect == "11")
JOptionPane.showMessageDialog(NewWizardPanel.instance1, "You have selected an invalid date. Please re-check that the date is valid.",
"Invalid Date Selected", JOptionPane.ERROR_MESSAGE);
else
NewChartTest.instance.wizardFrame.setVisible(false);
drawChart = new JFrame("Milestone Chart Panel");
DrawPanel drawingChart = new DrawPanel();
drawChart.getContentPane().add(drawingChart);
drawChart.setSize(1000, 510);
drawChart.setVisible(true);
* DrawPanel.java
* 27/11/02 (Date start)
* This class is for test purposes for
* the "New Chart" wizard
import javax.swing.*;
import javax.swing.event.*;
import java.awt.*;
import java.awt.event.*;
import java.awt.geom.*;
import java.io.*;
public class DrawPanel extends JPanel
private JLabel aName;
private JLabel date;
private JLabel day;
private JLabel forwardSlash1;
private JLabel month;
private JLabel forwardSlash2;
private JLabel year;
private JLabel empty;
private JLabel startingMonth;
private JPanel nameHolder;
private JPanel dateHolder;
private JPanel emptyPanel;
private JPanel calendarPanel;
private JPanel timelinePanel;
private JPanel zoomInButtonPanel;
private JPanel zoomOutButtonPanel;
private JTextField projectName;
private String daySelect;
private JButton zoomIn;
private JButton zoomOut;
private JScrollPane timeLineScroll;
private String theDuration;
private String startMonth;
private String monthStart;
private String[] theMonths = {"January", "February", "March", "April", "May", "June", "July", "August",
"September", "October", "November", "December"};
//private String requiredMonths;
public DrawPanel()
nameHolder = new JPanel();
dateHolder = new JPanel();
emptyPanel = new JPanel();
calendarPanel = new JPanel();
calendarPanel.setBackground(Color.white);
timelinePanel = new timeLinePanel();
timelinePanel.setBackground(Color.white);
zoomInButtonPanel = new JPanel();
zoomInButtonPanel.setBackground(Color.black);
zoomOutButtonPanel = new JPanel();
zoomOutButtonPanel.setBackground(Color.black);
String name = NewWizardPanel.instance1.projectName.getText().trim();
aName = new JLabel(name, JLabel.CENTER);
date = new JLabel("Date Start:");
String dayStart = NewWizardPanel.instance1.daySelect;
day = new JLabel(dayStart);
forwardSlash1 = new JLabel("/");
monthStart = NewWizardPanel.instance1.monthSelect;
month = new JLabel(monthStart);
forwardSlash2 = new JLabel("/");
String yearStart = NewWizardPanel.instance1.yearSelect;
year = new JLabel(yearStart);
empty = new JLabel(" ");
// initialise buttons required for panel
zoomIn = new JButton(new ImageIcon("D:/My Uni Work/Final Year Project/Test/zoomIn.gif"));
zoomOut = new JButton(new ImageIcon("D:/My Uni Work/Final Year Project/Test/zoomOut.gif"));
// set the tool tips for the buttons
zoomIn.setToolTipText("Zoom In");
zoomOut.setToolTipText("Zoom Out");
theDuration = NewWizardPanel.instance1.durationSelect;
drawTimeLine(monthStart, theDuration);
nameHolder.add(aName);
dateHolder.add(date);
dateHolder.add(day);
dateHolder.add(forwardSlash1);
dateHolder.add(month);
dateHolder.add(forwardSlash2);
dateHolder.add(year);
emptyPanel.add(empty);
zoomInButtonPanel.add(zoomIn);
zoomOutButtonPanel.add(zoomOut);
dateHolder.setPreferredSize(new Dimension(200, 30));
emptyPanel.setPreferredSize(new Dimension(750, 30));
calendarPanel.setPreferredSize(new Dimension(950, 30));
timelinePanel.setPreferredSize(new Dimension(950, 300));
zoomInButtonPanel.setPreferredSize(new Dimension(100, 50));
zoomOutButtonPanel.setPreferredSize(new Dimension(100, 50));
// use Box layout to arrange panels
Box hbox1 = Box.createHorizontalBox();
hbox1.add(nameHolder);
Box hbox2 = Box.createHorizontalBox();
hbox2.add(dateHolder);
hbox2.add(emptyPanel);
Box hbox3 = Box.createHorizontalBox();
hbox3.add(calendarPanel);
Box hbox4 = Box.createHorizontalBox();
hbox4.add(timelinePanel);
Box hbox5 = Box.createHorizontalBox();
hbox5.add(zoomOutButtonPanel);
hbox5.add(zoomInButtonPanel);
Box vbox = Box.createVerticalBox();
vbox.add(hbox1);
vbox.add(Box.createGlue());
vbox.add(hbox2);
vbox.add(Box.createGlue());
vbox.add(hbox3);
vbox.add(Box.createGlue());
vbox.add(hbox4);
vbox.add(Box.createGlue());
vbox.add(hbox5);
this.add(vbox, BorderLayout.NORTH);
public void drawTimeLine(String aStartMonth, String aDuration)
if(monthStart == "01")
startMonth = theMonths[0];
System.out.println(theDuration);
int duration = Integer.parseInt(theDuration);
switch(duration)
case 1:
JLabel months = new JLabel(startMonth);
calendarPanel.add(months);
break;
case 2:
JLabel months1 = new JLabel(startMonth + " " + theMonths[1]);
calendarPanel.add(months1);
break;
case 3:
JLabel months2 = new JLabel(startMonth + " " + theMonths[1] + " " + theMonths[2]);
calendarPanel.add(months2);
break;
case 4:
JLabel months3 = new JLabel(startMonth + " " + theMonths[1] + " " + theMonths[2] + " " + theMonths[3]);
calendarPanel.add(months3);
break;
case 5:
JLabel months4 = new JLabel(startMonth + " " + theMonths[1] + " " + theMonths[2] + " " + theMonths[3] + " " + theMonths[4]);
calendarPanel.add(months4);
break;
case 6:
JLabel months5 = new JLabel(startMonth + " " + theMonths[1] + " " + theMonths[2] + " " + theMonths[3] + " " + theMonths[4]
+ " " + theMonths[5]);
calendarPanel.add(months5);
break;
case 7:
JLabel months6 = new JLabel(startMonth + " " + theMonths[1] + " " + theMonths[2] + " " + theMonths[3] + " " + theMonths[4]
+ " " + theMonths[5] + " " + theMonths[6]);
calendarPanel.add(months6);
break;
case 8:
JLabel months7 = new JLabel(startMonth + " " + theMonths[1] + " " + theMonths[2] + " " + theMonths[3] + " " + theMonths[4]
+ " " + theMonths[5] + " " + theMonths[6] + " " + theMonths[7]);
calendarPanel.add(months7);
break;
case 9:
JLabel months8 = new JLabel(startMonth + " " + theMonths[1] + " " + theMonths[2] + " " + theMonths[3] + " " + theMonths[4]
+ " " + theMonths[5] + " " + theMonths[6] + " " + theMonths[7] + " " + theMonths[8]);
calendarPanel.add(months8);
break;
case 10:
JLabel months9 = new JLabel(startMonth + " " + theMonths[1] + " " + theMonths[2] + " " + theMonths[3] + " " + theMonths[4]
+ " " + theMonths[5] + " " + theMonths[6] + " " + theMonths[7] + " " + theMonths[8] + " " + theMonths[9]);
calendarPanel.add(months9);
break;
case 11:
JLabel months10 = new JLabel(startMonth + " " + theMonths[1] + " " + theMonths[2] + " " + theMonths[3] + " " + theMonths[4]
+ " " + theMonths[5] + " " + theMonths[6] + " " + theMonths[7] + " " + theMonths[8] + " " + theMonths[9] + " " + theMonths[10]);
calendarPanel.add(months10);
break;
case 12:
JLabel months11 = new JLabel(startMonth + " " + theMonths[1] + " " + theMonths[2] + " " + theMonths[3] + " " + theMonths[4]
+ " " + theMonths[5] + " " + theMonths[6] + " " + theMonths[7] + " " + theMonths[8] + " " + theMonths[9] + " " + theMonths[10] + " " + theMonths[11]);
calendarPanel.add(months11);
break;
} // + loads more "if else" and "switch" statements - there must be an easier and more effiecient way!!!!
class timeLinePanel extends JPanel
private int x1 = 50;
private int x2 = 50;
private int y1 = 7;
private int y2 = 13;
public void paintComponent(Graphics g)
super.paintComponent(g);
Graphics2D g2 = (Graphics2D)g;
Line2D timeLine = new Line2D.Double(50, 10, 900, 10);
g2.draw(timeLine);
g2.setColor(Color.blue);
Line2D separatorStart = new Line2D.Double(50, 7, 50, 13);
g2.draw(separatorStart);
Line2D separatorEnd = new Line2D.Double(900, 7, 900, 13);
g2.draw(separatorEnd);
Line2D Separator1 = new Line2D.Double(x1 + 100 , y1, x2 + 100, y2);
g2.draw(Separator1);
Line2D separator2 = new Line2D.Double(x1 + 200, y1, x2 + 200, y2);
g2.draw(separator2);
Line2D separator3 = new Line2D.Double(x1 + 300, y1, x2 + 300, y2);
g2.draw(separator3);
Line2D separator4 = new Line2D.Double(x1 + 400, y1, x2 + 400, y2);
g2.draw(separator4);
Line2D separator5 = new Line2D.Double(x1 + 500, y1, x2 + 500, y2);
g2.draw(separator5);
Line2D separator6 = new Line2D.Double(x1 + 600, y1, x2 + 600, y2);
g2.draw(separator6);
Line2D separator7 = new Line2D.Double(x1 + 700, y1, x2 + 700, y2);
g2.draw(separator7);
Line2D separator8 = new Line2D.Double(x1 + 800, y1, x2 + 800, y2);
g2.draw(separator8);
//Line2D separator9 = new Line2D.Double(x1 + 900, y1, x2 + 900, y2);
//g2.draw(separator9);
g2.setColor(Color.lightGray);
Line2D dividerLine = new Line2D.Double(150, 14, 150, 300);
g2.draw(dividerLine);
Line2D dividerLine1 = new Line2D.Double(250, 14, 250, 300);
g2.draw(dividerLine1);
Line2D dividerLine2 = new Line2D.Double(350, 14, 350, 300);
g2.draw(dividerLine2);
Line2D dividerLine3 = new Line2D.Double(450, 14, 450, 300);
g2.draw(dividerLine3);
Line2D dividerLine4 = new Line2D.Double(550, 14, 550, 300);
g2.draw(dividerLine4);
Line2D dividerLine5 = new Line2D.Double(650, 14, 650, 300);
g2.draw(dividerLine5);
Line2D dividerLine6 = new Line2D.Double(750, 14, 750, 300);
g2.draw(dividerLine6);
Line2D dividerLine7 = new Line2D.Double(850, 14, 850, 300);
g2.draw(dividerLine7);Haven't looked at all your code by can't you use a loop?
int index = comboBox.getSelectedIndex();
StringBuffer buf = new StringBuffer("Start Month ");
JLabel label = new JLabel();
for (int counter = 0; counter < index; ++ counter)
buf.append(theMonths[counter] + " ");
label.setText(buf.toString()); -
Hi,
I have requirement where i need to use 2 Panels in a form. I have used JPanel in ADF Swing like what we used Panel Box in ADF. When I am running the application, The data in the first panel is coming up where the second panel data is not showing. I am using J dev 11.1.1.3.
Can you please help me in this regard.
Regards,
Kalyan.
Edited by: Kalyan on Oct 7, 2010 5:33 AMAs I understand you have 2 JPanels implemented as 2 separate Java classes and you invoke <tt>panel.setBindingContext(bctx)</tt> on each of them. This method binds the corresponding panel to its PageDef. If you use only one common PageDef instance then one of your panels will remain unbound. In order to resolve this problem you have to either combine your panels in a single JPanel or to provide a separate PageDef instance for each of them. You should either define a separate PageDef or you can try to duplicate PageDef's declaration in DataBindings.cpx (without duplicating the PageDef's XML file). If you choose the second one then open the <tt>DataBindings.cpx</tt> file and copy the corresponding line, for example:
<pageDefinitionUsages>
<page id="MyPanelPageDef" path="view.myproject.pageDefs.MyPanelPageDef"/>
<page id="MySecondPanelPageDef" path="view.myproject.pageDefs.MyPanelPageDef"/>
</pageDefinitionUsages>In this way you will declare a new PageDef instance without duplicating the PageDef's file. Then go to the beginning of the 2nd panel's Java class and set the new PageDef ID into it, for example replace the line:
private String pageDef = "MyPanelPageDef"; with private String pageDef = "MySecondPanelPageDef"; (Of course, these names are just sample ones and you should set the corrent ones). -
Website Storage Settings Panel generates script error message
I am using Chrome, XP sp3 and the latest flash 11.1.102.55
When I click on the Website Storage Settings Panel here:
http://www.macromedia.com/support/documentation/en/flashplayer/help/settings_manager07.htm l
the panel starts loading but after a few seconds I get a pop up with the following message:
A script in this movie is causing Adobe Flash player to sun slowly. If it continutes to run, your computer may become unresponsive. Do you want to abort the script? Y\N
Actually, all the settings panels do the same, but I discovered it while attempting to use the above.
Aborting the script causes the Panel box to go crazy, with it running like a very fast movie through many different looks and nothing is able to be clicked on.
Not aborting the script causes my computer to become unresponsive as warned.
I have cleared the cache before doing this.
Same thing happens in Firefox - which I use when Chrome doesn't work.
Same thing happens in IE - which I do not use.
No idea what to do - definitely welcome suggestions!!!!
Thank you.Because you mention Safari I want to pass along this post by VIDEOTRANS from another thread.***************************************************************************************I found a fix for the streaming failure.... 422 error. I my case it was AVAST anti-virus that blocked Comcast's server from streaming the content to my Mac Book. I added the server address: secure.xfinitytv.comcast.net to the excluded server list in the Web Shield preferences. Now the streaming works on every channel... By excluding ther comcast server it allowed the stream to play in my browser, and no longer blocks it.... YAY!***************************************************************************************Here is a link to the other thread. http://forums.comcast.com/t5/XfinityTV-Website/Error-Message-422/m-p/2469238
-
Hi,
I wanna center the panelBox within the page. Any advice?
<?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:h="http://java.sun.com/jsf/html"
xmlns:af="http://xmlns.oracle.com/adf/faces/rich">
<jsp:directive.page contentType="text/html;charset=UTF-8"/>
<f:view>
<af:document id="d1" binding="#{backingBeanScope.backing_my.d1}">
<af:form id="f1" binding="#{backingBeanScope.backing_my.f1}">
<af:spacer width="100" height="10" id="s4"/>
<af:panelStretchLayout id="psl1"
binding="#{backingBeanScope.backing_my.psl1}"
startWidth="150px" endWidth="150px"
topHeight="300px" bottomHeight="150px">
<f:facet name="top"></f:facet>
<f:facet name="center">
<af:panelBox text="Login"
binding="#{backingBeanScope.backing_my.pb1}"
id="pb1" inlineStyle="background-color:#649374;"
showHeader="always">
</af:panelBox>
<!-- id="af_one_column_stretched" -->
</f:facet>
<f:facet name="start">
<af:inlineFrame id="if7"/>
</f:facet>
<f:facet name="end">
<af:inlineFrame id="if6"/>
</f:facet>
<f:facet name="bottom">
<af:inlineFrame id="if3"/>
</f:facet>
</af:panelStretchLayout>
</af:form>
</af:document>
</f:view>
<!--oracle-jdev-comment:auto-binding-backing-bean-name:backing_my-->
</jsp:root>Hi,
To which component dou you want to set background image check following samples
1)back ground image <af:panelStretchLayout
<?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:h="http://java.sun.com/jsf/html"
xmlns:af="http://xmlns.oracle.com/adf/faces/rich">
<jsp:directive.page contentType="text/html;charset=UTF-8"/>
<f:view>
<af:document id="d1" >
<af:form id="f1" >
<af:panelStretchLayout id="psl1"
inlineStyle="background-image: url(images/sky_c.jpg)"
startWidth="404px" endWidth="510px"
topHeight="301px" bottomHeight="287px">
<f:facet name="top">
<af:inlineFrame id="if1"/>
</f:facet>
<f:facet name="center">
<af:panelBox text="Login"
inlineStyle="background-color:#649374;"
showHeader="always">...</af:panelBox>
<!-- id="af_one_column_stretched" -->
</f:facet>
<f:facet name="start">
<af:inlineFrame id="if7"/>
</f:facet>
<f:facet name="end">
<af:inlineFrame id="if6"/>
</f:facet>
<f:facet name="bottom">
<af:inlineFrame id="if3"/>
</f:facet>
</af:panelStretchLayout>
</af:form>
</af:document>
</f:view>
<!--oracle-jdev-comment:auto-binding-backing-bean-name:backing_my-->
</jsp:root>2)back ground image for panel box
Note:To appear back ground image set disclosed="false" for PanelBox
<?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:h="http://java.sun.com/jsf/html"
xmlns:af="http://xmlns.oracle.com/adf/faces/rich">
<jsp:directive.page contentType="text/html;charset=UTF-8"/>
<f:view>
<af:document id="d1" >
<af:form id="f1" >
<af:panelStretchLayout id="psl1"
startWidth="404px" endWidth="510px"
topHeight="301px" bottomHeight="287px">
<f:facet name="top">
<af:inlineFrame id="if1"/>
</f:facet>
<f:facet name="center">
<af:panelBox text="Login" disclosed="false"
inlineStyle="background-color:#649374;background-image: url(images/sky_c.jpg)"
showHeader="always">...</af:panelBox>
<!-- id="af_one_column_stretched" -->
</f:facet>
<f:facet name="start">
<af:inlineFrame id="if7"/>
</f:facet>
<f:facet name="end">
<af:inlineFrame id="if6"/>
</f:facet>
<f:facet name="bottom">
<af:inlineFrame id="if3"/>
</f:facet>
</af:panelStretchLayout>
</af:form>
</af:document>
</f:view>
<!--oracle-jdev-comment:auto-binding-backing-bean-name:backing_my-->
</jsp:root>-Suresh -
How do we create a panel with a title on it
How do we create a panel with a title on it (something like the titled border in java swing)
Thanks John,
But, I already have a panel box with many panel form layouts inside and would like to have a title on one of the panel form layouts. So, a panel box isn't the one I am looking for.
More like the titled border shown in here [http://java.sun.com/docs/books/tutorial/uiswing/components/border.html#demo]
thanks again
Anwar
Maybe you are looking for
-
Once I recieve my Network Access Code(NAC) for my iPhone 5, what are the next steps I follow to unlock it from vodafone to use on another network??? I have my other nano sim ready and waiting to port my number to it, but im just waiting on vodafone t
-
Hi, I must make sample code of web service calls for PHP and Java to our clients. So far I have got it working with PHP but I have trouble to successfuly call web service in Java. I have generated stub files with wscompile -keep -gen:client config.xm
-
Hi, I believe I made a mistake when installed Acrobat XI Professional over the CS6 Master version Acrobat X Professional. The result ended up with running a trial version of Acrobat XI Professional. I wanted to upgrade but not using the subscription
-
I have a Toshiba 34HF81 16:9, Hi definition CRT TV. Its highest resolution is 1080i. The TV still works very well, but has a problem when connected either to my cable box/PVR or a Blu Ray player: It overscans. I lose the outer 10% of the picture,
-
Forecast planning function in IP
Dear All We have a requirement like forecasting future prices for next year on monthly basis. Data of prices for the past 3 years on monthly basis is available in the InfoCubes. Can anyone please let me know how to use the "forecast" planning functio