Aligning group of components in a panel grid

I have a panelGrid that has two columns. The first is a table and the second is a groupPanel.
I want the components in the groupPanel to be left justified but even using css styles such as the following the groupPanel is always centered.
.alignTopLeft {
vertical-align: top;
text-align: left;
}I have also tried the following:
.alignTopLeft {
vertical-align: top;
text-align: left;
    position: relative;
    top: 1px;
    left: 1px;
}I notice that their does not seem to be a horizontal-align attribute which would make more sense to me. I also suspect that the above styles do not work because I am dealing with a group of components instead of a single component (such as a text field).
In order to get the look I want I have had to resort to using a layout panel set to 'grid' and hand placing my sub elements. I keep on thinking I am missing something and that their is a better way to do this.
Granted this is based on my experience with Swing which has rich set of layout managers...
If anyone has a better solution please let me know. (And remember that a sample is always welcome)

Some more information.
I also tried using the following setting:
.alignTopLeft {
vertical-align: top;
float: left;
}While this placed the component in the desired location it had an unfortunate side effect. When I set the text area to have some value (in my back bean) the value did not show up in the text area but instead appeared to overlap the left most component on row of the panelGrid.
So far the only way I have been able to get this to appear the way I would like is to use a panelLayout with a grid (fixed) layout.
I hope that future versions of Woodstock will have better layout managers. Coming from Swing it is very frustrating to have to use tricks like this.

Similar Messages

Align Components how a panel Form Layout

hi,
I have the panel form layout with components, fine perfect, but...
when I want to put a LOV such an output the text
the center together the alignment of the components is lost i have the picture :)
http://img100.imageshack.us/img100/7164/perfectoif.png
but i want put the output text join component , example:
http://img525.imageshack.us/img525/4543/asiquiero.png
the logic solution, i group component with panel group layout but the form i see:
http://img97.imageshack.us/img97/1096/erroryd.png
Any idea?? i use jdev 11.1.1.2
Joaquin
Edited by: ADFboy on 03-may-2010 10:54
Edited by: ADFboy on 03-may-2010 11:43

              <af:panelFormLayout id="pfl1" labelAlignment="start"
                                  maxColumns="2" rows="1">
                <af:panelGroupLayout id="pgl2" layout="horizontal"
                                     valign="bottom" halign="start"
                                     inlineStyle="text-align:left;">
                  <af:inputListOfValues label="ghdghd ghdghdf"
                                        popupTitle="Search and Result Dialog"
                                        id="ilov2"/>
                  <af:outputText value="outputText2" id="ot2"/>
                </af:panelGroupLayout>
                <af:inputListOfValues label="Label 1 fgs d"
                                      popupTitle="Search and Result Dialog"
                                      id="ilov1"/>
                <af:inputListOfValues label="Label 2"
                                      popupTitle="Search and Result Dialog"
                                      id="ilov4"/>
                <af:panelGroupLayout id="pgl1" layout="horizontal">
                  <af:inputListOfValues label="dghd ghdhd"
                                        popupTitle="Search and Result Dialog"
                                        id="ilov3"/>
                  <af:outputText value="outputText3" id="ot1"/>
                </af:panelGroupLayout>
                <af:inputListOfValues label="Label 3"
                                      popupTitle="Search and Result Dialog"
                                      id="ilov5"/>
                <af:inputListOfValues label="Label 4"
                                      popupTitle="Search and Result Dialog"
                                      id="ilov6"/>
                <af:inputListOfValues label="Label 5"
                                      popupTitle="Search and Result Dialog"
                                      id="ilov7"/>
                <af:inputListOfValues label="Label 6"
                                      popupTitle="Search and Result Dialog"
                                      id="ilov8"/>
              </af:panelFormLayout>

Edit Disable Panel Grid Alignment does not affect the Positioning of Front Panel Labels

In LabVIEW 2010, when I choose Edit>> Disable Panel Grid Alignment the positioning of Front Panel objects gets much finer so that I can make small adjustments. Put it does not seem to affect the positioning of front panel object labels. These object labels still move in very coarse increments and do not allow me to position them carefully.
How do I turn off the Grid Panel alignment for Front Panel Labels?

