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

Example 16 with WHeading

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

the class WLabelExample method addNullLabelExample.

/**
 * Example of when and how to use a null WLabel.
 */
private void addNullLabelExample() {
    add(new WHeading(HeadingLevel.H2, "How to use accessible null WLabels"));
    add(new ExplanatoryText("These examples shows how sometime a null WLabel is the right thing to do." + "\n This example uses a WFieldSet as the labelled component and it has its own \"label\"."));
    // We want to add a WFieldSet to a WFieldLayout but without an extra label.
    WFieldLayout fieldsFlat = new WFieldLayout();
    fieldsFlat.setMargin(new Margin(null, null, Size.XL, null));
    add(fieldsFlat);
    WFieldSet fs = new WFieldSet("Do you like Bananas?");
    fieldsFlat.addField((WLabel) null, fs);
    // now add the WRadioButtons to the WFieldSet using an inner WFieldLayout
    WFieldLayout innerLayout = new WFieldLayout(WFieldLayout.LAYOUT_STACKED);
    // The content will be a group of WRadioButtons
    RadioButtonGroup group1 = new RadioButtonGroup();
    WRadioButton rb1 = group1.addRadioButton(1);
    WRadioButton rb2 = group1.addRadioButton(2);
    // make the labels for the radio buttons
    WLabel rb1Label = new WLabel("", rb1);
    WImage labelImage = new WImage("/image/success.png", "I still like bananas");
    labelImage.setHtmlClass("wc-valign-bottom");
    rb1Label.add(labelImage);
    WLabel rb2Label = new WLabel("", rb2);
    labelImage = new WImage("/image/error.png", "I still dislike bananas");
    labelImage.setHtmlClass("wc-valign-bottom");
    rb2Label.add(labelImage);
    innerLayout.addField(rb1Label, rb1);
    innerLayout.addField(rb2Label, rb2);
    // add the content to the WFieldLayout - the order really doesn't matter.
    fs.add(group1);
    fs.add(innerLayout);
}

Example 17 with WHeading

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

the class WLabelExample method addAntiPatternExamples.

/**
 * Add examples you should never follow. DO NOT use the following as examples of what to do: these are examples of what NOT to do.
 */
private void addAntiPatternExamples() {
    add(new WHeading(HeadingLevel.H2, "WLabel anti-patterns"));
    add(new ExplanatoryText("These are here for testing purposes and must not be used as examples to follow.\n" + "Turn on debugging (bordertech.wcomponents.debug.enabled=true) to get much more information."));
    add(new WHeading(HeadingLevel.H3, "Poor but not erroneous uses of WLabel"));
    WPanel errorLayoutPanel = new WPanel();
    errorLayoutPanel.setLayout(new FlowLayout(FlowLayout.VERTICAL, Size.LARGE));
    add(errorLayoutPanel);
    // label not for anything should not be a WLabel
    errorLayoutPanel.add(new WLabel("I am not 'for' anything"));
    // WLabel for something which is not labellable
    errorLayoutPanel.add(new WLabel("I am for a component which should not be labelled", errorLayoutPanel));
    // If the WLabel is 'for' something that is not in the tree it becomes 'for' the WApplication. This is not necessarily a good thing!!!
    WCheckBox notHere = new WCheckBox();
    errorLayoutPanel.add(new WLabel("My component wasn't added", notHere));
    /*
		 * The examples which follow MUST NEVER BE USED! They cause ERRORS.
		 * They are here purely for framework testing.
		 */
    add(new WHeading(HeadingLevel.H3, "Very bad uses of WLabel"));
    errorLayoutPanel = new WPanel();
    errorLayoutPanel.setLayout(new FlowLayout(FlowLayout.VERTICAL, Size.LARGE));
    add(errorLayoutPanel);
    /*
		 * Nested WLabels: very bad
		 */
    errorLayoutPanel.add(new ExplanatoryText("This example shows nested WLabels. This is a contravention of the HTML specification."));
    WPanel nestingErrorPanel = new WPanel();
    nestingErrorPanel.setLayout(new ColumnLayout(new int[] { 50, 50 }, Size.LARGE, Size.MEDIUM));
    errorLayoutPanel.add(nestingErrorPanel);
    WTextField outerField = new WTextField();
    WLabel outerLabel = new WLabel("I am an outer label", outerField);
    nestingErrorPanel.add(outerLabel);
    WTextField innerField = new WTextField();
    WLabel innerLabel = new WLabel("Inner label", innerField);
    // add the inner label to the outer label: this is the ERROR
    outerLabel.add(innerLabel);
    nestingErrorPanel.add(innerField);
    nestingErrorPanel.add(outerField);
    /*
		 * It is permissible to place certain simple form control components into
		 * a WLabel under the following conditions:
		 * there must be no more than one such component in the WLabel;
		 * the component MUST be one which outputs a simple HTML form control
		 * (and I am not going to tell you which they are);
		 * The WLabel must be 'for' the nested component or not 'for' anything.
		 */
    errorLayoutPanel.add(new ExplanatoryText("This example shows a WLabel with a nested simple form control WTextField but the WLabel is not " + "'for' the WTextField. This is a contravention of the HTML specification."));
    WTextField notMyField = new WTextField();
    notMyField.setToolTip("This field should not be in the label it is in");
    WTextField myField = new WTextField();
    WLabel myFieldLabel = new WLabel("I am not the label for my nested text field", myField);
    nestingErrorPanel = new WPanel();
    nestingErrorPanel.setLayout(new ColumnLayout(new int[] { 50, 50 }, 12, 6));
    errorLayoutPanel.add(nestingErrorPanel);
    nestingErrorPanel.add(myFieldLabel);
    nestingErrorPanel.add(myField);
    // adding the 'wrong' WTextField to a WLabel is what causes this error
    myFieldLabel.add(notMyField);
    add(new ExplanatoryText("The next field has a label explicitly set to only white space."));
    WTextField emptyLabelTextField = new WTextField();
    WLabel emptyLabel = new WLabel(" ", emptyLabelTextField);
    add(emptyLabel);
    add(emptyLabelTextField);
    add(new WHeading(HeadingLevel.H2, "Unlabelled controls"));
    add(new ExplanatoryText("These controls must be labelled but are not."));
    WFieldLayout fieldsFlat = new WFieldLayout();
    add(fieldsFlat);
    fieldsFlat.addField((WLabel) null, new WTextField());
    fieldsFlat.addField((WLabel) null, new WTextArea());
    fieldsFlat.addField((WLabel) null, new WDateField());
    fieldsFlat.addField((WLabel) null, new WCheckBox());
    fieldsFlat.addField((WLabel) null, new WCheckBoxSelect(new String[] { "Apple", "Cherry", "Orange", "Pineapple" }));
}

