Examples with FlowLayout com.github.bordertech.wcomponents.layout.FlowLayout used on opensource projects

Example 11 with FlowLayout

use of com.github.bordertech.wcomponents.layout.FlowLayout in project wcomponents by BorderTech.

the class WRadioButtonSelectExample method makeSimpleExample.

/**
 * Make a simple editable example. The label for this example is used to get the example for use in the unit tests.
 */
private void makeSimpleExample() {
    add(new WHeading(HeadingLevel.H3, "Simple WRadioButtonSelect"));
    WPanel examplePanel = new WPanel();
    examplePanel.setLayout(new FlowLayout(FlowLayout.VERTICAL, Size.MEDIUM));
    add(examplePanel);
    /**
     * The radio button select.
     */
    final WRadioButtonSelect rbSelect = new WRadioButtonSelect("australian_state");
    final WTextField text = new WTextField();
    text.setReadOnly(true);
    text.setText(NO_SELECTION);
    WButton update = new WButton("Update");
    update.setAction(new Action() {

        @Override
        public void execute(final ActionEvent event) {
            text.setText("The selected item is: " + rbSelect.getSelected());
        }
    });
    // setting the default submit button improves usability. It can be set on a WPanel or the WRadioButtonSelect directly
    examplePanel.setDefaultSubmitButton(update);
    examplePanel.add(new WLabel("Select a state or territory", rbSelect));
    examplePanel.add(rbSelect);
    examplePanel.add(text);
    examplePanel.add(update);
    add(new WAjaxControl(update, text));
}

Example 12 with FlowLayout

use of com.github.bordertech.wcomponents.layout.FlowLayout in project wcomponents by BorderTech.

the class WTabSetExample method constructExample.

/**
 * Helper to do the work of the constructor since we do not really want to call over-rideable methods in a
 * constructor.
 */