The positioning of labels you encounter has not so much to do with any grid, but with the fact that for labels, LabVIEW attempts to snap them to one of the control corners if you get close enough to the owning control. Outside of a certain range of the owning control you should be able to place them easily on any pixel. The snap behaviour of owned objects is not configured through the panel grid option. I'm not aware of an option to disable this behaviour, but usually find it rather handy instead of annoying. If it happens to not be exactly as desired, I adjust with the label selected and using the cursor keys.
Rolf Kalbermatter
CIT Engineering Netherlands
a division of Test & Measurement Solutions

Value Change event is not working. Html Panel Grid get method is not called

Hi,
I'm creating components dynamically.
I have a dropdown. Based on the selection of dropdown, the panel grid is getting called.
First time the panel grid getmethod is getting called. But when i change the value of drop down, panel grid get method is not getting called and its not rendering.
This is the code:
JSF:
<h:panelGroup>
<t:selectOneMenu id="selectProjectTypes" onchange="sbmitform();" immediate="true" valueChangeListener="#{ProjectController.projectTypeChanged}" value="#{ProjectController.project.selectProjectTypes}">
<f:selectItem itemLabel="--------------------" itemValue="-1"/>
<f:selectItems value="#{ProjectController.projectTypesList}"/>
</t:selectOneMenu>
</h:panelGroup>
<h:panelGrid columns="2" rendered="#{ProjectController.projects}" id="test" binding="#{ProjectController.defaultValues}" columnClasses="hunderadfifty"                                         cellpadding="5" />
Controller:
public void projectTypeChanged(ValueChangeEvent event) throws AbortProcessingException,Exception {
          String nodeTypeId = null;
     String selectedValue = (String)event.getNewValue();
     getSessionCache().addValue("test", 0, "1");
     if(selectedValue.equalsIgnoreCase(nodeTypeId)){
     try
     // this.getDefaultValues().setRendered(true);
     // defaultValues=this.getDefaultValues();
     } catch (Exception e)
     e.printStackTrace();
     FacesContext.getCurrentInstance().renderResponse();
Panel Grid Method
public HtmlPanelGrid getDefaultValues() throws Exception {
     String devlues = (String)getSessionCache().getValue("test");
     Application app = FacesContext.getCurrentInstance().getApplication();
          labelList = nodeTypeFieldsService.getFixedFields(this.getRpUserData(), this.getAuthUser());
          HtmlPanelGrid panelGrid = (HtmlPanelGrid)app.createComponent(HtmlPanelGrid.COMPONENT_TYPE);
          for(int i = 0; i<labelList.size(); i++)
          HtmlOutputText heading = (HtmlOutputText)app.createComponent(HtmlOutputText.COMPONENT_TYPE);
          HtmlPanelGroup panelGroup = (HtmlPanelGroup)app.createComponent(HtmlPanelGroup.COMPONENT_TYPE);
          HtmlInputText inputText = (HtmlInputText)app.createComponent(HtmlInputText.COMPONENT_TYPE);
          String fieldHeading =((ProjectField)labelList.get(i)).getFieldHeading();
          int fieldLength = ((ProjectField)labelList.get(i)).getFieldLength();
          String fieldDescription = ((ProjectField)labelList.get(i)).getFieldDescription();
          String fieldType = ((ProjectField)labelList.get(i)).getFieldType();
          inputText.setValueBinding("value", (ValueBinding) app.createValueBinding("#{ProjectController.newProj}"));
          if(fieldType.equalsIgnoreCase("3"))
               heading.setValue(fieldHeading);
               heading.setTitle(fieldDescription);
               inputText.setMaxlength(fieldLength);
               inputText.setSize(fieldLength);
               UIRDDialog dialog = (UIRDDialog)app.createComponent(UIRDDialog.COMPONENT_TYPE);
               dialog.setTitle("Object Type Dialog");
               dialog.setHeight("370");
               dialog.setWidth("350");
               dialog.setUrl("searchObjectTypeDialog.jsf");
               UIRDIconButton iconButton = (UIRDIconButton)app.createComponent(UIRDIconButton.COMPONENT_TYPE);
               iconButton.setType("button");
               iconButton.setTitle("Search for Object Types");
               iconButton.setIcon("/image/icon/portalicon_search.gif");
               iconButton.setActivateDialog("searchObjectTypeDialog");
               panelGroup.getChildren().add(inputText);
               panelGroup.getChildren().add(iconButton);
               panelGroup.getChildren().add(dialog);
               panelGrid.getChildren().add(panelGroup);
          }else
               panelGroup.getChildren().add(inputText);
               heading.setValue(fieldHeading);
               inputText.setMaxlength(fieldLength);
               inputText.setSize(fieldLength);
               heading.setTitle(fieldDescription);
               panelGrid.getChildren().add(panelGroup);
          panelGrid.getChildren().add(heading);
          panelGrid.getChildren().add(panelGroup);
          HtmlCommandButton createButton = (HtmlCommandButton)app.createComponent(HtmlCommandButton.COMPONENT_TYPE);
          createButton.setId("create");
          createButton.setTitle("Create");
          createButton.setValue("Skapa");
          createButton.setAction(app.createMethodBinding("#{ProjectController.saveProject}", null));
          HtmlCommandButton backButton = (HtmlCommandButton)app.createComponent(HtmlCommandButton.COMPONENT_TYPE);
          backButton.setId("back");
          backButton.setTitle("Cancel");
          backButton.setValue("Avbryt");
          backButton.setAction(app.createMethodBinding("#{ProjectController.cancel}", null));
          panelGrid.getChildren().add(createButton);
          panelGrid.getChildren().add(backButton);
          return panelGrid;
     /* } else {
          return null;
}

Hi,
I'm having the exact same problem, and it's freaking me out!!! The setGridPanel method is always called but not the getGridPanel. This one is only called the first time the page is rendered, and when I change a drodpdownlist it never gets the gridPanel again! I'm using an HtmlPanelGrid. Anyone can help please?
Thanks in advance,
Raquel

Alignment of the components inside tab in JTabbedPane

I want to align the components inside the tab in tabbedpane.
I have three tabs in the tabbed pane For each tab I added the components on the panel and added the panel as a tab.
But as the number of components on each tab are not same the components inside the tab doesn't get aligned properly.
The components gets aligned in the center and I want to align them at top. How can I do that?
Please help..

How does
the number of components on each tab are not samerelates to
the components inside the tab doesn't get aligned properly. The components gets aligned in the center and I want to align them at top??

Copied/pasted group of components lose many properties

(Xcelsius 2008 SP1 FP1 5.1.1.0 (Build 12,1,1,344), Windows XP SP2)
After copying/pasting 120 or so grouped components all at once, the Value, Check box and Toggle components seemed to lose most of their properties. The main container within the group of copied objects is a panel container that included nested groups of labels, rectangles, values, check boxes and toggles.
Specific example: All Value components originally had a title position of "Left" and specific font name/sizes. They also had specific X axis offsets. And of course, each was pointed to a specific spreadsheet cell. The copies, however, reverted to the respective defaults for all properties minus the text of the titles. (This is of course not an exhaustive list of the affected components/properties).
I have already had experience copying smaller groups of components and did not see this effect, so I wonder if there is a threshold of some kind here.

>
NFN Purnima wrote:
> There is no exact threshold for copy pasting components.When copy pasted in large numbers some components might lose their original bindings and may either experience cosmetic changes in label and title position offset or like you experienced would revert back to their original settings.I would recommend copy pasting in smaller groups to maintain consistency.
> Thanks,
> Purnima
Thank you, Purnima. Despite my fears, copying and pasting smaller groups within the larger nesting appears to be working out pretty well, so this may become a non-issue for me. Nevertheless, it would be great if a future version of Xcelsius would support larger groups within a copy and paste.

Overlap of components in the panel

This is for an application which computes the total cost of configured laptop.
The main window has 2 panels. The top panel should have a label, and textfield. 3 comboboxes, radiobuttton group, 2 check boxes. I am not able to display the components next to each other. They overlap in the top panel.(This panel has a GridLayout) The code is as follows(does not have all the components yet)
The 2nd panel has a 2 buttons and textarea. Can anybody please help.
import java.awt.event.*;
import javax.swing.*;
import java.awt.*;
import java.util.*;
public class WClass extends JFrame implements ActionListener
     private Container pane;
     private JPanel P1;
     private JPanel P2;
     private JButton submit;
     private JButton clear;
     private JTextArea Out;
     private JLabel name;
     private JTextField Custname;
     private JComboBox processor;
     private JComboBox harddrive;
     int row;
     public WClass()
          super("Laptop Computer Configuration");
          P1 = new JPanel();
          P1.setLayout(new GridLayout(2,4));
          P2 = new JPanel(new BorderLayout());
          name = new JLabel("Customer Name");
          add(name);
          Custname = new JTextField(10);
          Custname.addActionListener(this);
          add(Custname);
          String p[] = {"Pentium 4", "Celeron", "AMD", "Intel Centrino"};
          processor = new JComboBox(p);
          processor.setMaximumRowCount(3);
          processor.addItemListener(
                         new ItemListener()
               public void itemStateChanged(ItemEvent e)
                    if(e.getStateChange() == ItemEvent.SELECTED)
                    row = processor.getSelectedIndex();
          add(processor);
          String h[] = {"30 GB", "40 GB", "60 GB"};
          harddrive = new JComboBox(h);
          harddrive.setMaximumRowCount(2);
          harddrive.addItemListener(
                         new ItemListener()
               public void itemStateChanged(ItemEvent e)
                    if(e.getStateChange() == ItemEvent.SELECTED)
                    row = harddrive.getSelectedIndex();
          add(harddrive);
     add(P1, BorderLayout.NORTH);
          submit = new JButton("Submit");
          clear = new JButton("Clear");
          Out = new JTextArea(10,5);
          P2.add(submit, BorderLayout.WEST);
          P2.add(clear, BorderLayout.EAST);
          P2.add(Out,BorderLayout.CENTER);
          add(P2, BorderLayout.SOUTH);
     public void actionPerformed(ActionEvent event)
import javax.swing.JFrame;
public class Win
     public static void main(String args[])
          WClass window = new WClass();
          window.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE );
          window.setSize( 500,400);
          window.setVisible( true);
}

It is not easy to read your code due to lack of formatting. When you post code you should highlight it and click the "code" button. This preserves the formatting.
I see some lines that say "add(whatever)". Shouldn't these be "P1.add(whatever)". In other words you want to be adding components to a panel rather than the base JFrame if I understand your requirement..

How to create public group in office 365 admin panel?

Dear Microsoft ,
I try to create group in office 365 admin panel but in that group when i add outsider mail id eg([email protected],[email protected]) is not created ...it's showing error.Can please help me to how i create public group in office 365 ?

Hi,
Which error message does it show?
Based on my research, internal users (users that have a mailbox in your organization) and external users (people that don’t have a mailbox in you organization) can be added as members of a distribution group. However, only external users
that have been added to your organization’s address book (also known as shared contacts), can be members of a group. For information about how to add external users to your organization’s address book, see
Create and use shared contacts.
Hope this helps.
Regards,
Steve Fan
TechNet Community Support

How to group UI components into an array in MXML

Hi all,
I'm new in Flex. I want to group UI components into an array
in MXML, but I don't know how to do so. Pseudo code looks like
following:
<mx:Text id="arrayItems[]"/>
<mx:Text id="arrayItems[]"/>
<mx:Text id="arrayItems[]"/>
In AS3, I would like to execute a method as follows:
<mx:Script>
<![CDATA[
private function setTextFields():void {
for (var i:int = 0; i < arrayItems.length; i++) {
arrayItems[ i ].text = "Text " + i;
]]>
</mx:Script>
Anybody please help me to correct the MXML code above.
Thanks alot,
KhoaNgo

The easiest way is to use a repeater.
HTH;
Amy
"KhoaNgo" <[email protected]> wrote in
message
news:gpla74$78u$[email protected]..
> Hi all,
>
> I'm new in Flex. I want to group UI components into an
array in MXML, but
> I
> don't know how to do so. Pseudo code looks like
following:
>
> <mx:Text id="arrayItems[]"/>
> <mx:Text id="arrayItems[]"/>
> <mx:Text id="arrayItems[]"/>
>
> In AS3, I would like to execute a method as follows:
>
> <mx:Script>
> <![CDATA[
> private function setTextFields():void {
> for (var i:int = 0; i < arrayItems.length; i++) {
> arrayItems
.text = "Text " + i;
> }
> }
> ]]>
> </mx:Script>
>
> Anybody please help me to correct the MXML code above.
> Thanks alot,
> KhoaNgo
>

Rendering each child t:tree node in seperate column in panel grid

I have a tree component using tomahawk <t:tree>
Each child in the tree denotes a level in my application and I would like to display that inside different columns in Panel Grid or Data Table) it does not matter).
Say, the tree has a root node with 3 child nodes(immediate) , then there should be a total of 2 columns.
First column will have root node, and the next column will have 3 child nodes.
Similarly if the structure is as below
A -root node
B - child of A
C - child of B
D - child of C
then there should be 4 columns,
first column will have A,second B, third C and fourth D.
I tried to use binding in PanelGrid and then tried to add DefaultMutableTreeNode, but could not find a way of how to achieve this.
Any suggestion or link will be helpful.
Regards,
Joshua

You might want to try the Tomahawk user's mailing (or the MyFaces user's mailing list if there is not one specifically for Tomahawk).

Panel Grid Layout: Column Span unexpected behavior.

Whenever in a Panel Grid Layout, when i give a cell to span over multiple columns(2,3,4 or any), the cell is spanned over the entire row only.. Why does this behavior happens? In JDeveloper, the spanning is shown correctly in design tab and preview tab.

Hi Amanda,
I believe I have discovered the cause of the issue you are facing.
The problem is with the "Alert Region" region template and that it does not have any display points specified so indicate the number of grids that can fit in its region body. Without having any display points, the grid layout system attempts to use all columns available to its container. However, because the Alert Region has additional padding within, the columns will not fit and wrap to the next line.
To fix this issue, you will have to modify the "Alert Region" region template, go to "Display Points" and click Add Row. You will need to enter the following fields:
Name: Region Body
Template Substitution: BODY
Grid Support: Checked
Maximum Fixed Grid Columns: -1
This will fix the issue for you. I've logged a bug within our bug system to track this so we can fix it in a future release of APEX.
Best,
Shakeeb

Repeating groups of components?

I'd like to lay out a group of components that are populated
by an xml file and repeat them for each node group in that file.
So, for instance, if I have an xml file like the following:
<groups>
<group id="1"/>
<hardware name="hw1">
<software type="OS" name="Windows2000"
vendor="Microsoft"/>
<software type="Spreadsheet" name="Excel"
vendor="Microsoft"/>
</hardware>
<hardware name="hw2">
<software type="OS" name="WindowsXP"
vendor="Microsoft"/>
<software type="Spreadsheet" name="Excel"
vendor="Microsoft"/>
</hardware>
</group>
<group id="2"/>
<hardware name="hw1">
<software type="OS" name="Windows2000"
vendor="Microsoft"/>
<software type="Spreadsheet" name="Excel"
vendor="Microsoft"/>
</hardware>
<hardware name="hw2">
<software type="OS" name="WindowsXP"
vendor="Microsoft"/>
<software type="Spreadsheet" name="Excel"
vendor="Microsoft"/>
</hardware>
</group>
</groups>
And I want to display:
Name: Group 1
Hardware: hw1
(datagrid containing software)
Name: Group 2
Hardware: hw2
(datagrid containing software)
So, 'Name' and 'Hardware' are static labels, and 'Group 1'
and 'Group 2' and the datagrids are dynamically populated from the
xml file. A standard list or hbox/vbox combo won't seem to work
because I'd like the positioning of the elements to be more precise
(with indenting, etc).
I'd also like to contain all of these repeated components
within a Canvas within a TabNavigator.
Any ideas?
Thanks in advance.

Post back after you have looked at this and tried a bit and
have any specific questions.

Disable all the components of a panel ( panels within the main panel )

Hi guys!
I have a problem!
i have to disable all the components of a panel. please note that i am also having panels within the main panel. please tell me how to do that!!!
its urgent!!

Hi guys!
I have a problem!Wouldn't have figured that one out by myself ...
its urgent!!No, it's not.
You know, a panel is most often a subclass of Container, so all you need to do is recursively disable all child components. The methods getComponents and getComponent are very helpful when trying to access child components. Code likeif ( comp instanceof Container )
// do soemthing
}will help in determining whether a child component is yet another Container.

Add grid rows in panel grid layout in adf UI page

I'm using panel grid layout in adf UI page. I need to add a dynamic grid row in panelGridLayout. Or in simple way programatically I need to add grid rows in panel grid layout in adf UI page.Timo Hahn Frank Nimphius Shay Shmeltzer-Oracle

Hi Shay,
It is a dynamic grid.
there can be one dropdown, two dropdown.... n dropdown.
Please tell me if there is any specific method to add children.

Panel grid server side

I want to add a panel grid to a page dynamiclly but I don't know what is the corresponding server side object (UI...). what is the easiest way to find server side objects for jsf tags ?

Just check the Javadoc and the JSF tutorial.

Aligning group of components in a panel grid

Similar Messages

Maybe you are looking for