Example 18 with WHeading

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

the class WButtonExample method addDisabledExamples.

/**
 * Examples of disabled buttons in various guises.
 */
private void addDisabledExamples() {
    add(new WHeading(HeadingLevel.H2, "Examples of disabled buttons"));
    WPanel disabledButtonLayoutPanel = new WPanel(WPanel.Type.BOX);
    disabledButtonLayoutPanel.setLayout(new FlowLayout(FlowLayout.LEFT, 6, 0, FlowLayout.ContentAlignment.BASELINE));
    add(disabledButtonLayoutPanel);
    WButton button = new WButton("Disabled button");
    button.setDisabled(true);
    disabledButtonLayoutPanel.add(button);
    button = new WButton("Disabled button as link");
    button.setDisabled(true);
    button.setRenderAsLink(true);
    disabledButtonLayoutPanel.add(button);
    add(new WHeading(HeadingLevel.H3, "Examples of disabled buttons displaying only an image"));
    disabledButtonLayoutPanel = new WPanel(WPanel.Type.BOX);
    disabledButtonLayoutPanel.setLayout(new FlowLayout(FlowLayout.LEFT, 6, 0, FlowLayout.ContentAlignment.BASELINE));
    add(disabledButtonLayoutPanel);
    button = new WButton("Disabled button");
    button.setDisabled(true);
    button.setImage("/image/tick.png");
    button.setToolTip("Checking currently disabled");
    disabledButtonLayoutPanel.add(button);
    button = new WButton("Disabled button as link");
    button.setDisabled(true);
    button.setRenderAsLink(true);
    button.setImage("/image/tick.png");
    button.setToolTip("Checking currently disabled");
    disabledButtonLayoutPanel.add(button);
    add(new WHeading(HeadingLevel.H3, "Examples of disabled buttons displaying an image with imagePosition EAST"));
    disabledButtonLayoutPanel = new WPanel(WPanel.Type.BOX);
    disabledButtonLayoutPanel.setLayout(new FlowLayout(FlowLayout.LEFT, 6, 0, FlowLayout.ContentAlignment.BASELINE));
    add(disabledButtonLayoutPanel);
    button = new WButton("Disabled button");
    button.setDisabled(true);
    button.setImage("/image/tick.png");
    button.setToolTip("Checking currently disabled");
    button.setImagePosition(ImagePosition.EAST);
    disabledButtonLayoutPanel.add(button);
    button = new WButton("Disabled button as link");
    button.setDisabled(true);
    button.setRenderAsLink(true);
    button.setImage("/image/tick.png");
    button.setToolTip("Checking currently disabled");
    button.setImagePosition(ImagePosition.EAST);
    disabledButtonLayoutPanel.add(button);
}

Example 19 with WHeading

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

the class WButtonExample method addClientOnlyExamples.

/**
 * Examples showing use of client only buttons.
 */
private void addClientOnlyExamples() {
    // client command button
    add(new WHeading(HeadingLevel.H2, "Client command buttons"));
    add(new ExplanatoryText("These examples show buttons which do not submit the form"));
    // client command buttons witho a command
    WButton nothingButton = new WButton("Do nothing");
    add(nothingButton);
    nothingButton.setClientCommandOnly(true);
    nothingButton = new WButton("Do nothing link");
    add(nothingButton);
    nothingButton.setRenderAsLink(true);
    nothingButton.setClientCommandOnly(true);
    // client command buttons with command.
    HelloButton helloButton = new HelloButton("Hello");
    add(helloButton);
    helloButton = new HelloButton("Hello link");
    helloButton.setRenderAsLink(true);
    add(helloButton);
}

Example 20 with WHeading

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

the class WButtonExample method addAntiPatternExamples.

/**
 * Examples of what not to do when using WButton.
 */
private void addAntiPatternExamples() {
    add(new WHeading(HeadingLevel.H2, "WButton anti-pattern examples"));
    add(new WMessageBox(WMessageBox.WARN, "These examples are purposely bad and should not be used as samples of how to use WComponents but samples of how NOT to use them."));
    add(new WHeading(HeadingLevel.H3, "WButton without a good label"));
    add(new WButton("\u2002"));
    add(new ExplanatoryText("A button without a text label is very bad"));
    add(new WHeading(HeadingLevel.H3, "WButton with a WImage but without a good label"));
    WButton button = new WButton("");
    button.setImage("/image/help.png");
    add(button);
    add(new ExplanatoryText("A button without a text label is very bad, even if you think the image is sufficient. The text label becomes the image alt text."));
}