private void constructExample() {
    add(new WHeading(HeadingLevel.H2, "Examples showing TabSet Type property."));
    add(new WHeading(HeadingLevel.H3, "Tabs at the top"));
    WTabSet tabset0 = new SampleWTabset();
    add(tabset0);
    add(new WHeading(HeadingLevel.H3, "Tabs at the top with explicit TYPE"));
    /* Explicitly setting TYPE_TOP is superfluous */
    WTabSet tabset1 = new SampleWTabset(WTabSet.TYPE_TOP);
    add(tabset1);
    add(new WHeading(HeadingLevel.H3, "Tabs on the LEFT"));
    WTabSet tabset1a = new SampleWTabset(WTabSet.TYPE_LEFT);
    add(tabset1a);
    add(new WHeading(HeadingLevel.H3, "Tabs on the RIGHT"));
    WTabSet tabset1b = new SampleWTabset(WTabSet.TYPE_RIGHT);
    add(tabset1b);
    add(new WHeading(HeadingLevel.H3, "ACCORDION tabs"));
    WTabSet tabset1c = new SampleWTabset(TabSetType.ACCORDION);
    add(tabset1c);
    add(new WHorizontalRule());
    /* Content height */
    add(new WHeading(HeadingLevel.H2, "Examples showing content height property."));
    add(new WHeading(HeadingLevel.H3, "Tall content."));
    WTabSet htabset1 = new SampleWTabset();
    htabset1.setContentHeight(TALL_CONTENT);
    add(htabset1);
    WTabSet htabset1a = new SampleWTabset(WTabSet.TYPE_LEFT);
    htabset1a.setContentHeight(TALL_CONTENT);
    add(htabset1a);
    WTabSet htabset1b = new SampleWTabset(WTabSet.TYPE_RIGHT);
    htabset1b.setContentHeight(TALL_CONTENT);
    add(htabset1b);
    WTabSet htabset1c = new SampleWTabset(TabSetType.ACCORDION);
    htabset1c.setContentHeight(TALL_CONTENT);
    add(htabset1c);
    add(new WHeading(HeadingLevel.H3, "Short content."));
    WTabSet htabset1d = new SampleWTabset();
    htabset1d.setContentHeight(SHORT_CONTENT);
    add(htabset1d);
    WTabSet htabset1e = new SampleWTabset(WTabSet.TYPE_LEFT);
    htabset1e.setContentHeight(SHORT_CONTENT);
    add(htabset1e);
    WTabSet htabset1f = new SampleWTabset(WTabSet.TYPE_RIGHT);
    htabset1f.setContentHeight(SHORT_CONTENT);
    add(htabset1f);
    WTabSet htabset1g = new SampleWTabset(TabSetType.ACCORDION);
    htabset1g.setContentHeight(SHORT_CONTENT);
    add(htabset1g);
    add(new WHorizontalRule());
    add(new WHeading(HeadingLevel.H2, "Examples showing disabled property."));
    /* NOTE: WTabSet does not currently implement SubordinateTarget therefore one cannot create a subordinate
		 * control to disable/enable a WTabSet.
		 */
    WTabSet disabledTabset = new SampleWTabset();
    disabledTabset.setDisabled(true);
    add(disabledTabset);
    add(new WHeading(HeadingLevel.H2, "Examples showing accordion's single property."));
    WTabSet singleOpenAccordionabset = new SampleWTabset(WTabSet.TYPE_ACCORDION);
    singleOpenAccordionabset.setSingle(true);
    add(singleOpenAccordionabset);
    add(new WHorizontalRule());
    /* NOTE: no example of the hidden property because WTabSet is not a subordinate target. This is inconsistent
		 * with the schema. */
    add(new WHeading(HeadingLevel.H2, "Setting the initially active tab"));
    add(new WHeading(HeadingLevel.H3, "Server side with tabs on the left, with second tab initially active."));
    WTabSet tabset3 = new WTabSet(WTabSet.TYPE_LEFT);
    tabset3.setContentHeight("10em");
    tabset3.addTab(new WText("Some content should go in here."), "First tab", WTabSet.TAB_MODE_SERVER, 'i');
    WPanel largeContent2 = new WPanel();
    largeContent2.setLayout(new FlowLayout(Alignment.VERTICAL));
    largeContent2.add(new WText(LONG_TEXT));
    largeContent2.add(new WText(LONG_TEXT));
    largeContent2.add(new WText(LONG_TEXT));
    tabset3.addTab(largeContent2, "Second tab which is much longer", WTabSet.TAB_MODE_SERVER, 'e');
    WImage image = new WImage("/image/success.png", "success");
    image.setCacheKey("eg-image-tab");
    WDecoratedLabel tabLabel = new WDecoratedLabel(image, new WText("Third tab"), null);
    tabset3.addTab(new WText("The tab button for this tab has an image!"), tabLabel, WTabSet.TAB_MODE_SERVER, 'h');
    // Set 2nd tab active
    tabset3.setActiveIndex(1);
    add(tabset3);
    add(new WHeading(HeadingLevel.H3, "Client side with tabs on the right and the third tab initially active."));
    WText thirdContent = new WText("Some more content should go into here.");
    WTabSet tabset4 = new WTabSet(WTabSet.TYPE_RIGHT);
    tabset4.setContentHeight("10em");
    tabset4.addTab(new WText("Some content should go into here."), "First tab", WTabSet.TAB_MODE_CLIENT);
    tabset4.addTab(new WText(LONG_TEXT), "Second tab which is longer", WTabSet.TAB_MODE_CLIENT);
    tabset4.addTab(thirdContent, "Third tab", WTabSet.TAB_MODE_CLIENT);
    // Set 3rd tab active
    tabset4.setActiveTab(thirdContent);
    add(tabset4);
    add(new WHeading(HeadingLevel.H3, "Client side with showing lots of tabs."));
    add(new ExplanatoryText("This will effectively show what happens when tabs need to wrap. You should do everything possible to avoid this situation."));
    WTabSet tabset5 = new WTabSet();
    tabset5.addTab(new WText("Tab 1."), "First tab", WTabSet.TAB_MODE_CLIENT);
    tabset5.addTab(new WText("Tab 2."), "Second tab", WTabSet.TAB_MODE_CLIENT);
    tabset5.addTab(new WText("Tab 3."), "Third tab", WTabSet.TAB_MODE_CLIENT);
    tabset5.addTab(new WText("Tab 4."), "Fourth tab", WTabSet.TAB_MODE_CLIENT);
    tabset5.addTab(new WText("Tab 5."), "Fifth tab", WTabSet.TAB_MODE_CLIENT);
    tabset5.addTab(new WText("Tab 6."), "Sixth tab", WTabSet.TAB_MODE_CLIENT);
    tabset5.addTab(new WText("Tab 7."), "Seventh tab", WTabSet.TAB_MODE_CLIENT);
    tabset5.addTab(new WText("Tab 8."), "Eighth tab", WTabSet.TAB_MODE_CLIENT);
    tabset5.addTab(new WText("Tab 9."), "Nineth tab", WTabSet.TAB_MODE_CLIENT);
    tabset5.addTab(new WText("Tab 10."), "Tenth tab", WTabSet.TAB_MODE_CLIENT);
    tabset5.addTab(new WText("Tab 11."), "Eleventh tab", WTabSet.TAB_MODE_CLIENT);
    tabset5.addTab(new WText("Tab 12."), "Twelfth tab", WTabSet.TAB_MODE_CLIENT);
    tabset5.addTab(new WText("Tab 13."), "Thirteenth tab", WTabSet.TAB_MODE_CLIENT);
    tabset5.addTab(new WText("Tab 14."), "Fourteenth tab", WTabSet.TAB_MODE_CLIENT);
    tabset5.addTab(new WText("Tab 15."), "Fifteenth tab", WTabSet.TAB_MODE_CLIENT);
    add(tabset5);
    add(new WHorizontalRule());
    add(new WHeading(HeadingLevel.H2, "Using WSubordinateControl"));
    WTabSet targetTabset = new SampleWTabset();
    add(targetTabset);
    WFieldLayout layout = new WFieldLayout(WFieldLayout.LAYOUT_STACKED);
    add(layout);
    final WCheckBox disabledControllerCb = new WCheckBox();
    final WCheckBox hiddenControllerCb = new WCheckBox();
    layout.addField("disable tabset", disabledControllerCb);
    layout.addField("hide tabset", hiddenControllerCb);
    // Build & add the subordinate
    SubordinateBuilder builder = new SubordinateBuilder();
    builder.condition().equals(hiddenControllerCb, String.valueOf(true));
    builder.whenTrue().hide(targetTabset);
    builder.whenFalse().show(targetTabset);
    add(builder.build());
    builder = new SubordinateBuilder();
    builder.condition().equals(disabledControllerCb, String.valueOf(true));
    builder.whenTrue().disable(targetTabset);
    builder.whenFalse().enable(targetTabset);
    add(builder.build());
}

