Examples with WHeading com.github.bordertech.wcomponents.WHeading used on opensource projects

Example 36 with WHeading

use of com.github.bordertech.wcomponents.WHeading in project wcomponents by BorderTech.

the class WButtonExample method addDefaultSubmitButtonExample.

/**
 * Examples showing how to set a WButton as the default submit button for an input control.
 */
private void addDefaultSubmitButtonExample() {
    add(new WHeading(HeadingLevel.H3, "Default submit button"));
    add(new ExplanatoryText("This example shows how to use an image as the only content of a WButton. " + "In addition this text field submits the entire screen using the image button to the right of the field."));
    // We use WFieldLayout to lay out a label:input pair. In this case the input is a
    // compound control of a WTextField and a WButton.
    WFieldLayout imageButtonFieldLayout = new WFieldLayout();
    imageButtonFieldLayout.setLabelWidth(25);
    add(imageButtonFieldLayout);
    // the text field and the button both need to be defined explicitly to be able to add them into a wrapper
    WTextField textFld = new WTextField();
    // and finally we get to the actual button
    WButton button = new WButton("Flag this record for follow-up");
    button.setImage("/image/flag.png");
    button.getImageHolder().setCacheKey("eg-button-flag");
    button.setActionObject(button);
    button.setAction(new ExampleButtonAction());
    // we can set the image button to be the default submit button for the text field.
    textFld.setDefaultSubmitButton(button);
    // There are many way of putting multiple controls in to a WField's input.
    // We are using a WContainer is the one which is lowest impact in the UI.
    WContainer imageButtonFieldContainer = new WContainer();
    imageButtonFieldContainer.add(textFld);
    // Use a WText to push the button off of the text field by an appropriate (user-agent determined) amount.
    // an en space is half an em. a none-breaking space \u00a0 could also be used but will have no effect on inter-node wrapping
    imageButtonFieldContainer.add(new WText("\u2002"));
    imageButtonFieldContainer.add(button);
    // Finally add the input wrapper to the WFieldLayout
    imageButtonFieldLayout.addField("Enter record ID", imageButtonFieldContainer);
}

Example 37 with WHeading

use of com.github.bordertech.wcomponents.WHeading in project wcomponents by BorderTech.

the class ColumnLayoutExample method addHgapVGapExample.

/**
 * Build an example using hgap and vgap.
 *
 * @param hgap the hgap width
 * @param vgap the vgap width
 */
private void addHgapVGapExample(final Size hgap, final Size vgap) {
    add(new WHeading(HeadingLevel.H2, "Column Layout: hgap=" + hgap.toString() + " vgap=" + vgap.toString()));
    WPanel panel = new WPanel();
    panel.setLayout(new ColumnLayout(new int[] { 25, 25, 25, 25 }, hgap, vgap));
    add(panel);
    for (int i = 0; i < 8; i++) {
        panel.add(new BoxComponent("25%"));
    }
    add(new WHorizontalRule());
}

Example 38 with WHeading

use of com.github.bordertech.wcomponents.WHeading in project wcomponents by BorderTech.

the class ColumnLayoutExample method addResponsiveExample.

/**
 * Add a column layout which will change its rendering on small screens.
 */
private void addResponsiveExample() {
    add(new WHeading(HeadingLevel.H2, "Default responsive design"));
    add(new ExplanatoryText("This example applies the theme's default responsive design rules for ColumnLayout.\n " + "The columns have width and alignment and there is also a hgap and a vgap."));
    WPanel panel = new WPanel();
    panel.setLayout(new ColumnLayout(new int[] { 33, 33, 33 }, new Alignment[] { Alignment.LEFT, Alignment.CENTER, Alignment.RIGHT }, 12, 18));
    panel.setHtmlClass(HtmlClassProperties.RESPOND);
    add(panel);
    panel.add(new BoxComponent("Left"));
    panel.add(new BoxComponent("Center"));
    panel.add(new BoxComponent("Right"));
    panel.add(new BoxComponent("Left"));
    panel.add(new BoxComponent("Center"));
    panel.add(new BoxComponent("Right"));
}

Example 39 with WHeading

use of com.github.bordertech.wcomponents.WHeading in project wcomponents by BorderTech.

the class ColumnLayoutExample method addAutoWidthExample.

/**
 * This example shows a column which does not have widths set in Java. This is a "good thing": widths should be set in CSS.
 */
private void addAutoWidthExample() {
    add(new WHeading(HeadingLevel.H2, "Automatic (app defined) widths"));
    add(new ExplanatoryText("This example shows what happens if you use undefined (0) column width and do not then define them in CSS."));
    WPanel panel = new WPanel();
    panel.setLayout(new ColumnLayout(new int[] { 0, 0, 0 }, new Alignment[] { Alignment.LEFT, Alignment.CENTER, Alignment.RIGHT }));
    add(panel);
    panel.add(new BoxComponent("Neque porro quisquam est qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit..."));
    panel.add(new BoxComponent("Praesent eu turpis convallis, fringilla elit nec, ullamcorper purus. Proin dictum ac nunc rhoncus fringilla. " + "Pellentesque habitant morbi tristique senectus et netus et malesuada fames."));
    panel.add(new BoxComponent("Vestibulum vehicula a turpis et efficitur. Integer maximus enim a orci posuere, id fermentum magna dignissim. " + "Sed condimentum, dui et condimentum faucibus, quam erat pharetra."));
    panel.add(new BoxComponent("Left"));
    panel.add(new BoxComponent("Center"));
    panel.add(new BoxComponent("Right"));
    add(new WHorizontalRule());
}

Example 40 with WHeading

use of com.github.bordertech.wcomponents.WHeading in project wcomponents by BorderTech.

the class TreePicker method buildUI.

/**
 * Add all the bits in the right order.
 */
private void buildUI() {
    add(new WSkipLinks());
    // the application header
    add(headerPanel);
    headerPanel.add(new UtilityBar());
    headerPanel.add(new WHeading(HeadingLevel.H1, "WComponents"));
    // mainPanel holds the menu and the actual example.
    add(mainPanel);
    mainPanel.add(menuPanel);
    mainPanel.add(exampleSection);
    // An application footer?
    WPanel footer = new WPanel(WPanel.Type.FOOTER);
    footer.add(lastLoaded);
    add(footer);
    add(new WAjaxControl(menuPanel.getTree(), new AjaxTarget[] { menuPanel.getMenu(), exampleSection }));
}