aboutsummaryrefslogtreecommitdiffstats
path: root/documentation/components/components-optiongroup.asciidoc
diff options
context:
space:
mode:
authorDenis Anisimov <denis@vaadin.com>2016-09-30 16:56:44 +0300
committerVaadin Code Review <review@vaadin.com>2016-10-05 09:10:52 +0000
commit4c2adcefb2dee1b296eef31a8d4944b1b89226e5 (patch)
treeceae53737cad719126b3522b6402041f133c39d0 /documentation/components/components-optiongroup.asciidoc
parent2ae14ad9affca86448ac1003280b7852354d8a6b (diff)
downloadvaadin-framework-4c2adcefb2dee1b296eef31a8d4944b1b89226e5.tar.gz
vaadin-framework-4c2adcefb2dee1b296eef31a8d4944b1b89226e5.zip
Update documentation (+javadoc) references to obsolete OptionGroup #237.
Change-Id: Ie90e91f61a5795c90de3c690c3b6af80ec1448d9
Diffstat (limited to 'documentation/components/components-optiongroup.asciidoc')
-rw-r--r--documentation/components/components-optiongroup.asciidoc140
1 files changed, 0 insertions, 140 deletions
diff --git a/documentation/components/components-optiongroup.asciidoc b/documentation/components/components-optiongroup.asciidoc
deleted file mode 100644
index f25e3dfe13..0000000000
--- a/documentation/components/components-optiongroup.asciidoc
+++ /dev/null
@@ -1,140 +0,0 @@
----
-title: OptionGroup
-order: 19
-layout: page
----
-
-[[components.optiongroup]]
-= [classname]#OptionGroup#
-
-ifdef::web[]
-[.sampler]
-image:{live-demo-image}[alt="Live Demo", link="http://demo.vaadin.com/sampler/#ui/data-input/multiple-value/option-group"]
-endif::web[]
-
-[classname]#OptionGroup# is a selection component that allows selection from a
-group of radio buttons in single selection mode. In multiple selection mode, the
-items show up as check boxes. The common selection component features are
-described in
-<<dummy/../../../framework/components/components-selection#components.selection,"Selection Components">>.
-
-[[figure.components.optiongroup]]
-.Option Button Group in Single and Multiple Selection Mode
-image::img/optiongroup-basic.png[width=45%, scaledwidth=70%]
-
-Option group is by default in single selection mode. Multiple selection is
-enabled with [methodname]#setMultiSelect()#.
-
-
-[source, java]
-----
-// A single-select radio button group
-OptionGroup<String> single =
- new OptionGroup<>("Single Selection");
-single.setItems("Single", "Sola", "Yksi");
-
-// A multi-select check box group
-OptionGroup<String> multi =
- new OptionGroup<>("Multiple Selection");
-multi.setMultiSelect(true);
-multi.setItems("Many", "Muchos", "Monta");
-----
-
-<<figure.components.optiongroup>> shows the [classname]#OptionGroup# in both
-single and multiple selection mode.
-
-You can also create check boxes individually using the [classname]#CheckBox#
-class, as described in
-<<dummy/../../../framework/components/components-checkbox#components.checkbox,"CheckBox">>.
-The advantages of the [classname]#OptionGroup# component are that as it
-maintains the individual check box objects, you can get an array of the
-currently selected items easily, and that you can easily change the appearance
-of a single component.
-
-ifdef::web[]
-[[components.optiongroup.disabling]]
-== Disabling Items
-
-You can disable individual items in an [classname]#OptionGroup# with
-[methodname]#setItemEnabled()#. The user can not select or deselect disabled
-items in multi-select mode, but in single-select mode the use can change the
-selection from a disabled to an enabled item. The selections can be changed
-programmatically regardless of whether an item is enabled or disabled. You can
-find out whether an item is enabled with [methodname]#isItemEnabled()#.
-
-[source, java]
-----
-// Have an option group with some items
-OptionGroup<String> group = new OptionGroup<>("My Disabled Group");
-group.setItems("One", "Two", "Three");
-
-// Disable one item
-group.setItemEnabled("Two", false);
-----
-
-[[figure.components.optiongroup.disabling]]
-.[classname]#OptionGroup# with a Disabled Item
-image::img/optiongroup-disabling.png[width=25%, scaledwidth=50%]
-
-Setting an item as disabled turns on the [literal]#++v-disabled++# style for it.
-endif::web[]
-
-[[components.optiongroup.css]]
-== CSS Style Rules
-
-
-[source, css]
-----
-.v-select-optiongroup {}
- .v-select-option.v-checkbox {}
- .v-select-option.v-radiobutton {}
-----
-
-The [literal]#++v-select-optiongroup++# is the overall style for the component.
-Each check box will have the [literal]#++v-checkbox++# style, borrowed from the
-[classname]#CheckBox# component, and each radio button the
-[literal]#++v-radiobutton++# style. Both the radio buttons and check boxes will
-also have the [literal]#++v-select-option++# style that allows styling
-regardless of the option type. Disabled items have additionally the
-[literal]#++v-disabled++# style.
-
-ifdef::web[]
-
-[[components.optiongroup.css.horizontal]]
-=== Horizontal Layout
-
-The options are normally laid out vertically. You can use horizontal layout by
-setting [literal]#++display: inline-block++# for the options. The
-[literal]#++nowrap++# setting for the overall element prevents wrapping if there
-is not enough horizontal space in the layout, or if the horizontal width is
-undefined.
-
-
-[source, css]
-----
-/* Lay the options horizontally */
-.v-select-optiongroup-horizontal .v-select-option {
- display: inline-block;
-}
-
-/* Avoid wrapping if the layout is too tight */
-.v-select-optiongroup-horizontal {
- white-space: nowrap;
-}
-
-/* Some extra spacing is needed */
-.v-select-optiongroup-horizontal
- .v-select-option.v-radiobutton {
- padding-right: 10px;
-}
-----
-
-Use of the above rules requires setting a custom [literal]#++horizontal++# style
-name for the component. The result is shown in
-<<figure.components.optiongroup.horizontal>>.
-
-[[figure.components.optiongroup.horizontal]]
-.Horizontal [classname]#OptionGroup#
-image::img/optiongroup-horizontal.png[width=35%, scaledwidth=50%]
-
-endif::web[]