You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@pivot.apache.org by tv...@apache.org on 2011/02/07 03:36:18 UTC
svn commit: r1067847 [13/27] - in /pivot/site/trunk/deploy: ./ assets/
demos/ images/ lib/ styles/ tutorials/ tutorials/component_and_container/
tutorials/platform_overview/ tutorials/windows/
Added: pivot/site/trunk/deploy/tutorials/data-binding.html
URL: http://svn.apache.org/viewvc/pivot/site/trunk/deploy/tutorials/data-binding.html?rev=1067847&view=auto
==============================================================================
--- pivot/site/trunk/deploy/tutorials/data-binding.html (added)
+++ pivot/site/trunk/deploy/tutorials/data-binding.html Mon Feb 7 02:36:04 2011
@@ -0,0 +1,426 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<!--
+Licensed to the Apache Software Foundation (ASF) under one or more
+contributor license agreements. See the NOTICE file distributed with
+this work for additional information regarding copyright ownership.
+The ASF licenses this file to you under the Apache License,
+Version 2.0 (the "License"); you may not use this file except in
+compliance with the License. You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+--><html xmlns="http://www.w3.org/1999/xhtml"><head><meta content="text/html; charset=UTF-8" http-equiv="Content-Type" /><title>Data Binding | Apache Pivot</title><link xmlns="" type="text/css" rel="stylesheet" href="/styles/pivot.css"><script xmlns="http://www.w3.org/1999/xhtml" type="text/javascript">
+ var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
+ document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
+ </script><script type="text/javascript">
+ try {
+ var pageTracker = _gat._getTracker("UA-7977275-3");
+ pageTracker._trackPageview();
+ } catch(err) {}</script></head><body><div xmlns="" id="wrapper"><div id="main"><div id="header"><div class="logo"><a href="/index.html"><img title="Apache Pivot Homepage" alt="Apache Pivot" src="/images/logo.png"></a></div><div class="tagline"><img style="visibility:hidden" alt="Rich Internet Applications in Java" src="/images/tagline.png"></div><ul class="navi"><li><a href="/demos/">Demos</a></li><li><a href="/download.cgi#2.0">Download</a></li><li><a href="/tutorials/">Tutorial</a></li><li><a href="/get-involved.html">Get Involved</a></li><li><a href="/about.html">About</a></li></ul></div><div class="group" id="contentBase"><h1>Data Binding</h1><ul class="naviLeft"><li><a href="/tutorials/sample-application.html">Sample Application</a></li><li><a href="/tutorials/platform-overview.html">Platform Overview</a></li><li><a href="/tutorials/hello-world.html">Hello, World!</a></li><li><a href="/tutorials/hello-bxml.html">Hello, BXML!</a></li><li><a href="/tutoria
ls/component-and-container.html">Component & Container</a></li><li><a href="/tutorials/labels-and-image-views.html">Labels & Image Views</a></li><li><a href="/tutorials/svg-images.html">SVG Images</a></li><li><a href="/tutorials/buttons.html">Buttons</a></li><li><a href="/tutorials/push-buttons.html">Push Buttons</a></li><li><a href="/tutorials/toggle-buttons.html">Toggle Buttons</a></li><li><a href="/tutorials/radio-buttons.html">Radio Buttons</a></li><li><a href="/tutorials/checkboxes.html">Checkboxes</a></li><li><a href="/tutorials/link-buttons.html">Link Buttons</a></li><li><a href="/tutorials/lists.html">Lists</a></li><li><a href="/tutorials/list-buttons.html">List Buttons</a></li><li><a href="/tutorials/repeatable-list-buttons.html">Repeatable List Buttons</a></li><li><a href="/tutorials/text.html">Text</a></li><li><a href="/tutorials/suggestion-popups.html">Suggestion Popups</a></li><li><a href="/tutorials/text-areas.html">Text Areas</a></li><li><a href="/tuto
rials/separators.html">Separators</a></li><li><a href="/tutorials/layout-containers.html">Layout Containers</a></li><li><a href="/tutorials/flow-panes.html">Flow Panes</a></li><li><a href="/tutorials/box-panes.html">Box Panes</a></li><li><a href="/tutorials/grid-panes.html">Grid Panes</a></li><li><a href="/tutorials/table-panes.html">Table Panes</a></li><li><a href="/tutorials/borders.html">Borders</a></li><li><a href="/tutorials/stack-panes.html">Stack Panes</a></li><li><a href="/tutorials/split-panes.html">Split Panes</a></li><li><a href="/tutorials/forms.html">Forms</a></li><li><a href="/tutorials/panels.html">Panels</a></li><li><a href="/tutorials/navigation-containers.html">Navigation Containers</a></li><li><a href="/tutorials/card-panes.html">Card Panes</a></li><li><a href="/tutorials/tab-panes.html">Tab Panes</a></li><li><a href="/tutorials/accordions.html">Accordions</a></li><li><a href="/tutorials/expanders.html">Expanders</a></li><li><a href="/tutorials/rollups.htm
l">Rollups</a></li><li><a href="/tutorials/viewports.html">Viewports</a></li><li><a href="/tutorials/scroll-panes.html">Scroll Panes</a></li><li><a href="/tutorials/panoramas.html">Panoramas</a></li><li><a href="/tutorials/progress-indicators.html">Progress Indicators</a></li><li><a href="/tutorials/meters.html">Meters</a></li><li><a href="/tutorials/activity-indicators.html">Activity Indicators</a></li><li><a href="/tutorials/bounded-range-components.html">Bounded Range Components</a></li><li><a href="/tutorials/sliders.html">Sliders</a></li><li><a href="/tutorials/scroll-bars.html">Scroll Bars</a></li><li><a href="/tutorials/spinners.html">Spinners</a></li><li><a href="/tutorials/calendars.html">Calendars</a></li><li><a href="/tutorials/menus.html">Menus</a></li><li><a href="/tutorials/context-menus.html">Context Menus</a></li><li><a href="/tutorials/menu-bars.html">Menu Bars</a></li><li><a href="/tutorials/menu-buttons.html">Menu Buttons</a></li><li><a href="/tutorials/co
lor-choosers.html">Color Choosers</a></li><li><a href="/tutorials/table-views.html">Table Views</a></li><li><a href="/tutorials/table-views.json.html">JSON-based TableView</a></li><li><a href="/tutorials/table-views.custom.html">Custom TableView</a></li><li><a href="/tutorials/tree-views.html">Tree Views</a></li><li><a href="/tutorials/file-browsing.html">File Browsing</a></li><li><a href="/tutorials/windows.html">Windows</a></li><li><a href="/tutorials/clipboard.html">Clipboard</a></li><li><a href="/tutorials/drag-and-drop.html">Drag and Drop</a></li><li><a href="/tutorials/effects.html">Effects</a></li><li><a href="/tutorials/effects.transitions.html">Transitions</a></li><li><a href="/tutorials/data-binding.html">Data Binding</a></li><li><a href="/tutorials/property-binding.html">Property Binding</a></li><li><a href="/tutorials/localization.html">Localization</a></li><li><a href="/tutorials/background-tasks.html">Background Tasks</a></li><li><a href="/tutorials/web-queries
.html">Web Queries</a></li><li><a href="/tutorials/query-servlet.html">QueryServlet</a></li><li><a href="/tutorials/scripting.html">Scripting</a></li><li><a href="/tutorials/summary.html">Summary</a></li><li><a href="/tutorials/stock-tracker.html">The "Stock Tracker" Application</a></li><li><a href="/tutorials/stock-tracker.ui.html">UI Markup Using BXML</a></li><li><a href="/tutorials/stock-tracker.events.html">Event Handling</a></li><li><a href="/tutorials/stock-tracker.web-queries.html">Web Queries</a></li><li><a href="/tutorials/stock-tracker.data-binding.html">Data Binding</a></li><li><a href="/tutorials/stock-tracker.localization.html">Localization</a></li><li><a href="/tutorials/bxml-primer.html">BXML Primer</a></li></ul><div class="content"><style type="text/css">
+ applet {
+ border: 1px solid #999999;
+ }
+ </style><!--NOTE: Syntax highlighting script is LGPL--><script src="http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js" type="text/javascript"></script><script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJava.js" type="text/javascript"></script><script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushXml.js" type="text/javascript"></script><script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJScript.js" type="text/javascript"></script><link href="http://alexgorbatchev.com/pub/sh/current/styles/shCore.css" rel="stylesheet" type="text/css"><link href="http://alexgorbatchev.com/pub/sh/current/styles/shThemeDefault.css" rel="stylesheet" type="text/css"><script type="text/javascript">
+ SyntaxHighlighter.all();
+ </script><div class="section">
+ <p>
+ Data binding refers to the process of automatically populating or extracting data from
+ a set of user interface elements. In Pivot, data binding is driven primarily by two
+ methods of the <tt>Component</tt> class: <tt>load()</tt> and <tt>store()</tt>. Each
+ method takes an <tt>Object</tt> argument called the "context". The context is either an
+ instance of a Java bean class or an instance of
+ <tt>org.apache.pivot.collections.Dictionary</tt>. Calling <tt>load()</tt> causes data
+ from the context to be "loaded" into the component; calling <tt>store()</tt> performs
+ the reverse operation and "stores" data from the component into the context. A third
+ method, <tt>clear()</tt> allows a caller to reset any bindings.
+ </p>
+
+ <p>
+ Components that support data binding provide "key" properties that allow a caller to
+ associate a property value with a value in the bind context. For example, the
+ <tt>Label</tt> class provides a "textKey" property that maps the label's "text" property
+ to a value provided by the context.
+ </p>
+
+ <p>
+ The following application demonstrates data binding. It allows the user to load a form
+ with address data either from a JSON file or from a Java bean object, as well as clear
+ the form. Note that binding to a Java bean is accomplished by wrapping the bean in an
+ instance of <tt>org.apache.pivot.beans.BeanAdapter</tt> before passing it to the
+ <tt>load()</tt> method:
+ </p>
+
+ <script src="http://java.com/js/deployJava.js" type="text/javascript"></script><script type="text/javascript">
+
+ var attributes = {
+ code:"org.apache.pivot.wtk.BrowserApplicationContext$HostApplet",
+ width:"430",
+ height:"280"
+ };
+
+
+
+
+
+ var libraries = [];
+ libraries.push("/lib/pivot-core-2.0.jar");
+ libraries.push("/lib/pivot-wtk-2.0.jar");
+ libraries.push("/lib/pivot-wtk-terra-2.0.jar");
+ libraries.push("/lib/pivot-tutorials-2.0.jar");
+
+ libraries.push("/lib/svgSalamander-tiny.jar");
+
+
+ attributes.archive = libraries.join(",");
+
+
+ var parameters = {
+ codebase_lookup:false,
+ application_class_name:'org.apache.pivot.wtk.ScriptApplication'
+ };
+
+
+ var javaArguments = ["-Dsun.awt.noerasebackground=true",
+ "-Dsun.awt.erasebackgroundonresize=true"];
+
+
+
+ parameters.java_arguments = javaArguments.join(" ");
+
+
+
+ var startupProperties = [];
+
+ startupProperties.push("src=/org/apache/pivot/tutorials/databinding/data_binding.bxml");
+
+ parameters.startup_properties = startupProperties.join("&");
+
+
+ deployJava.runApplet(attributes, parameters, "1.6");
+ </script>
+
+ <p>
+ The BXML simply sets up the form structure and the bind keys:
+ </p>
+
+ <pre class="brush:xml">
+
+ <databinding:DataBinding title="Data Binding" maximized="true"
+ xmlns:bxml="http://pivot.apache.org/bxml"
+ xmlns:databinding="org.apache.pivot.tutorials.databinding"
+ xmlns="org.apache.pivot.wtk">
+ <Border styles="{padding:6}">
+ <BoxPane orientation="vertical" styles="{spacing:10, fill:true}">
+ <Form bxml:id="form" styles="{showFlagIcons:false}">
+ <Form.Section>
+ <Label bxml:id="sourceLabel" Form.label="Source" styles="{font:{italic:true}}"/>
+
+ <Label Form.label="ID" textKey="id"/>
+ <TextInput Form.label="Name" textKey="name"/>
+
+ <BoxPane Form.label="Address" orientation="vertical">
+ <TextInput textKey="address.street" prompt="Street"/>
+ <BoxPane>
+ <TextInput textKey="address.city" prompt="City"/>
+ <TextInput textKey="address.state" textSize="6" prompt="State"/>
+ <TextInput textKey="address.zip" textSize="6" prompt="Zip"/>
+ </BoxPane>
+ </BoxPane>
+
+ <TextInput Form.label="Phone" textKey="phoneNumber"/>
+ <TextInput Form.label="Email" textKey="emailAddress"/>
+
+ <BoxPane Form.label="IM">
+ <TextInput textKey="imAccount.id"/>
+ <ListButton selectedItemKey="imAccount.type"
+ listData="['AIM', 'Jabber', 'Yahoo']"/>
+ </BoxPane>
+ </Form.Section>
+ </Form>
+
+ <Separator/>
+
+ <BoxPane styles="{horizontalAlignment:'right'}">
+ <PushButton bxml:id="loadJSONButton" buttonData="Load JSON"/>
+ <PushButton bxml:id="loadJavaButton" buttonData="Load Java"/>
+ <PushButton bxml:id="clearButton" buttonData="Clear"/>
+ </BoxPane>
+ </BoxPane>
+ </Border>
+ </databinding:DataBinding>
+
+ </pre>
+
+ <p>
+ The windows's <tt>initialize()</tt> method defines the button press listeners that
+ load or clear the form:
+ </p>
+
+ <pre class="brush:java">
+
+ package org.apache.pivot.tutorials.databinding;
+
+ import java.io.InputStream;
+ import java.net.URL;
+
+ import org.apache.pivot.beans.BeanAdapter;
+ import org.apache.pivot.beans.Bindable;
+ import org.apache.pivot.collections.Map;
+ import org.apache.pivot.json.JSONSerializer;
+ import org.apache.pivot.util.Resources;
+ import org.apache.pivot.wtk.Button;
+ import org.apache.pivot.wtk.ButtonPressListener;
+ import org.apache.pivot.wtk.Form;
+ import org.apache.pivot.wtk.Label;
+ import org.apache.pivot.wtk.PushButton;
+ import org.apache.pivot.wtk.Window;
+
+ public class DataBinding extends Window implements Bindable {
+ private Form form = null;
+ private PushButton loadJavaButton = null;
+ private PushButton loadJSONButton = null;
+ private PushButton clearButton = null;
+ private Label sourceLabel = null;
+
+ private static final Contact CONTACT = new Contact("101", "Joe User",
+ new Address("123 Main St.", "Cambridge", "MA", "02142"),
+ "(617) 555-1234", "joe_user@foo.com",
+ new IMAccount("juser1234", "AIM"));
+
+ @Override
+ public void initialize(Map<String, Object> namespace, URL location, Resources resources) {
+ form = (Form)namespace.get("form");
+ loadJavaButton = (PushButton)namespace.get("loadJavaButton");
+ loadJSONButton = (PushButton)namespace.get("loadJSONButton");
+ clearButton = (PushButton)namespace.get("clearButton");
+ sourceLabel = (Label)namespace.get("sourceLabel");
+
+ loadJavaButton.getButtonPressListeners().add(new ButtonPressListener() {
+ @Override
+ public void buttonPressed(Button button) {
+ form.load(new BeanAdapter(CONTACT));
+ sourceLabel.setText("Java");
+ }
+ });
+
+ loadJSONButton.getButtonPressListeners().add(new ButtonPressListener() {
+ @Override
+ public void buttonPressed(Button button) {
+ JSONSerializer serializer = new JSONSerializer();
+ InputStream inputStream = getClass().getResourceAsStream("contact.json");
+
+ try {
+ form.load(serializer.readObject(inputStream));
+ sourceLabel.setText("JSON");
+ } catch(Exception exception) {
+ System.err.println(exception);
+ }
+
+ button.setEnabled(true);
+ }
+ });
+
+ clearButton.getButtonPressListeners().add(new ButtonPressListener() {
+ @Override
+ public void buttonPressed(Button button) {
+ form.clear();
+ sourceLabel.setText(null);
+ }
+ });
+ }
+ }
+
+ </pre>
+
+ <p>
+ The JSON representation of the sample contact record is defined as follows (note that,
+ while JSON is used to represent the data in this example, any class that implements
+ the <tt>Dictionary</tt> interface, including <tt>HashMap</tt>, can be used):
+ </p>
+
+ <pre class="brush:jscript">
+
+ { id: 101,
+ name: "Joe User",
+
+ address: {
+ street: "123 Main St.",
+ city: "Cambridge",
+ state: "MA",
+ zip: "02142"
+ },
+
+ phoneNumber: "(617) 555-1234",
+ emailAddress: "joe_user@foo.com",
+
+ imAccount: {
+ id: "juser1234",
+ type: "AIM"
+ }
+ }
+
+ </pre>
+
+ <p>
+ The Java bean version, which represents the same data, is composed of the following
+ classes:
+ </p>
+
+ <pre class="brush:java">
+
+ package org.apache.pivot.tutorials.databinding;
+
+ public class Contact {
+ private String id;
+ private String name;
+ private Address address;
+ private String phoneNumber;
+ private String emailAddress;
+ private IMAccount imAccount;
+
+ public Contact(String id, String name, Address address, String phoneNumber,
+ String emailAddress, IMAccount imAccount) {
+ this.id = id;
+ this.name = name;
+ this.address = address;
+ this.phoneNumber = phoneNumber;
+ this.emailAddress = emailAddress;
+ this.imAccount = imAccount;
+ }
+
+ public String getID() {
+ return id;
+ }
+
+ public String getId() {
+ return getID();
+ }
+
+ public String getName() {
+ return name;
+ }
+
+ public Address getAddress() {
+ return address;
+ }
+
+ public String getPhoneNumber() {
+ return phoneNumber;
+ }
+
+ public String getEmailAddress() {
+ return emailAddress;
+ }
+
+ public IMAccount getIMAccount() {
+ return imAccount;
+ }
+
+ public IMAccount getImAccount() {
+ return getIMAccount();
+ }
+ }
+
+ </pre>
+
+ <pre class="brush:java">
+
+ package org.apache.pivot.tutorials.databinding;
+
+ public class Address {
+ private String street;
+ private String city;
+ private String state;
+ private String zip;
+
+ public Address() {
+ this(null, null, null, null);
+ }
+
+ public Address(String street, String city, String state, String zip) {
+ this.street = street;
+ this.city = city;
+ this.state = state;
+ this.zip = zip;
+ }
+
+ public String getStreet() {
+ return street;
+ }
+
+ public String getCity() {
+ return city;
+ }
+
+ public String getState() {
+ return state;
+ }
+
+ public String getZip() {
+ return zip;
+ }
+ }
+
+ </pre>
+
+ <pre class="brush:java">
+
+ public class IMAccount {
+ private String id;
+ private String type;
+
+ public IMAccount() {
+ this(null, null);
+ }
+
+ public IMAccount(String id, String type) {
+ this.id = id;
+ this.type = type;
+ }
+
+ public String getID() {
+ return id;
+ }
+
+ public String getId() {
+ return getID();
+ }
+
+ public String getType() {
+ return type;
+ }
+ }
+
+ </pre>
+
+ <p>
+ This application's data binding requirements are fairly straightforward. It is
+ load-only, and all of the data is simply presented as-is. However, many real-world
+ applications may want to transform the data in some way before presenting it to the
+ user; for example, an application may want to apply currency formatting to a numeric
+ value, or convert an encoded date string to an instance of
+ <tt>org.apache.pivot.util.CalendarDate</tt>. Components that support data binding
+ provide a "bind mapping" interface to facilitate such transformations. Bind mappings
+ are outside the scope of this example but are demonstrated in the
+ <a href="query-servlet.html">QueryServlet</a> section as well as the
+ <a href="stock-tracker.html">Stock Tracker</a> tutorial.
+ </p>
+
+ <p>
+ Also, though it is not shown in this example, bindable components allow a caller to
+ control the bind direction via a "bind type" property. The bind type is specified by
+ an instance of the <tt>org.apache.pivot.wtk.BindType</tt> enum, which defines the
+ following values:
+ </p>
+
+ <ul>
+ <li><tt>LOAD</tt> - binding will only occur during a <tt>load()</tt> operation</li>
+ <li><tt>STORE</tt> - binding will only occur during a <tt>store()</tt> operation</li>
+ <li><tt>BOTH</tt> - binding occur during both <tt>load()</tt> and <tt>store()</tt> operations</li>
+ </ul>
+ </div><p>Next: <a href="property-binding.html">Property Binding</a></p></div></div></div><div class="group" id="footer"><div class="footerLogo">Copyright (c) 1999-2011<br>The Apache Software Foundation.</div><div class="footerLinks"><ul class="footerMenuGr"><li><strong>Demos</strong><ul><li><a href="/demos/kitchen-sink.html" target="_new">"Kitchen Sink"</a></li><li><a href="/demos/component-explorer.html" target="_new">Component Explorer</a></li><li><a href="http://ixnay.biz/pivot-jfree-demos/charts_demo.html" target="_new">Charting</a></li><li><a href="/demos/">More Demos</a></li></ul></li><li><strong>Documentation</strong><ul><li><a href="/getting-started.html">Getting Started</a></li><li><a href="/tutorials/">Tutorial</a></li><li><a href="/faq.html">FAQ</a></li><li><a href="/2.0/docs/api/">Javadoc (2.0)</a></li></ul></li><li><strong>Get Involved</strong><ul><li><a href="/svn.html">SVN Repositories</a></li><li><a href="/lists.html">Mailing Lists</a></li><li><a href="ht
tp://issues.apache.org/jira/browse/PIVOT">Bug Database</a></li><li><a href="http://cwiki.apache.org/PIVOT/">Wiki</a></li></ul></li><li><strong>Related</strong><ul><li><a href="http://code.google.com/p/pivot-jfree/">JFreeChart Provider</a></li></ul></li><li><strong>About</strong><ul><li><a href="/who-we-are.html">Who We Are</a></li><li><a href="/contact.html">Contact</a></li><li><a href="/news.html">News</a></li><li><a href="/legal.html">Legal/License</a></li></ul></li></ul></div></div></div></body></html>
\ No newline at end of file
Added: pivot/site/trunk/deploy/tutorials/drag-and-drop.html
URL: http://svn.apache.org/viewvc/pivot/site/trunk/deploy/tutorials/drag-and-drop.html?rev=1067847&view=auto
==============================================================================
--- pivot/site/trunk/deploy/tutorials/drag-and-drop.html (added)
+++ pivot/site/trunk/deploy/tutorials/drag-and-drop.html Mon Feb 7 02:36:04 2011
@@ -0,0 +1,231 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<!--
+Licensed to the Apache Software Foundation (ASF) under one or more
+contributor license agreements. See the NOTICE file distributed with
+this work for additional information regarding copyright ownership.
+The ASF licenses this file to you under the Apache License,
+Version 2.0 (the "License"); you may not use this file except in
+compliance with the License. You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+--><html xmlns="http://www.w3.org/1999/xhtml"><head><meta content="text/html; charset=UTF-8" http-equiv="Content-Type" /><title>Drag and Drop | Apache Pivot</title><link xmlns="" type="text/css" rel="stylesheet" href="/styles/pivot.css"><script xmlns="http://www.w3.org/1999/xhtml" type="text/javascript">
+ var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
+ document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
+ </script><script type="text/javascript">
+ try {
+ var pageTracker = _gat._getTracker("UA-7977275-3");
+ pageTracker._trackPageview();
+ } catch(err) {}</script></head><body><div xmlns="" id="wrapper"><div id="main"><div id="header"><div class="logo"><a href="/index.html"><img title="Apache Pivot Homepage" alt="Apache Pivot" src="/images/logo.png"></a></div><div class="tagline"><img style="visibility:hidden" alt="Rich Internet Applications in Java" src="/images/tagline.png"></div><ul class="navi"><li><a href="/demos/">Demos</a></li><li><a href="/download.cgi#2.0">Download</a></li><li><a href="/tutorials/">Tutorial</a></li><li><a href="/get-involved.html">Get Involved</a></li><li><a href="/about.html">About</a></li></ul></div><div class="group" id="contentBase"><h1>Drag and Drop</h1><ul class="naviLeft"><li><a href="/tutorials/sample-application.html">Sample Application</a></li><li><a href="/tutorials/platform-overview.html">Platform Overview</a></li><li><a href="/tutorials/hello-world.html">Hello, World!</a></li><li><a href="/tutorials/hello-bxml.html">Hello, BXML!</a></li><li><a href="/tutori
als/component-and-container.html">Component & Container</a></li><li><a href="/tutorials/labels-and-image-views.html">Labels & Image Views</a></li><li><a href="/tutorials/svg-images.html">SVG Images</a></li><li><a href="/tutorials/buttons.html">Buttons</a></li><li><a href="/tutorials/push-buttons.html">Push Buttons</a></li><li><a href="/tutorials/toggle-buttons.html">Toggle Buttons</a></li><li><a href="/tutorials/radio-buttons.html">Radio Buttons</a></li><li><a href="/tutorials/checkboxes.html">Checkboxes</a></li><li><a href="/tutorials/link-buttons.html">Link Buttons</a></li><li><a href="/tutorials/lists.html">Lists</a></li><li><a href="/tutorials/list-buttons.html">List Buttons</a></li><li><a href="/tutorials/repeatable-list-buttons.html">Repeatable List Buttons</a></li><li><a href="/tutorials/text.html">Text</a></li><li><a href="/tutorials/suggestion-popups.html">Suggestion Popups</a></li><li><a href="/tutorials/text-areas.html">Text Areas</a></li><li><a href="/tut
orials/separators.html">Separators</a></li><li><a href="/tutorials/layout-containers.html">Layout Containers</a></li><li><a href="/tutorials/flow-panes.html">Flow Panes</a></li><li><a href="/tutorials/box-panes.html">Box Panes</a></li><li><a href="/tutorials/grid-panes.html">Grid Panes</a></li><li><a href="/tutorials/table-panes.html">Table Panes</a></li><li><a href="/tutorials/borders.html">Borders</a></li><li><a href="/tutorials/stack-panes.html">Stack Panes</a></li><li><a href="/tutorials/split-panes.html">Split Panes</a></li><li><a href="/tutorials/forms.html">Forms</a></li><li><a href="/tutorials/panels.html">Panels</a></li><li><a href="/tutorials/navigation-containers.html">Navigation Containers</a></li><li><a href="/tutorials/card-panes.html">Card Panes</a></li><li><a href="/tutorials/tab-panes.html">Tab Panes</a></li><li><a href="/tutorials/accordions.html">Accordions</a></li><li><a href="/tutorials/expanders.html">Expanders</a></li><li><a href="/tutorials/rollups.ht
ml">Rollups</a></li><li><a href="/tutorials/viewports.html">Viewports</a></li><li><a href="/tutorials/scroll-panes.html">Scroll Panes</a></li><li><a href="/tutorials/panoramas.html">Panoramas</a></li><li><a href="/tutorials/progress-indicators.html">Progress Indicators</a></li><li><a href="/tutorials/meters.html">Meters</a></li><li><a href="/tutorials/activity-indicators.html">Activity Indicators</a></li><li><a href="/tutorials/bounded-range-components.html">Bounded Range Components</a></li><li><a href="/tutorials/sliders.html">Sliders</a></li><li><a href="/tutorials/scroll-bars.html">Scroll Bars</a></li><li><a href="/tutorials/spinners.html">Spinners</a></li><li><a href="/tutorials/calendars.html">Calendars</a></li><li><a href="/tutorials/menus.html">Menus</a></li><li><a href="/tutorials/context-menus.html">Context Menus</a></li><li><a href="/tutorials/menu-bars.html">Menu Bars</a></li><li><a href="/tutorials/menu-buttons.html">Menu Buttons</a></li><li><a href="/tutorials/c
olor-choosers.html">Color Choosers</a></li><li><a href="/tutorials/table-views.html">Table Views</a></li><li><a href="/tutorials/table-views.json.html">JSON-based TableView</a></li><li><a href="/tutorials/table-views.custom.html">Custom TableView</a></li><li><a href="/tutorials/tree-views.html">Tree Views</a></li><li><a href="/tutorials/file-browsing.html">File Browsing</a></li><li><a href="/tutorials/windows.html">Windows</a></li><li><a href="/tutorials/clipboard.html">Clipboard</a></li><li><a href="/tutorials/drag-and-drop.html">Drag and Drop</a></li><li><a href="/tutorials/effects.html">Effects</a></li><li><a href="/tutorials/effects.transitions.html">Transitions</a></li><li><a href="/tutorials/data-binding.html">Data Binding</a></li><li><a href="/tutorials/property-binding.html">Property Binding</a></li><li><a href="/tutorials/localization.html">Localization</a></li><li><a href="/tutorials/background-tasks.html">Background Tasks</a></li><li><a href="/tutorials/web-querie
s.html">Web Queries</a></li><li><a href="/tutorials/query-servlet.html">QueryServlet</a></li><li><a href="/tutorials/scripting.html">Scripting</a></li><li><a href="/tutorials/summary.html">Summary</a></li><li><a href="/tutorials/stock-tracker.html">The "Stock Tracker" Application</a></li><li><a href="/tutorials/stock-tracker.ui.html">UI Markup Using BXML</a></li><li><a href="/tutorials/stock-tracker.events.html">Event Handling</a></li><li><a href="/tutorials/stock-tracker.web-queries.html">Web Queries</a></li><li><a href="/tutorials/stock-tracker.data-binding.html">Data Binding</a></li><li><a href="/tutorials/stock-tracker.localization.html">Localization</a></li><li><a href="/tutorials/bxml-primer.html">BXML Primer</a></li></ul><div class="content"><style type="text/css">
+ applet {
+ border: 1px solid #999999;
+ }
+ </style><!--NOTE: Syntax highlighting script is LGPL--><script src="http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js" type="text/javascript"></script><script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJava.js" type="text/javascript"></script><script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushXml.js" type="text/javascript"></script><script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJScript.js" type="text/javascript"></script><link href="http://alexgorbatchev.com/pub/sh/current/styles/shCore.css" rel="stylesheet" type="text/css"><link href="http://alexgorbatchev.com/pub/sh/current/styles/shThemeDefault.css" rel="stylesheet" type="text/css"><script type="text/javascript">
+ SyntaxHighlighter.all();
+ </script><div class="section">
+ <p>
+ Like the clipboard, drag and drop is a common metaphor for data transfer. By clicking
+ and dragging with the mouse, the user can move, copy, or link data within or between
+ applications. It is signed to allow drag/drop integration with other applications; as
+ with the clipboard, untrusted applications can only perform local drag and drop
+ operations.
+ </p>
+
+ <p>
+ The following application demonstrates Pivot's support for drag and drop. Users can
+ drag the sample images from this page into the applet (the area within the border), or
+ drag the image out of the applet into any other application that supports images:
+ </p>
+
+ <table>
+ <tr>
+ <td rowspan="2">
+ <script src="http://java.com/js/deployJava.js" type="text/javascript"></script><script type="text/javascript">
+
+ var attributes = {
+ code:"org.apache.pivot.wtk.BrowserApplicationContext$HostApplet",
+ width:"420",
+ height:"240"
+ };
+
+
+
+
+
+ var libraries = [];
+ libraries.push("/lib/pivot-core-2.0.signed.jar");
+ libraries.push("/lib/pivot-wtk-2.0.signed.jar");
+ libraries.push("/lib/pivot-wtk-terra-2.0.signed.jar");
+ libraries.push("/lib/pivot-tutorials-2.0.signed.jar");
+
+ libraries.push("/lib/svgSalamander-tiny.signed.jar");
+
+
+ attributes.archive = libraries.join(",");
+
+
+ var parameters = {
+ codebase_lookup:false,
+ application_class_name:'org.apache.pivot.wtk.ScriptApplication'
+ };
+
+
+ var javaArguments = ["-Dsun.awt.noerasebackground=true",
+ "-Dsun.awt.erasebackgroundonresize=true"];
+
+
+
+ parameters.java_arguments = javaArguments.join(" ");
+
+
+
+ var startupProperties = [];
+
+ startupProperties.push("src=/org/apache/pivot/tutorials/dragdrop/drag_drop.bxml");
+
+ parameters.startup_properties = startupProperties.join("&");
+
+
+ deployJava.runApplet(attributes, parameters, "1.6");
+ </script>
+ </td>
+ <td>
+ <img src="IMG_0725_2.jpg">
+ </td>
+ </tr>
+ <tr>
+ <td>
+ <img src="IMG_0735_2.jpg">
+ </td>
+ </tr>
+ </table>
+
+ <p>
+ The BXML source for this example is as follows. It creates an <tt>ImageView</tt> and
+ attaches a drag source and drop target to it via the <tt>dragSource</tt> and
+ <tt>dropTarget</tt> attributes, respectively. The code for these handlers is defined
+ in "dragdrop.js", discussed next:
+ </p>
+
+ <pre class="brush:xml">
+
+ <Window title="Drag and Drop" maximized="true"
+ xmlns:bxml="http://pivot.apache.org/bxml"
+ xmlns="org.apache.pivot.wtk">
+ <bxml:script src="dragdrop.js"/>
+ <Border styles="{padding:2}">
+ <ImageView bxml:id="imageView" image="/org/apache/pivot/tutorials/IMG_0767_2.jpg"
+ dragSource="$dragSoure" dropTarget="$dropTarget"/>
+ </Border>
+ </Window>
+
+ </pre>
+
+ <p>
+ The contents of "dragdrop.js" are as follows:
+ </p>
+
+ <pre class="brush:jscript">
+
+ importPackage(org.apache.pivot.wtk);
+
+ var dragSoure = new DragSource() {
+ beginDrag: function(component, x, y) {
+ return true;
+ },
+
+ endDrag: function(component, dropAction) {
+ // No-op
+ },
+
+ getContent: function() {
+ var content = new LocalManifest();
+ content.putImage(imageView.getImage());
+
+ return content;
+ },
+
+ getOffset: function() {
+ // No-op; not used for native drags
+ return null;
+ },
+
+ getRepresentation: function() {
+ // No-op; not used for native drags
+ return null;
+ },
+
+ getSupportedDropActions: function() {
+ return DropAction.COPY.getMask();
+ },
+
+ isNative: function() {
+ return true;
+ }
+ };
+
+ var dropTarget = new DropTarget() {
+ dragEnter: function(component, dragContent, supportedDropActions, userDropAction) {
+ return (dragContent.containsImage()) ? DropAction.COPY : null;
+ },
+
+ dragExit: function(component) {
+ // No-op
+ },
+
+ dragMove: function(component, dragContent, supportedDropActions, x, y, userDropAction) {
+ return (dragContent.containsImage()) ? DropAction.COPY : null;
+ },
+
+ userDropActionChange: function(component, dragContent, supportedDropActions,
+ x, y, userDropAction) {
+ return (dragContent.containsImage()) ? DropAction.COPY : null;
+ },
+
+ drop: function(component, dragContent, supportedDropActions, x, y, userDropAction) {
+ var dropAction = null;
+
+ if (dragContent.containsImage()) {
+ imageView.setImage(dragContent.getImage());
+ dropAction = DropAction.COPY;
+ }
+
+ return dropAction;
+ }
+ };
+
+ </pre>
+
+ <p>
+ When the user initiates a drag operation, the Pivot platform detects the gesture and
+ walks the component hierarchy looking for a drag source. When it finds one, it calls
+ <tt>beginDrag()</tt>. If this method returns <tt>true</tt>, the platform calls
+ <tt>getContent()</tt> and begins the drag. Like the clipboard, drag/drop content is
+ also stored in a <tt>Manifest</tt>. In the case of a drag source, a
+ <tt>LocalManifest</tt> is used. The drag source in this example simply places the
+ image that is currently displayed by the image view in the manifest. It also reports
+ that the only supported action for this drag operation is COPY, by returning the
+ bitmask value of <tt>DropAction.COPY</tt> from <tt>getSupportedDropActions()</tt>.
+ </p>
+
+ <p>
+ When the user drags an image over the image view, the platform walks the component
+ hierarchy looking for a drop target. When it finds one, it calls <tt>dragEnter()</tt>.
+ If the drop target is capable of accepting the drop, it returns its preferred drop
+ action (the action that would result if the user dropped the drag content at that
+ point). The platform repeatedly calls <tt>dragMove()</tt> while the mouse remains over
+ the drop target, giving the application the opportunity to report a different drop
+ action depending on the current mouse location.
+ </p>
+
+ <p>
+ Finally, when the user releases the mouse button, the <tt>drop()</tt> method is
+ called. This method actually performs the drop, and returns the actual drop action
+ that was performed (or <tt>null</tt> if nothing was dropped).
+ </p>
+ </div><p>Next: <a href="effects.html">Effects</a></p></div></div></div><div class="group" id="footer"><div class="footerLogo">Copyright (c) 1999-2011<br>The Apache Software Foundation.</div><div class="footerLinks"><ul class="footerMenuGr"><li><strong>Demos</strong><ul><li><a href="/demos/kitchen-sink.html" target="_new">"Kitchen Sink"</a></li><li><a href="/demos/component-explorer.html" target="_new">Component Explorer</a></li><li><a href="http://ixnay.biz/pivot-jfree-demos/charts_demo.html" target="_new">Charting</a></li><li><a href="/demos/">More Demos</a></li></ul></li><li><strong>Documentation</strong><ul><li><a href="/getting-started.html">Getting Started</a></li><li><a href="/tutorials/">Tutorial</a></li><li><a href="/faq.html">FAQ</a></li><li><a href="/2.0/docs/api/">Javadoc (2.0)</a></li></ul></li><li><strong>Get Involved</strong><ul><li><a href="/svn.html">SVN Repositories</a></li><li><a href="/lists.html">Mailing Lists</a></li><li><a href="http://issues.apache
.org/jira/browse/PIVOT">Bug Database</a></li><li><a href="http://cwiki.apache.org/PIVOT/">Wiki</a></li></ul></li><li><strong>Related</strong><ul><li><a href="http://code.google.com/p/pivot-jfree/">JFreeChart Provider</a></li></ul></li><li><strong>About</strong><ul><li><a href="/who-we-are.html">Who We Are</a></li><li><a href="/contact.html">Contact</a></li><li><a href="/news.html">News</a></li><li><a href="/legal.html">Legal/License</a></li></ul></li></ul></div></div></div></body></html>
\ No newline at end of file
Added: pivot/site/trunk/deploy/tutorials/effects.html
URL: http://svn.apache.org/viewvc/pivot/site/trunk/deploy/tutorials/effects.html?rev=1067847&view=auto
==============================================================================
--- pivot/site/trunk/deploy/tutorials/effects.html (added)
+++ pivot/site/trunk/deploy/tutorials/effects.html Mon Feb 7 02:36:04 2011
@@ -0,0 +1,214 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<!--
+Licensed to the Apache Software Foundation (ASF) under one or more
+contributor license agreements. See the NOTICE file distributed with
+this work for additional information regarding copyright ownership.
+The ASF licenses this file to you under the Apache License,
+Version 2.0 (the "License"); you may not use this file except in
+compliance with the License. You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+--><html xmlns="http://www.w3.org/1999/xhtml"><head><meta content="text/html; charset=UTF-8" http-equiv="Content-Type" /><title>Effects | Apache Pivot</title><link xmlns="" type="text/css" rel="stylesheet" href="/styles/pivot.css"><script xmlns="http://www.w3.org/1999/xhtml" type="text/javascript">
+ var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
+ document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
+ </script><script type="text/javascript">
+ try {
+ var pageTracker = _gat._getTracker("UA-7977275-3");
+ pageTracker._trackPageview();
+ } catch(err) {}</script></head><body><div xmlns="" id="wrapper"><div id="main"><div id="header"><div class="logo"><a href="/index.html"><img title="Apache Pivot Homepage" alt="Apache Pivot" src="/images/logo.png"></a></div><div class="tagline"><img style="visibility:hidden" alt="Rich Internet Applications in Java" src="/images/tagline.png"></div><ul class="navi"><li><a href="/demos/">Demos</a></li><li><a href="/download.cgi#2.0">Download</a></li><li><a href="/tutorials/">Tutorial</a></li><li><a href="/get-involved.html">Get Involved</a></li><li><a href="/about.html">About</a></li></ul></div><div class="group" id="contentBase"><h1>Effects</h1><ul class="naviLeft"><li><a href="/tutorials/sample-application.html">Sample Application</a></li><li><a href="/tutorials/platform-overview.html">Platform Overview</a></li><li><a href="/tutorials/hello-world.html">Hello, World!</a></li><li><a href="/tutorials/hello-bxml.html">Hello, BXML!</a></li><li><a href="/tutorials/co
mponent-and-container.html">Component & Container</a></li><li><a href="/tutorials/labels-and-image-views.html">Labels & Image Views</a></li><li><a href="/tutorials/svg-images.html">SVG Images</a></li><li><a href="/tutorials/buttons.html">Buttons</a></li><li><a href="/tutorials/push-buttons.html">Push Buttons</a></li><li><a href="/tutorials/toggle-buttons.html">Toggle Buttons</a></li><li><a href="/tutorials/radio-buttons.html">Radio Buttons</a></li><li><a href="/tutorials/checkboxes.html">Checkboxes</a></li><li><a href="/tutorials/link-buttons.html">Link Buttons</a></li><li><a href="/tutorials/lists.html">Lists</a></li><li><a href="/tutorials/list-buttons.html">List Buttons</a></li><li><a href="/tutorials/repeatable-list-buttons.html">Repeatable List Buttons</a></li><li><a href="/tutorials/text.html">Text</a></li><li><a href="/tutorials/suggestion-popups.html">Suggestion Popups</a></li><li><a href="/tutorials/text-areas.html">Text Areas</a></li><li><a href="/tutorials
/separators.html">Separators</a></li><li><a href="/tutorials/layout-containers.html">Layout Containers</a></li><li><a href="/tutorials/flow-panes.html">Flow Panes</a></li><li><a href="/tutorials/box-panes.html">Box Panes</a></li><li><a href="/tutorials/grid-panes.html">Grid Panes</a></li><li><a href="/tutorials/table-panes.html">Table Panes</a></li><li><a href="/tutorials/borders.html">Borders</a></li><li><a href="/tutorials/stack-panes.html">Stack Panes</a></li><li><a href="/tutorials/split-panes.html">Split Panes</a></li><li><a href="/tutorials/forms.html">Forms</a></li><li><a href="/tutorials/panels.html">Panels</a></li><li><a href="/tutorials/navigation-containers.html">Navigation Containers</a></li><li><a href="/tutorials/card-panes.html">Card Panes</a></li><li><a href="/tutorials/tab-panes.html">Tab Panes</a></li><li><a href="/tutorials/accordions.html">Accordions</a></li><li><a href="/tutorials/expanders.html">Expanders</a></li><li><a href="/tutorials/rollups.html">Ro
llups</a></li><li><a href="/tutorials/viewports.html">Viewports</a></li><li><a href="/tutorials/scroll-panes.html">Scroll Panes</a></li><li><a href="/tutorials/panoramas.html">Panoramas</a></li><li><a href="/tutorials/progress-indicators.html">Progress Indicators</a></li><li><a href="/tutorials/meters.html">Meters</a></li><li><a href="/tutorials/activity-indicators.html">Activity Indicators</a></li><li><a href="/tutorials/bounded-range-components.html">Bounded Range Components</a></li><li><a href="/tutorials/sliders.html">Sliders</a></li><li><a href="/tutorials/scroll-bars.html">Scroll Bars</a></li><li><a href="/tutorials/spinners.html">Spinners</a></li><li><a href="/tutorials/calendars.html">Calendars</a></li><li><a href="/tutorials/menus.html">Menus</a></li><li><a href="/tutorials/context-menus.html">Context Menus</a></li><li><a href="/tutorials/menu-bars.html">Menu Bars</a></li><li><a href="/tutorials/menu-buttons.html">Menu Buttons</a></li><li><a href="/tutorials/color-c
hoosers.html">Color Choosers</a></li><li><a href="/tutorials/table-views.html">Table Views</a></li><li><a href="/tutorials/table-views.json.html">JSON-based TableView</a></li><li><a href="/tutorials/table-views.custom.html">Custom TableView</a></li><li><a href="/tutorials/tree-views.html">Tree Views</a></li><li><a href="/tutorials/file-browsing.html">File Browsing</a></li><li><a href="/tutorials/windows.html">Windows</a></li><li><a href="/tutorials/clipboard.html">Clipboard</a></li><li><a href="/tutorials/drag-and-drop.html">Drag and Drop</a></li><li><a href="/tutorials/effects.html">Effects</a></li><li><a href="/tutorials/effects.transitions.html">Transitions</a></li><li><a href="/tutorials/data-binding.html">Data Binding</a></li><li><a href="/tutorials/property-binding.html">Property Binding</a></li><li><a href="/tutorials/localization.html">Localization</a></li><li><a href="/tutorials/background-tasks.html">Background Tasks</a></li><li><a href="/tutorials/web-queries.html
">Web Queries</a></li><li><a href="/tutorials/query-servlet.html">QueryServlet</a></li><li><a href="/tutorials/scripting.html">Scripting</a></li><li><a href="/tutorials/summary.html">Summary</a></li><li><a href="/tutorials/stock-tracker.html">The "Stock Tracker" Application</a></li><li><a href="/tutorials/stock-tracker.ui.html">UI Markup Using BXML</a></li><li><a href="/tutorials/stock-tracker.events.html">Event Handling</a></li><li><a href="/tutorials/stock-tracker.web-queries.html">Web Queries</a></li><li><a href="/tutorials/stock-tracker.data-binding.html">Data Binding</a></li><li><a href="/tutorials/stock-tracker.localization.html">Localization</a></li><li><a href="/tutorials/bxml-primer.html">BXML Primer</a></li></ul><div class="content"><style type="text/css">
+ applet {
+ border: 1px solid #999999;
+ }
+ </style><!--NOTE: Syntax highlighting script is LGPL--><script src="http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js" type="text/javascript"></script><script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJava.js" type="text/javascript"></script><script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushXml.js" type="text/javascript"></script><script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJScript.js" type="text/javascript"></script><link href="http://alexgorbatchev.com/pub/sh/current/styles/shCore.css" rel="stylesheet" type="text/css"><link href="http://alexgorbatchev.com/pub/sh/current/styles/shThemeDefault.css" rel="stylesheet" type="text/css"><script type="text/javascript">
+ SyntaxHighlighter.all();
+ </script><div class="section">
+ <p>
+ The term "effects" refers to Pivot's support for customizing the appearance or behavior
+ of a component, often over a timed interval producing an "animation". Pivot's primary
+ support for effects is provided by two types of classes: decorators and transitions.
+ </p>
+
+ <p>
+ Decorators allow an application alter the appearance of a component beyond what is
+ supported by the component's styles or any custom renderers the component might
+ support. For example, a decorator could be used to blur the main window of an
+ application when a modal dialog is open, or render the image shown by an image view in
+ grayscale rather than full color.
+ </p>
+
+ <p>
+ The following example demonstrates a number of stock Pivot decorators by attaching the
+ selected decorator to an <tt>ImageView</tt> component:
+ </p>
+
+ <script src="http://java.com/js/deployJava.js" type="text/javascript"></script><script type="text/javascript">
+
+ var attributes = {
+ code:"org.apache.pivot.wtk.BrowserApplicationContext$HostApplet",
+ width:"640",
+ height:"490"
+ };
+
+
+
+
+
+ var libraries = [];
+ libraries.push("/lib/pivot-core-2.0.jar");
+ libraries.push("/lib/pivot-wtk-2.0.jar");
+ libraries.push("/lib/pivot-wtk-terra-2.0.jar");
+ libraries.push("/lib/pivot-tutorials-2.0.jar");
+
+ libraries.push("/lib/svgSalamander-tiny.jar");
+
+
+ attributes.archive = libraries.join(",");
+
+
+ var parameters = {
+ codebase_lookup:false,
+ application_class_name:'org.apache.pivot.wtk.ScriptApplication'
+ };
+
+
+ var javaArguments = ["-Dsun.awt.noerasebackground=true",
+ "-Dsun.awt.erasebackgroundonresize=true"];
+
+
+
+ parameters.java_arguments = javaArguments.join(" ");
+
+
+
+ var startupProperties = [];
+
+ startupProperties.push("src=/org/apache/pivot/tutorials/effects/decorators.bxml");
+
+ parameters.startup_properties = startupProperties.join("&");
+
+
+ deployJava.runApplet(attributes, parameters, "1.6");
+ </script>
+
+ <p>
+ The BXML source for the example is shown below (there is no associated Java source):
+ </p>
+
+ <pre class="brush:xml">
+
+ <Window title="Decorators" maximized="true"
+ xmlns:bxml="http://pivot.apache.org/bxml"
+ xmlns:effects="org.apache.pivot.wtk.effects"
+ xmlns="org.apache.pivot.wtk">
+ <TablePane>
+ <columns>
+ <TablePane.Column width="1*"/>
+ <TablePane.Column width="-1"/>
+ </columns>
+
+ <TablePane.Row>
+ <Border styles="{padding:2}">
+ <BoxPane preferredWidth="480" preferredHeight="480"
+ styles="{horizontalAlignment:'center', verticalAlignment:'top', padding:6}">
+ <ImageView bxml:id="imageView" image="/org/apache/pivot/tutorials/IMG_0725_2.jpg"/>
+ </BoxPane>
+ </Border>
+
+ <BoxPane orientation="vertical" styles="{padding:6, spacing:6}">
+ <bxml:define>
+ <ButtonGroup bxml:id="decoratorButtonGroup">
+ <buttonGroupListeners>
+ function selectionChanged(buttonGroup) {
+ var selection = buttonGroup.getSelection();
+
+ if (selection != null) {
+ var decorator = selection.getUserData().get("decorator");
+ imageView.getDecorators().removeAll();
+
+ if (decorator != null) {
+ imageView.getDecorators().add(decorator);
+ }
+ }
+ }
+ </buttonGroupListeners>
+ </ButtonGroup>
+ </bxml:define>
+
+ <RadioButton buttonData="None" buttonGroup="$decoratorButtonGroup" selected="true"/>
+
+ <RadioButton buttonData="Blur" buttonGroup="$decoratorButtonGroup">
+ <userData>
+ <decorator>
+ <effects:BlurDecorator/>
+ </decorator>
+ </userData>
+ </RadioButton>
+
+ <RadioButton buttonData="Fade" buttonGroup="$decoratorButtonGroup">
+ <userData>
+ <decorator>
+ <effects:FadeDecorator opacity="0.33"/>
+ </decorator>
+ </userData>
+ </RadioButton>
+
+ <RadioButton buttonData="Grayscale" buttonGroup="$decoratorButtonGroup">
+ <userData>
+ <decorator>
+ <effects:GrayscaleDecorator/>
+ </decorator>
+ </userData>
+ </RadioButton>
+
+ <RadioButton buttonData="Reflection" buttonGroup="$decoratorButtonGroup">
+ <userData>
+ <decorator>
+ <effects:ReflectionDecorator/>
+ </decorator>
+ </userData>
+ </RadioButton>
+
+ <RadioButton buttonData="Saturation" buttonGroup="$decoratorButtonGroup">
+ <userData>
+ <decorator>
+ <effects:SaturationDecorator multiplier="2.5"/>
+ </decorator>
+ </userData>
+ </RadioButton>
+
+ <RadioButton buttonData="Shade" buttonGroup="$decoratorButtonGroup">
+ <userData>
+ <decorator>
+ <effects:ShadeDecorator color="#ff0000" opacity="0.33"/>
+ </decorator>
+ </userData>
+ </RadioButton>
+
+ <RadioButton buttonData="Watermark" buttonGroup="$decoratorButtonGroup">
+ <userData>
+ <decorator>
+ <effects:WatermarkDecorator text="Watermark" font="Arial BOLD 24"
+ opacity="0.33"/>
+ </decorator>
+ </userData>
+ </RadioButton>
+ </BoxPane>
+ </TablePane.Row>
+ </TablePane>
+ </Window>
+
+ </pre>
+
+ <p>
+ Notice that decorators are allowed to paint outside of a component's bounds (which a
+ component generally is not). This allows decorators to be used to create the reflection
+ effect shown in the example, or to paint a drop shadow (in fact, the drop shadows that
+ appear beneath Pivot windows are produced by the <tt>DropShadowDecorator</tt> class).
+ </p>
+ </div><p>Next: <a href="effects.transitions.html">Transitions</a></p></div></div></div><div class="group" id="footer"><div class="footerLogo">Copyright (c) 1999-2011<br>The Apache Software Foundation.</div><div class="footerLinks"><ul class="footerMenuGr"><li><strong>Demos</strong><ul><li><a href="/demos/kitchen-sink.html" target="_new">"Kitchen Sink"</a></li><li><a href="/demos/component-explorer.html" target="_new">Component Explorer</a></li><li><a href="http://ixnay.biz/pivot-jfree-demos/charts_demo.html" target="_new">Charting</a></li><li><a href="/demos/">More Demos</a></li></ul></li><li><strong>Documentation</strong><ul><li><a href="/getting-started.html">Getting Started</a></li><li><a href="/tutorials/">Tutorial</a></li><li><a href="/faq.html">FAQ</a></li><li><a href="/2.0/docs/api/">Javadoc (2.0)</a></li></ul></li><li><strong>Get Involved</strong><ul><li><a href="/svn.html">SVN Repositories</a></li><li><a href="/lists.html">Mailing Lists</a></li><li><a href="http
://issues.apache.org/jira/browse/PIVOT">Bug Database</a></li><li><a href="http://cwiki.apache.org/PIVOT/">Wiki</a></li></ul></li><li><strong>Related</strong><ul><li><a href="http://code.google.com/p/pivot-jfree/">JFreeChart Provider</a></li></ul></li><li><strong>About</strong><ul><li><a href="/who-we-are.html">Who We Are</a></li><li><a href="/contact.html">Contact</a></li><li><a href="/news.html">News</a></li><li><a href="/legal.html">Legal/License</a></li></ul></li></ul></div></div></div></body></html>
\ No newline at end of file
Added: pivot/site/trunk/deploy/tutorials/effects.transitions.html
URL: http://svn.apache.org/viewvc/pivot/site/trunk/deploy/tutorials/effects.transitions.html?rev=1067847&view=auto
==============================================================================
--- pivot/site/trunk/deploy/tutorials/effects.transitions.html (added)
+++ pivot/site/trunk/deploy/tutorials/effects.transitions.html Mon Feb 7 02:36:04 2011
@@ -0,0 +1,274 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<!--
+Licensed to the Apache Software Foundation (ASF) under one or more
+contributor license agreements. See the NOTICE file distributed with
+this work for additional information regarding copyright ownership.
+The ASF licenses this file to you under the Apache License,
+Version 2.0 (the "License"); you may not use this file except in
+compliance with the License. You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+--><html xmlns="http://www.w3.org/1999/xhtml"><head><meta content="text/html; charset=UTF-8" http-equiv="Content-Type" /><title>Transitions | Apache Pivot</title><link xmlns="" type="text/css" rel="stylesheet" href="/styles/pivot.css"><script xmlns="http://www.w3.org/1999/xhtml" type="text/javascript">
+ var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
+ document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
+ </script><script type="text/javascript">
+ try {
+ var pageTracker = _gat._getTracker("UA-7977275-3");
+ pageTracker._trackPageview();
+ } catch(err) {}</script></head><body><div xmlns="" id="wrapper"><div id="main"><div id="header"><div class="logo"><a href="/index.html"><img title="Apache Pivot Homepage" alt="Apache Pivot" src="/images/logo.png"></a></div><div class="tagline"><img style="visibility:hidden" alt="Rich Internet Applications in Java" src="/images/tagline.png"></div><ul class="navi"><li><a href="/demos/">Demos</a></li><li><a href="/download.cgi#2.0">Download</a></li><li><a href="/tutorials/">Tutorial</a></li><li><a href="/get-involved.html">Get Involved</a></li><li><a href="/about.html">About</a></li></ul></div><div class="group" id="contentBase"><h1>Transitions</h1><ul class="naviLeft"><li><a href="/tutorials/sample-application.html">Sample Application</a></li><li><a href="/tutorials/platform-overview.html">Platform Overview</a></li><li><a href="/tutorials/hello-world.html">Hello, World!</a></li><li><a href="/tutorials/hello-bxml.html">Hello, BXML!</a></li><li><a href="/tutorial
s/component-and-container.html">Component & Container</a></li><li><a href="/tutorials/labels-and-image-views.html">Labels & Image Views</a></li><li><a href="/tutorials/svg-images.html">SVG Images</a></li><li><a href="/tutorials/buttons.html">Buttons</a></li><li><a href="/tutorials/push-buttons.html">Push Buttons</a></li><li><a href="/tutorials/toggle-buttons.html">Toggle Buttons</a></li><li><a href="/tutorials/radio-buttons.html">Radio Buttons</a></li><li><a href="/tutorials/checkboxes.html">Checkboxes</a></li><li><a href="/tutorials/link-buttons.html">Link Buttons</a></li><li><a href="/tutorials/lists.html">Lists</a></li><li><a href="/tutorials/list-buttons.html">List Buttons</a></li><li><a href="/tutorials/repeatable-list-buttons.html">Repeatable List Buttons</a></li><li><a href="/tutorials/text.html">Text</a></li><li><a href="/tutorials/suggestion-popups.html">Suggestion Popups</a></li><li><a href="/tutorials/text-areas.html">Text Areas</a></li><li><a href="/tutor
ials/separators.html">Separators</a></li><li><a href="/tutorials/layout-containers.html">Layout Containers</a></li><li><a href="/tutorials/flow-panes.html">Flow Panes</a></li><li><a href="/tutorials/box-panes.html">Box Panes</a></li><li><a href="/tutorials/grid-panes.html">Grid Panes</a></li><li><a href="/tutorials/table-panes.html">Table Panes</a></li><li><a href="/tutorials/borders.html">Borders</a></li><li><a href="/tutorials/stack-panes.html">Stack Panes</a></li><li><a href="/tutorials/split-panes.html">Split Panes</a></li><li><a href="/tutorials/forms.html">Forms</a></li><li><a href="/tutorials/panels.html">Panels</a></li><li><a href="/tutorials/navigation-containers.html">Navigation Containers</a></li><li><a href="/tutorials/card-panes.html">Card Panes</a></li><li><a href="/tutorials/tab-panes.html">Tab Panes</a></li><li><a href="/tutorials/accordions.html">Accordions</a></li><li><a href="/tutorials/expanders.html">Expanders</a></li><li><a href="/tutorials/rollups.html
">Rollups</a></li><li><a href="/tutorials/viewports.html">Viewports</a></li><li><a href="/tutorials/scroll-panes.html">Scroll Panes</a></li><li><a href="/tutorials/panoramas.html">Panoramas</a></li><li><a href="/tutorials/progress-indicators.html">Progress Indicators</a></li><li><a href="/tutorials/meters.html">Meters</a></li><li><a href="/tutorials/activity-indicators.html">Activity Indicators</a></li><li><a href="/tutorials/bounded-range-components.html">Bounded Range Components</a></li><li><a href="/tutorials/sliders.html">Sliders</a></li><li><a href="/tutorials/scroll-bars.html">Scroll Bars</a></li><li><a href="/tutorials/spinners.html">Spinners</a></li><li><a href="/tutorials/calendars.html">Calendars</a></li><li><a href="/tutorials/menus.html">Menus</a></li><li><a href="/tutorials/context-menus.html">Context Menus</a></li><li><a href="/tutorials/menu-bars.html">Menu Bars</a></li><li><a href="/tutorials/menu-buttons.html">Menu Buttons</a></li><li><a href="/tutorials/col
or-choosers.html">Color Choosers</a></li><li><a href="/tutorials/table-views.html">Table Views</a></li><li><a href="/tutorials/table-views.json.html">JSON-based TableView</a></li><li><a href="/tutorials/table-views.custom.html">Custom TableView</a></li><li><a href="/tutorials/tree-views.html">Tree Views</a></li><li><a href="/tutorials/file-browsing.html">File Browsing</a></li><li><a href="/tutorials/windows.html">Windows</a></li><li><a href="/tutorials/clipboard.html">Clipboard</a></li><li><a href="/tutorials/drag-and-drop.html">Drag and Drop</a></li><li><a href="/tutorials/effects.html">Effects</a></li><li><a href="/tutorials/effects.transitions.html">Transitions</a></li><li><a href="/tutorials/data-binding.html">Data Binding</a></li><li><a href="/tutorials/property-binding.html">Property Binding</a></li><li><a href="/tutorials/localization.html">Localization</a></li><li><a href="/tutorials/background-tasks.html">Background Tasks</a></li><li><a href="/tutorials/web-queries.
html">Web Queries</a></li><li><a href="/tutorials/query-servlet.html">QueryServlet</a></li><li><a href="/tutorials/scripting.html">Scripting</a></li><li><a href="/tutorials/summary.html">Summary</a></li><li><a href="/tutorials/stock-tracker.html">The "Stock Tracker" Application</a></li><li><a href="/tutorials/stock-tracker.ui.html">UI Markup Using BXML</a></li><li><a href="/tutorials/stock-tracker.events.html">Event Handling</a></li><li><a href="/tutorials/stock-tracker.web-queries.html">Web Queries</a></li><li><a href="/tutorials/stock-tracker.data-binding.html">Data Binding</a></li><li><a href="/tutorials/stock-tracker.localization.html">Localization</a></li><li><a href="/tutorials/bxml-primer.html">BXML Primer</a></li></ul><div class="content"><style type="text/css">
+ applet {
+ border: 1px solid #999999;
+ }
+ </style><!--NOTE: Syntax highlighting script is LGPL--><script src="http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js" type="text/javascript"></script><script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJava.js" type="text/javascript"></script><script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushXml.js" type="text/javascript"></script><script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJScript.js" type="text/javascript"></script><link href="http://alexgorbatchev.com/pub/sh/current/styles/shCore.css" rel="stylesheet" type="text/css"><link href="http://alexgorbatchev.com/pub/sh/current/styles/shThemeDefault.css" rel="stylesheet" type="text/css"><script type="text/javascript">
+ SyntaxHighlighter.all();
+ </script><div class="section">
+ <p>
+ Transitions are used to execute a set of operations over a given period of time,
+ producing an animation effect. For example, they are used to slide sheets in and out of
+ view, fade menu items, and "slide" from one card to another in a card pane.
+ </p>
+
+ <p>
+ Because transitions are often very specific to the item on which they operate, Pivot
+ does not include any stock transitions. However, it is very easy to create one. The
+ following application demonstrates the use of a "collapse transition" that causes a
+ button to shrink and fade as it is removed from its parent container:
+ </p>
+
+ <script src="http://java.com/js/deployJava.js" type="text/javascript"></script><script type="text/javascript">
+
+ var attributes = {
+ code:"org.apache.pivot.wtk.BrowserApplicationContext$HostApplet",
+ width:"180",
+ height:"40"
+ };
+
+
+
+
+
+ var libraries = [];
+ libraries.push("/lib/pivot-core-2.0.jar");
+ libraries.push("/lib/pivot-wtk-2.0.jar");
+ libraries.push("/lib/pivot-wtk-terra-2.0.jar");
+ libraries.push("/lib/pivot-tutorials-2.0.jar");
+
+ libraries.push("/lib/svgSalamander-tiny.jar");
+
+
+ attributes.archive = libraries.join(",");
+
+
+ var parameters = {
+ codebase_lookup:false,
+ application_class_name:'org.apache.pivot.wtk.ScriptApplication'
+ };
+
+
+ var javaArguments = ["-Dsun.awt.noerasebackground=true",
+ "-Dsun.awt.erasebackgroundonresize=true"];
+
+
+
+ parameters.java_arguments = javaArguments.join(" ");
+
+
+
+ var startupProperties = [];
+
+ startupProperties.push("src=/org/apache/pivot/tutorials/effects/transitions.bxml");
+
+ parameters.startup_properties = startupProperties.join("&");
+
+
+ deployJava.runApplet(attributes, parameters, "1.6");
+ </script>
+
+ <p>The BXML source for the example is shown below. It simply creates a box pane containing several push buttons:</p>
+
+ <pre class="brush:xml">
+
+ <effects:Transitions title="Transitions" maximized="true"
+ xmlns:bxml="http://pivot.apache.org/bxml"
+ xmlns:effects="org.apache.pivot.tutorials.effects"
+ xmlns="org.apache.pivot.wtk">
+ <BoxPane styles="{padding:4, spacing:4}">
+ <PushButton bxml:id="button1" buttonData="One"/>
+ <PushButton bxml:id="button2" buttonData="Two"/>
+ <PushButton bxml:id="button3" buttonData="Three"/>
+ <PushButton bxml:id="button4" buttonData="Four"/>
+ </BoxPane>
+ </effects:Transitions>
+
+ </pre>
+
+ <p>
+ The Java source for the application is below. It attaches a button press listener to
+ each button that starts the collapse transition when the button is pressed (or reverses
+ it if one is already running):
+ </p>
+
+ <pre class="brush:java">
+
+ package org.apache.pivot.tutorials.effects;
+
+ import java.net.URL;
+
+ import org.apache.pivot.beans.Bindable;
+ import org.apache.pivot.collections.Map;
+ import org.apache.pivot.util.Resources;
+ import org.apache.pivot.wtk.Button;
+ import org.apache.pivot.wtk.ButtonPressListener;
+ import org.apache.pivot.wtk.Component;
+ import org.apache.pivot.wtk.PushButton;
+ import org.apache.pivot.wtk.Window;
+ import org.apache.pivot.wtk.effects.Transition;
+ import org.apache.pivot.wtk.effects.TransitionListener;
+
+ public class Transitions extends Window implements Bindable {
+ private PushButton button1 = null;
+ private PushButton button2 = null;
+ private PushButton button3 = null;
+ private PushButton button4 = null;
+
+ private CollapseTransition collapseTransition = null;
+
+ public static int TRANSITION_DURATION = 250;
+ public static int TRANSITION_RATE = 30;
+
+ @Override
+ public void initialize(Map<String, Object> namespace, URL location, Resources resources) {
+ button1 = (PushButton)namespace.get("button1");
+ button2 = (PushButton)namespace.get("button2");
+ button3 = (PushButton)namespace.get("button3");
+ button4 = (PushButton)namespace.get("button4");
+
+ ButtonPressListener buttonPressListener = new ButtonPressListener() {
+ @Override
+ public void buttonPressed(final Button button) {
+ if (collapseTransition == null) {
+ collapseTransition = new CollapseTransition(button, TRANSITION_DURATION, TRANSITION_RATE);
+
+ TransitionListener transitionListener = new TransitionListener() {
+ @Override
+ public void transitionCompleted(Transition transition) {
+ CollapseTransition collapseTransition = (CollapseTransition)transition;
+
+ if (!transition.isReversed()) {
+ Component component = collapseTransition.getComponent();
+ component.getParent().remove(component);
+ }
+
+ Transitions.this.collapseTransition = null;
+ }
+ };
+
+ collapseTransition.start(transitionListener);
+ } else {
+ collapseTransition.reverse();
+
+ if (collapseTransition.getComponent() != button) {
+ collapseTransition.end();
+ }
+ }
+ }
+ };
+
+ button1.getButtonPressListeners().add(buttonPressListener);
+ button2.getButtonPressListeners().add(buttonPressListener);
+ button3.getButtonPressListeners().add(buttonPressListener);
+ button4.getButtonPressListeners().add(buttonPressListener);
+ }
+ }
+
+ </pre>
+
+ <p>
+ Finally, the source for the transition itself is shown below:
+ </p>
+
+ <pre class="brush:java">
+
+ package org.apache.pivot.tutorials.effects;
+
+ import org.apache.pivot.wtk.Component;
+ import org.apache.pivot.wtk.effects.FadeDecorator;
+ import org.apache.pivot.wtk.effects.Transition;
+ import org.apache.pivot.wtk.effects.TransitionListener;
+ import org.apache.pivot.wtk.effects.easing.Easing;
+ import org.apache.pivot.wtk.effects.easing.Quadratic;
+
+ public class CollapseTransition extends Transition {
+ private Component component;
+ private int initialWidth;
+ private Easing easing = new Quadratic();
+ private FadeDecorator fadeDecorator = new FadeDecorator();
+
+ public CollapseTransition(Component component, int duration, int rate) {
+ super(duration, rate, false);
+
+ this.component = component;
+ initialWidth = component.getWidth();
+ }
+
+ public Component getComponent() {
+ return component;
+ }
+
+ @Override
+ public void start(TransitionListener transitionListener) {
+ component.getDecorators().add(fadeDecorator);
+
+ super.start(transitionListener);
+ }
+
+ @Override
+ public void stop() {
+ component.getDecorators().remove(fadeDecorator);
+
+ super.stop();
+ }
+
+ @Override
+ protected void update() {
+ float percentComplete = getPercentComplete();
+
+ if (percentComplete < 1.0f) {
+ int duration = getDuration();
+ int width = (int)(initialWidth * (1.0f - percentComplete));
+
+ width = (int)easing.easeInOut(getElapsedTime(), initialWidth, width - initialWidth, duration);
+
+ component.setPreferredWidth(width);
+
+ fadeDecorator.setOpacity(1.0f - percentComplete);
+ component.repaint();
+ }
+ }
+ }
+
+ </pre>
+
+ <p>
+ In the transition's <tt>start()</tt> method, it attaches a fade decorator to the
+ component, which is later used by the <tt>update()</tt> method to produce the fade
+ part of the effect. The decorator is removed in <tt>stop()</tt>.
+ </p>
+
+ <p>
+ The <tt>update()</tt> method is called periodically to update the state of the
+ transition. In this example, it will be called 30 times per second for a duration of
+ 250 milliseconds. Each time <tt>update()</tt> is called, the transition adjusts the
+ opacity of the fade decorator to the inverse of the completion percentage and sets the
+ component's preferred width to the given percentage of the component's initial width
+ when the transition started. When the transition is complete, the opacity value will be
+ zero, as will its preferred width. It is then removed from the parent box pane by the
+ transition listener that had been passed to the <tt>start()</tt> method.
+ </p>
+ </div><p>Next: <a href="data-binding.html">Data Binding</a></p></div></div></div><div class="group" id="footer"><div class="footerLogo">Copyright (c) 1999-2011<br>The Apache Software Foundation.</div><div class="footerLinks"><ul class="footerMenuGr"><li><strong>Demos</strong><ul><li><a href="/demos/kitchen-sink.html" target="_new">"Kitchen Sink"</a></li><li><a href="/demos/component-explorer.html" target="_new">Component Explorer</a></li><li><a href="http://ixnay.biz/pivot-jfree-demos/charts_demo.html" target="_new">Charting</a></li><li><a href="/demos/">More Demos</a></li></ul></li><li><strong>Documentation</strong><ul><li><a href="/getting-started.html">Getting Started</a></li><li><a href="/tutorials/">Tutorial</a></li><li><a href="/faq.html">FAQ</a></li><li><a href="/2.0/docs/api/">Javadoc (2.0)</a></li></ul></li><li><strong>Get Involved</strong><ul><li><a href="/svn.html">SVN Repositories</a></li><li><a href="/lists.html">Mailing Lists</a></li><li><a href="http://iss
ues.apache.org/jira/browse/PIVOT">Bug Database</a></li><li><a href="http://cwiki.apache.org/PIVOT/">Wiki</a></li></ul></li><li><strong>Related</strong><ul><li><a href="http://code.google.com/p/pivot-jfree/">JFreeChart Provider</a></li></ul></li><li><strong>About</strong><ul><li><a href="/who-we-are.html">Who We Are</a></li><li><a href="/contact.html">Contact</a></li><li><a href="/news.html">News</a></li><li><a href="/legal.html">Legal/License</a></li></ul></li></ul></div></div></div></body></html>
\ No newline at end of file