summaryrefslogtreecommitdiffstats
path: root/documentation/components/components-customcomponent.asciidoc
diff options
context:
space:
mode:
authorIlia Motornyi <elmot@vaadin.com>2015-12-03 14:59:05 +0000
committerVaadin Code Review <review@vaadin.com>2015-12-03 14:59:12 +0000
commit2af72ba9636bec70046394c41744f89ce4572e35 (patch)
treeccb3dc2d2239585f8c3f79eb5f131ff61ca9ce86 /documentation/components/components-customcomponent.asciidoc
parent8aa5fabe89f2967e966a64842a608eceaf80d08f (diff)
downloadvaadin-framework-2af72ba9636bec70046394c41744f89ce4572e35.tar.gz
vaadin-framework-2af72ba9636bec70046394c41744f89ce4572e35.zip
Revert "Merge branch 'documentation'"7.6.0.beta2
This reverts commit f6874bde3d945c8b2d1b5c17ab50e2d0f1f8ff00. Change-Id: I67ee1c30ba3e3bcc3c43a1dd2e73a822791514bf
Diffstat (limited to 'documentation/components/components-customcomponent.asciidoc')
-rw-r--r--documentation/components/components-customcomponent.asciidoc87
1 files changed, 0 insertions, 87 deletions
diff --git a/documentation/components/components-customcomponent.asciidoc b/documentation/components/components-customcomponent.asciidoc
deleted file mode 100644
index cce897daa9..0000000000
--- a/documentation/components/components-customcomponent.asciidoc
+++ /dev/null
@@ -1,87 +0,0 @@
----
-title: Composition with CustomComponent
-order: 31
-layout: page
----
-
-[[components.customcomponent]]
-= Composition with [classname]#CustomComponent#
-
-The ease of making new user interface components is one of the core features of
-Vaadin. Typically, you simply combine existing built-in components to produce
-composite components. In many applications, such composite components make up
-the majority of the user interface.
-
-As described earlier in
-<<dummy/../../../framework/application/application-architecture#application.architecture.composition,"Compositing
-Components">>, you have two basic ways to create a composite - either by
-extending a layout component or the [classname]#CustomComponent#, which
-typically wraps around a layout component. The benefit of wrapping a layout
-composite in [classname]#CustomComponent# is mainly encapsulation - hiding the
-implementation details of the composition. Otherwise, a user of the composite
-could rely on implementation details, which would create an unwanted dependency.
-
-To create a composite, you need to inherit the [classname]#CustomComponent# and
-set the __composition root__ component in the constructor. The composition root
-is typically a layout component that contains other components.
-
-For example:
-
-
-[source, java]
-----
-class MyComposite extends CustomComponent {
- public MyComposite(String message) {
- // A layout structure used for composition
- Panel panel = new Panel("My Custom Component");
- VerticalLayout panelContent = new VerticalLayout();
- panelContent.setMargin(true); // Very useful
- panel.setContent(panelContent);
-
- // Compose from multiple components
- Label label = new Label(message);
- label.setSizeUndefined(); // Shrink
- panelContent.addComponent(label);
- panelContent.addComponent(new Button("Ok"));
-
- // Set the size as undefined at all levels
- panelContent.setSizeUndefined();
- panel.setSizeUndefined();
- setSizeUndefined();
-
- // The composition root MUST be set
- setCompositionRoot(panel);
- }
-}
-----
-
-Take note of the sizing when trying to make a customcomponent that shrinks to
-fit the contained components. You have to set the size as undefined at all
-levels; the sizing of the composite component and the composition root are
-separate.
-
-You can use the component as follows:
-
-
-[source, java]
-----
-MyComposite mycomposite = new MyComposite("Hello");
-----
-
-The rendered component is shown in <<figure.components.customcomponent>>.
-
-[[figure.components.customcomponent]]
-.A Custom Composite Component
-image::img/customcomponent-example1.png[]
-
-You can also inherit any other components, such as layouts, to attain similar
-composition. ((("Google Web
-Toolkit")))
-Even further, you can create entirely new low-level components, by integrating
-pure client-side components or by extending the client-side functionality of
-built-in components. Development of new components is covered in
-<<dummy/../../../framework/gwt/gwt-overview.asciidoc#gwt.overview,"Integrating
-with the Server-Side">>.
-
-
-