Example 13 with FlowLayout

use of com.github.bordertech.wcomponents.layout.FlowLayout in project wcomponents by BorderTech.

the class FlowLayoutRenderer method doRender.

/**
 * Paints the given WPanel's children.
 *
 * @param component the container to paint.
 * @param renderContext the RenderContext to paint to.
 */
@Override
public void doRender(final WComponent component, final WebXmlRenderContext renderContext) {
    WPanel panel = (WPanel) component;
    XmlStringBuilder xml = renderContext.getWriter();
    FlowLayout layout = (FlowLayout) panel.getLayout();
    Size gap = layout.getSpace();
    String gapString = gap != null ? gap.toString() : null;
    FlowLayout.Alignment align = layout.getAlignment();
    xml.appendTagOpen("ui:flowlayout");
    switch(align) {
        case RIGHT:
            {
                xml.appendAttribute("align", "right");
                break;
            }
        case CENTER:
            {
                xml.appendAttribute("align", "center");
                break;
            }
        case LEFT:
            {
                xml.appendAttribute("align", "left");
                break;
            }
        case VERTICAL:
            xml.appendAttribute("align", "vertical");
            break;
        default:
            throw new IllegalStateException("Unknown layout type: " + layout.getAlignment());
    }
    if (layout.getContentAlignment() != null) {
        switch(layout.getContentAlignment()) {
            case TOP:
                {
                    xml.appendAttribute("valign", "top");
                    break;
                }
            case MIDDLE:
                {
                    xml.appendAttribute("valign", "middle");
                    break;
                }
            case BASELINE:
                {
                    xml.appendAttribute("valign", "baseline");
                    break;
                }
            case BOTTOM:
                xml.appendAttribute("valign", "bottom");
                break;
            default:
                throw new IllegalStateException("Unknown content alignment type: " + layout.getContentAlignment());
        }
    }
    xml.appendOptionalAttribute("gap", gapString);
    xml.appendClose();
    int size = panel.getChildCount();
    for (int i = 0; i < size; i++) {
        xml.appendTag("ui:cell");
        WComponent child = panel.getChildAt(i);
        child.paint(renderContext);
        xml.appendEndTag("ui:cell");
    }
    xml.appendEndTag("ui:flowlayout");
}

Example 14 with FlowLayout

use of com.github.bordertech.wcomponents.layout.FlowLayout in project wcomponents by BorderTech.

the class FlowLayoutRenderer_Test method testDoRenderWhenEmpty.

// The expected render of the default constructor.
@Test
public void testDoRenderWhenEmpty() throws IOException, SAXException, XpathException {
    WPanel panel = new WPanel();
    panel.setLayout(new FlowLayout());
    assertSchemaMatch(panel);
    assertXpathExists("//ui:panel/ui:flowlayout", panel);
    assertXpathEvaluatesTo("center", "//ui:panel/ui:flowlayout/@align", panel);
    assertXpathNotExists("//ui:panel/ui:flowlayout/ui:cell", panel);
    assertXpathNotExists("//ui:panel/ui:flowlayout/@gap", panel);
    assertXpathNotExists("//ui:panel/ui:flowlayout/@valign", panel);
}

Example 15 with FlowLayout

use of com.github.bordertech.wcomponents.layout.FlowLayout in project wcomponents by BorderTech.

the class FlowLayoutRenderer_Test method testRenderContentAlignment.

@Test
public void testRenderContentAlignment() throws IOException, SAXException, XpathException {
    WPanel panel = new WPanel();
    String expected;
    for (FlowLayout.Alignment a : FlowLayout.Alignment.values()) {
        for (FlowLayout.ContentAlignment c : FlowLayout.ContentAlignment.values()) {
            panel.setLayout(new FlowLayout(a, c));
            assertSchemaMatch(panel);
            assertXpathExists("//ui:panel/ui:flowlayout", panel);
            expected = a.toString().toLowerCase();
            assertXpathEvaluatesTo(expected, "//ui:panel/ui:flowlayout/@align", panel);
            if (a == FlowLayout.VERTICAL) {
                assertXpathNotExists("//ui:panel/ui:flowlayout/@valign", panel);
            } else {
                expected = c.toString().toLowerCase();
                assertXpathEvaluatesTo(expected, "//ui:panel/ui:flowlayout/@valign", panel);
            }
        }
    }
}