You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@pivot.apache.org by sm...@apache.org on 2012/01/19 01:51:42 UTC
svn commit: r1233143 [23/47] - in /pivot/site/trunk/deploy: ./ 2.0.1/
2.0.1/docs/ 2.0.1/docs/api/ demos/ tutorials/
Modified: pivot/site/trunk/deploy/tutorials/list-buttons.html
URL: http://svn.apache.org/viewvc/pivot/site/trunk/deploy/tutorials/list-buttons.html?rev=1233143&r1=1233142&r2=1233143&view=diff
==============================================================================
--- pivot/site/trunk/deploy/tutorials/list-buttons.html (original)
+++ pivot/site/trunk/deploy/tutorials/list-buttons.html Thu Jan 19 00:51:39 2012
@@ -1,4 +1,4 @@
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<!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
@@ -14,179 +14,181 @@ distributed under the License is distrib
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>List Buttons | 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>List Buttons</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>The following example demonstrates use of the <tt>ListButton</tt> component. Selecting an image name from the drop-down shows the corresponding image file in the image view on the right.</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:"480",
- height:"340"
- };
-
-
-
-
-
- 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/lists/list_buttons.bxml");
-
- parameters.startup_properties = startupProperties.join("&");
-
-
- deployJava.runApplet(attributes, parameters, "1.6");
- </script>
-
- <p>
- The BXML source for the example is below. Like the previous example, list data is
- specified as an attribute containing a JSON array of strings; this value is used to
- load the image displayed to the right of the list button. Like <tt>ListView</tt>,
- <tt>ListButtons</tt> can also be populated programmatically using instances of
- <tt>ListItem</tt>.
- </p>
-
- <pre class="brush:xml">
-
- <lists:ListButtons title="List Buttons" maximized="true"
- xmlns:bxml="http://pivot.apache.org/bxml"
- xmlns:lists="org.apache.pivot.tutorials.lists"
- xmlns="org.apache.pivot.wtk">
- <TablePane styles="{showHorizontalGridLines: true, showVerticalGridLines:true,
- horizontalSpacing:1, verticalSpacing:1}">
- <columns>
- <TablePane.Column width="-1"/>
- <TablePane.Column width="1*"/>
- </columns>
-
- <TablePane.Row height="340">
- <BoxPane orientation="vertical" styles="{verticalAlignment:'top', padding: 4}">
- <Label text="Picture:"/>
- <ListButton bxml:id="listButton"
- listData="['IMG_0725_2.jpg', 'IMG_0735_2.jpg', 'IMG_0767_2.jpg']"/>
- </BoxPane>
-
- <ImageView bxml:id="imageView" styles="{backgroundColor:'#404040'}"/>
- </TablePane.Row>
- </TablePane>
- </lists:ListButtons>
-
- </pre>
-
- <p>
- The Java source for the example is below:
- </p>
-
- <pre class="brush:java">
-
- package org.apache.pivot.tutorials.lists;
-
- 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.util.concurrent.TaskExecutionException;
- import org.apache.pivot.wtk.ApplicationContext;
- import org.apache.pivot.wtk.ImageView;
- import org.apache.pivot.wtk.ListButton;
- import org.apache.pivot.wtk.ListButtonSelectionListener;
- import org.apache.pivot.wtk.Window;
- import org.apache.pivot.wtk.media.Image;
-
- public class ListButtons extends Window implements Bindable {
- private ListButton listButton = null;
- private ImageView imageView = null;
-
- @Override
- public void initialize(Map<String, Object> namespace, URL location, Resources resources) {
- listButton = (ListButton)namespace.get("listButton");
- imageView = (ImageView)namespace.get("imageView");
-
- listButton.getListButtonSelectionListeners().add(new ListButtonSelectionListener.Adapter() {
- @Override
- public void selectedItemChanged(ListButton listButton, Object previousSelectedItem) {
- Object selectedItem = listButton.getSelectedItem();
-
- if (selectedItem != null) {
- // Get the image URL for the selected item
- ClassLoader classLoader = Thread.currentThread().getContextClassLoader();
- URL imageURL = classLoader.getResource("org/apache/pivot/tutorials/" + selectedItem);
-
- // If the image has not been added to the resource cache yet,
- // add it
- Image image = (Image)ApplicationContext.getResourceCache().get(imageURL);
-
- if (image == null) {
- try {
- image = Image.load(imageURL);
- } catch (TaskExecutionException exception) {
- throw new RuntimeException(exception);
- }
-
- ApplicationContext.getResourceCache().put(imageURL, image);
- }
-
- // Update the image
- imageView.setImage(image);
- }
- }
- });
-
- listButton.setSelectedIndex(0);
- }
- }
-
- </pre>
-
- <p>
- Note that this example makes use of the global resource cache to store the loaded
- images. This cache can be used to store any kind of application-specific data that may
- be expensive to load. Entries are keyed by the URL from which they were retrieved, and,
- once placed in the cache, are available to all code within the application. When the
- list button's selection changes, the application first looks for an image in the
- resource cache; if it is not found, it is loaded and added to the cache. It is then set
- as the "image" property of the image view and displayed.
- </p>
- </div><p>Next: <a href="repeatable-list-buttons.html">Repeatable List Buttons</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
+--><html xmlns="http://www.w3.org/1999/xhtml"><head><META http-equiv="Content-Type" content="text/html; charset=UTF-8"><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>List Buttons | Apache Pivot</title><link href="/styles/pivot.css" rel="stylesheet" type="text/css"><script 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 id="wrapper"><div id="main"><div id="header"><div xmlns="" class="logo"><a href="/index.html"><img src="/images/logo.png" alt="Apache Pivot" title="Apache Pivot Homepage"></a></div><div class="tagline"><img src="/images/tagline.png" alt="Rich Internet Applications in Java" style="visibility:hidden"></div><ul class="navi"><li><a href="/demos/">Demos</a></li><li><a href="/download.cgi#2.0.1">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 id="contentBase" class="group"><h1>List Buttons</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="/tutor
ials/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="/tu
torials/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/fill-panes.html">Fill 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/expande
rs.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/color-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 type="text/javascript" src="http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js"></script><script type="text/javascript" src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJava.js"></script><script type="text/javascript" src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushXml.js"></script><script type="text/javascript" src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJScript.js"></script><link type="text/css" rel="stylesheet" href="http://alexgorbatchev.com/pub/sh/current/styles/shCore.css"><link type="text/css" rel="stylesheet" href="http://alexgorbatchev.com/pub/sh/current/styles/shThemeDefault.css"><script type="text/javascript">
+ SyntaxHighlighter.all();
+ </script><div class="section">
+ <p>The following example demonstrates use of the <tt>ListButton</tt> component. Selecting an image name from the drop-down shows the corresponding image file in the image view on the right.</p>
+
+ <script type="text/javascript" src="http://java.com/js/deployJava.js"></script><script type="text/javascript">
+
+ var attributes = {
+ code:"org.apache.pivot.wtk.BrowserApplicationContext$HostApplet",
+ width:"480",
+ height:"340"
+ };
+
+
+
+
+
+ var libraries = [];
+ libraries.push("/lib/pivot-core-2.0.1.jar");
+ libraries.push("/lib/pivot-wtk-2.0.1.jar");
+ libraries.push("/lib/pivot-wtk-terra-2.0.1.jar");
+ libraries.push("/lib/pivot-tutorials-2.0.1.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/lists/list_buttons.bxml");
+
+ parameters.startup_properties = startupProperties.join("&");
+
+
+ deployJava.runApplet(attributes, parameters, "1.6");
+ </script>
+
+ <p>
+ The BXML source for the example is below. Like the previous example, list data is
+ specified as an attribute containing a JSON array of strings; this value is used to
+ load the image displayed to the right of the list button. Like <tt>ListView</tt>,
+ <tt>ListButtons</tt> can also be populated programmatically using instances of
+ <tt>ListItem</tt>.
+ </p>
+
+ <pre class="brush:xml">
+
+ <lists:ListButtons title="List Buttons" maximized="true"
+ xmlns:bxml="http://pivot.apache.org/bxml"
+ xmlns:lists="org.apache.pivot.tutorials.lists"
+ xmlns="org.apache.pivot.wtk">
+ <TablePane styles="{showHorizontalGridLines: true, showVerticalGridLines:true,
+ horizontalSpacing:1, verticalSpacing:1}">
+ <columns>
+ <TablePane.Column width="-1"/>
+ <TablePane.Column width="1*"/>
+ </columns>
+
+ <TablePane.Row height="340">
+ <BoxPane orientation="vertical" styles="{verticalAlignment:'top', padding: 4}">
+ <Label text="Picture:"/>
+ <ListButton bxml:id="listButton"
+ listData="['IMG_0725_2.jpg', 'IMG_0735_2.jpg', 'IMG_0767_2.jpg']"/>
+ </BoxPane>
+
+ <ImageView bxml:id="imageView" styles="{backgroundColor:'#404040'}"/>
+ </TablePane.Row>
+ </TablePane>
+ </lists:ListButtons>
+
+ </pre>
+
+ <p>
+ The Java source for the example is below:
+ </p>
+
+ <pre class="brush:java">
+
+ package org.apache.pivot.tutorials.lists;
+
+ 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.util.concurrent.TaskExecutionException;
+ import org.apache.pivot.wtk.ApplicationContext;
+ import org.apache.pivot.wtk.ImageView;
+ import org.apache.pivot.wtk.ListButton;
+ import org.apache.pivot.wtk.ListButtonSelectionListener;
+ import org.apache.pivot.wtk.Window;
+ import org.apache.pivot.wtk.media.Image;
+
+ public class ListButtons extends Window implements Bindable {
+ private ListButton listButton = null;
+ private ImageView imageView = null;
+
+ @Override
+ public void initialize(Map<String, Object> namespace, URL location, Resources resources) {
+ listButton = (ListButton)namespace.get("listButton");
+ imageView = (ImageView)namespace.get("imageView");
+
+ listButton.getListButtonSelectionListeners().add(new ListButtonSelectionListener.Adapter() {
+ @Override
+ public void selectedItemChanged(ListButton listButton, Object previousSelectedItem) {
+ Object selectedItem = listButton.getSelectedItem();
+
+ if (selectedItem != null) {
+ // Get the image URL for the selected item
+ ClassLoader classLoader = Thread.currentThread().getContextClassLoader();
+ URL imageURL = classLoader.getResource("org/apache/pivot/tutorials/" + selectedItem);
+
+ // If the image has not been added to the resource cache yet,
+ // add it
+ Image image = (Image)ApplicationContext.getResourceCache().get(imageURL);
+
+ if (image == null) {
+ try {
+ image = Image.load(imageURL);
+ } catch (TaskExecutionException exception) {
+ throw new RuntimeException(exception);
+ }
+
+ ApplicationContext.getResourceCache().put(imageURL, image);
+ }
+
+ // Update the image
+ imageView.setImage(image);
+ }
+ }
+ });
+
+ listButton.setSelectedIndex(0);
+ }
+ }
+
+ </pre>
+
+ <p>
+ Note that this example makes use of the global resource cache to store the loaded
+ images. This cache can be used to store any kind of application-specific data that may
+ be expensive to load. Entries are keyed by the URL from which they were retrieved, and,
+ once placed in the cache, are available to all code within the application. When the
+ list button's selection changes, the application first looks for an image in the
+ resource cache; if it is not found, it is loaded and added to the cache. It is then set
+ as the "image" property of the image view and displayed.
+ </p>
+ </div><p>Next: <a href="repeatable-list-buttons.html">Repeatable List Buttons</a></p></div></div></div><div id="footer" class="group"><div class="footerLogo">Copyright (c) 1999-2012<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://cwiki.apache.org/confluence/display/PIVOT/Other+Demos" 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.1/docs/api/">Javadoc (2.0.1)</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 Li
sts</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/a/apache-extras.org/p/pivot-jfree/">JFreeChart Provider</a></li><li><a href="http://code.google.com/a/apache-extras.org/p/pivot-common/">Pivot-Common</a></li><li><a href="http://code.google.com/a/apache-extras.org/p/pivot-contrib/">Pivot-Contrib</a></li><li><a href="http://code.google.com/a/apache-extras.org/p/pivot-multilang/">Pivot-Multilang</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="http://cwiki.apache.org/confluence/display/PIVOT/News">News</a></li><li><a href="/legal.html">Legal/License</a></li></ul></li></ul></div><div class="footerLinks">
+ Apache Pivot is a trademark of the Apache Software Foundation
+ </div></div></div></body></html>
\ No newline at end of file
Modified: pivot/site/trunk/deploy/tutorials/lists.html
URL: http://svn.apache.org/viewvc/pivot/site/trunk/deploy/tutorials/lists.html?rev=1233143&r1=1233142&r2=1233143&view=diff
==============================================================================
--- pivot/site/trunk/deploy/tutorials/lists.html (original)
+++ pivot/site/trunk/deploy/tutorials/lists.html Thu Jan 19 00:51:39 2012
@@ -1,4 +1,4 @@
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<!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
@@ -14,211 +14,332 @@ distributed under the License is distrib
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>Lists | 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>Lists</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/comp
onent-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/s
eparators.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">Roll
ups</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-cho
osers.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>
- List components in Pivot include <tt>ListView</tt> and <tt>ListButton</tt>.
- <tt>ListView</tt> is a (often scrollable) list of items of which one or more may be
- selected. <tt>ListButton</tt> is a popup list of items of which only one may be
- selected at a time. It is often used in place of a group of radio buttons, particularly
- when space is limited.
- </p>
-
- <p>
- <tt>ListButton</tt> is discussed in the next section. The following example
- demonstrates the <tt>ListView</tt> component. Multiple items may be selected at a time,
- and list selections are reflected in the label to the right.
- </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:"216",
- height:"122"
- };
-
-
-
-
-
- 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/lists/list_views.bxml");
-
- parameters.startup_properties = startupProperties.join("&");
-
-
- deployJava.runApplet(attributes, parameters, "1.6");
- </script>
-
- <p>
- The BXML source for the example follows. Note that the list view is itself contained
- within a <tt>ScrollPane</tt>. List views do not support scrolling internally. This
- allows a UI designer to place a list view within an application and have the list view
- simply grow to accommodate its contents, rather than requiring the designer to specify
- a fixed height for the list in advance. However, if the designer knows that the list
- will be long and that it is likely to scroll, it can be placed in a scroll pane.
- <tt>ScrollPane</tt> is discussed in more detail in the
- <a href="navigation-containers.html">Navigation Containers</a> section.
- </p>
-
- <p>
- Also note that the list's contents are specified in the BXML document itself, as a JSON
- array of strings in the <tt>listData</tt> attribute. Any type of object can actually be
- used as a list item, provided that the list view has been given a renderer that is
- capable of painting it. However, they are most often specified as strings (as in this
- example) or as instances of <tt>org.apache.pivot.wtk.content.ListItem</tt>, both of
- which the default renderer is capable of presenting.
- </p>
-
- <pre class="brush:xml">
-
- <lists:ListViews title="List Views" maximized="true"
- xmlns:bxml="http://pivot.apache.org/bxml"
- xmlns:lists="org.apache.pivot.tutorials.lists"
- xmlns="org.apache.pivot.wtk">
- <Border>
- <BoxPane styles="{padding:4, spacing:4}">
- <Border styles="{color:10}">
- <ScrollPane preferredWidth="80" preferredHeight="110"
- horizontalScrollBarPolicy="fill"
- verticalScrollBarPolicy="fill_to_capacity">
- <ListView bxml:id="listView" selectMode="multi"
- listData="['One', 'Two', 'Three', 'Four', 'Five',
- 'Six', 'Seven', 'Eight', 'Nine', 'Ten']"/>
- </ScrollPane>
- </Border>
- <BoxPane orientation="vertical" preferredWidth="120" styles="{fill:true}">
- <Label text="You selected:"/>
- <Label bxml:id="selectionLabel" styles="{wrapText:true}"/>
- </BoxPane>
- </BoxPane>
- </Border>
- </lists:ListViews>
-
- </pre>
-
- <p>
- The Java code for the example also uses the list data to populate the label component
- as the list selection changes. A <tt>ListView</tt>'s selection is represented by a
- sorted list of <tt>org.apache.pivot.wtk.Span</tt> objects that contain the currently
- selected ranges; the application retrieves the list of currently selected ranges and
- then constructs the label's text by appending each selected item to the string:
- </p>
-
- <pre class="brush:java">
-
- package org.apache.pivot.tutorials.lists;
-
- import java.net.URL;
-
- import org.apache.pivot.beans.Bindable;
- import org.apache.pivot.collections.Map;
- import org.apache.pivot.collections.Sequence;
- import org.apache.pivot.util.Resources;
- import org.apache.pivot.wtk.Label;
- import org.apache.pivot.wtk.ListView;
- import org.apache.pivot.wtk.ListViewSelectionListener;
- import org.apache.pivot.wtk.Span;
- import org.apache.pivot.wtk.Window;
-
- public class ListViews extends Window implements Bindable {
- private Label selectionLabel = null;
- private ListView listView = null;
-
- @Override
- public void initialize(Map<String, Object> namespace, URL location, Resources resources) {
- selectionLabel = (Label)namespace.get("selectionLabel");
- listView = (ListView)namespace.get("listView");
-
- listView.getListViewSelectionListeners().add(new ListViewSelectionListener() {
- @Override
- public void selectedRangeAdded(ListView listView, int rangeStart, int rangeEnd) {
- updateSelection(listView);
- }
-
- @Override
- public void selectedRangeRemoved(ListView listView, int rangeStart, int rangeEnd) {
- updateSelection(listView);
- }
-
- @Override
- public void selectedRangesChanged(ListView listView, Sequence<Span> previousSelectedRanges) {
- if (previousSelectedRanges != null
- && previousSelectedRanges != listView.getSelectedRanges()) {
- updateSelection(listView);
- }
- }
-
- @Override
- public void selectedItemChanged(ListView listView, Object previousSelectedItem) {
- // No-op
- }
-
- private void updateSelection(ListView listView) {
- String selectionText = "";
-
- Sequence<Span> selectedRanges = listView.getSelectedRanges();
- for (int i = 0, n = selectedRanges.getLength(); i < n; i++) {
- Span selectedRange = selectedRanges.get(i);
-
- for (int j = selectedRange.start;
- j <= selectedRange.end;
- j++) {
- if (selectionText.length() > 0) {
- selectionText += ", ";
- }
-
- String text = (String)listView.getListData().get(j);
- selectionText += text;
- }
- }
-
- selectionLabel.setText(selectionText);
- }
- });
- }
- }
-
- </pre>
- </div><p>Next: <a href="list-buttons.html">List Buttons</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
+--><html xmlns="http://www.w3.org/1999/xhtml"><head><META http-equiv="Content-Type" content="text/html; charset=UTF-8"><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>Lists | Apache Pivot</title><link href="/styles/pivot.css" rel="stylesheet" type="text/css"><script 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 id="wrapper"><div id="main"><div id="header"><div xmlns="" class="logo"><a href="/index.html"><img src="/images/logo.png" alt="Apache Pivot" title="Apache Pivot Homepage"></a></div><div class="tagline"><img src="/images/tagline.png" alt="Rich Internet Applications in Java" style="visibility:hidden"></div><ul class="navi"><li><a href="/demos/">Demos</a></li><li><a href="/download.cgi#2.0.1">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 id="contentBase" class="group"><h1>Lists</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/fill-panes.html">Fill 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-button
s.html">Menu Buttons</a></li><li><a href="/tutorials/color-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">Backg
round 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 type="text/javascript" src="http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js"></script><script type="text/javascript" src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJava.js"></script><script type="text/javascript" src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushXml.js"></script><script type="text/javascript" src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJScript.js"></script><link type="text/css" rel="stylesheet" href="http://alexgorbatchev.com/pub/sh/current/styles/shCore.css"><link type="text/css" rel="stylesheet" href="http://alexgorbatchev.com/pub/sh/current/styles/shThemeDefault.css"><script type="text/javascript">
+ SyntaxHighlighter.all();
+ </script><div class="section">
+ <p>
+ List components in Pivot include <tt>ListView</tt> and <tt>ListButton</tt>.
+ <tt>ListView</tt> is a (often scrollable) list of items of which one or more may be
+ selected. <tt>ListButton</tt> is a popup list of items of which only one may be
+ selected at a time. It is often used in place of a group of radio buttons, particularly
+ when space is limited.
+ </p>
+
+ <p>
+ <tt>ListButton</tt> is discussed in the next section. The following example
+ demonstrates the <tt>ListView</tt> component. Multiple items may be selected at a time,
+ and list selections are reflected in the label to the right.
+ </p>
+
+ <script type="text/javascript" src="http://java.com/js/deployJava.js"></script><script type="text/javascript">
+
+ var attributes = {
+ code:"org.apache.pivot.wtk.BrowserApplicationContext$HostApplet",
+ width:"216",
+ height:"122"
+ };
+
+
+
+
+
+ var libraries = [];
+ libraries.push("/lib/pivot-core-2.0.1.jar");
+ libraries.push("/lib/pivot-wtk-2.0.1.jar");
+ libraries.push("/lib/pivot-wtk-terra-2.0.1.jar");
+ libraries.push("/lib/pivot-tutorials-2.0.1.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/lists/list_views.bxml");
+
+ parameters.startup_properties = startupProperties.join("&");
+
+
+ deployJava.runApplet(attributes, parameters, "1.6");
+ </script>
+
+ <p>
+ The BXML source for the example follows. Note that the list view is itself contained
+ within a <tt>ScrollPane</tt>. List views do not support scrolling internally. This
+ allows a UI designer to place a list view within an application and have the list view
+ simply grow to accommodate its contents, rather than requiring the designer to specify
+ a fixed height for the list in advance. However, if the designer knows that the list
+ will be long and that it is likely to scroll, it can be placed in a scroll pane.
+ <tt>ScrollPane</tt> is discussed in more detail in the
+ <a href="navigation-containers.html">Navigation Containers</a> section.
+ </p>
+
+ <p>
+ Also note that the list's contents are specified in the BXML document itself, as a JSON
+ array of strings in the <tt>listData</tt> attribute. Any type of object can actually be
+ used as a list item, provided that the list view has been given a renderer that is
+ capable of painting it. However, they are most often specified as strings (as in this
+ example) or as instances of <tt>org.apache.pivot.wtk.content.ListItem</tt>, both of
+ which the default renderer is capable of presenting.
+ </p>
+
+ <pre class="brush:xml">
+
+ <lists:ListViews title="List Views" maximized="true"
+ xmlns:bxml="http://pivot.apache.org/bxml"
+ xmlns:lists="org.apache.pivot.tutorials.lists"
+ xmlns="org.apache.pivot.wtk">
+ <Border>
+ <BoxPane styles="{padding:4, spacing:4}">
+ <Border styles="{color:10}">
+ <ScrollPane preferredWidth="80" preferredHeight="110"
+ horizontalScrollBarPolicy="fill"
+ verticalScrollBarPolicy="fill_to_capacity">
+ <ListView bxml:id="listView" selectMode="multi"
+ listData="['One', 'Two', 'Three', 'Four', 'Five',
+ 'Six', 'Seven', 'Eight', 'Nine', 'Ten']"/>
+ </ScrollPane>
+ </Border>
+ <BoxPane orientation="vertical" preferredWidth="120" styles="{fill:true}">
+ <Label text="You selected:"/>
+ <Label bxml:id="selectionLabel" styles="{wrapText:true}"/>
+ </BoxPane>
+ </BoxPane>
+ </Border>
+ </lists:ListViews>
+
+ </pre>
+
+ <p>
+ The Java code for the example also uses the list data to populate the label component
+ as the list selection changes. A <tt>ListView</tt>'s selection is represented by a
+ sorted list of <tt>org.apache.pivot.wtk.Span</tt> objects that contain the currently
+ selected ranges; the application retrieves the list of currently selected ranges and
+ then constructs the label's text by appending each selected item to the string:
+ </p>
+
+ <pre class="brush:java">
+
+ package org.apache.pivot.tutorials.lists;
+
+ import java.net.URL;
+
+ import org.apache.pivot.beans.Bindable;
+ import org.apache.pivot.collections.Map;
+ import org.apache.pivot.collections.Sequence;
+ import org.apache.pivot.util.Resources;
+ import org.apache.pivot.wtk.Label;
+ import org.apache.pivot.wtk.ListView;
+ import org.apache.pivot.wtk.ListViewSelectionListener;
+ import org.apache.pivot.wtk.Span;
+ import org.apache.pivot.wtk.Window;
+ import org.apache.pivot.wtk.content.ListItem;
+
+ public class ListViews extends Window implements Bindable {
+ private Label selectionLabel = null;
+ private ListView listView = null;
+
+ @Override
+ public void initialize(Map<String, Object> namespace, URL location, Resources resources) {
+ selectionLabel = (Label)namespace.get("selectionLabel");
+ listView = (ListView)namespace.get("listView");
+
+ listView.getListViewSelectionListeners().add(new ListViewSelectionListener() {
+ @Override
+ public void selectedRangeAdded(ListView listView, int rangeStart, int rangeEnd) {
+ updateSelection(listView);
+ }
+
+ @Override
+ public void selectedRangeRemoved(ListView listView, int rangeStart, int rangeEnd) {
+ updateSelection(listView);
+ }
+
+ @Override
+ public void selectedRangesChanged(ListView listView, Sequence<Span> previousSelectedRanges) {
+ if (previousSelectedRanges != null
+ && previousSelectedRanges != listView.getSelectedRanges()) {
+ updateSelection(listView);
+ }
+ }
+
+ @Override
+ public void selectedItemChanged(ListView listView, Object previousSelectedItem) {
+ // No-op
+ }
+
+ private void updateSelection(ListView listView) {
+ String selectionText = "";
+
+ Sequence<Span> selectedRanges = listView.getSelectedRanges();
+ for (int i = 0, n = selectedRanges.getLength(); i < n; i++) {
+ Span selectedRange = selectedRanges.get(i);
+
+ for (int j = selectedRange.start;
+ j <= selectedRange.end;
+ j++) {
+ if (selectionText.length() > 0) {
+ selectionText += ", ";
+ }
+
+ Object item = listView.getListData().get(j);
+ String text;
+ if (item instanceof ListItem) { // item is a listItem (for example because it has an image)
+ text = ((ListItem) item).getText();
+ } else { // item is a standard item for listData
+ text = item.toString();
+ }
+ selectionText += text;
+ }
+ }
+
+ selectionLabel.setText(selectionText);
+ }
+ });
+ }
+ }
+
+ </pre>
+
+<br>
+<br>
+
+ <p>
+ Sample <tt>ListView</tt> containing <tt>ListItem</tt>s, and a renderer to display images for any item.
+ </p>
+
+ <script type="text/javascript" src="http://java.com/js/deployJava.js"></script><script type="text/javascript">
+
+ var attributes = {
+ code:"org.apache.pivot.wtk.BrowserApplicationContext$HostApplet",
+ width:"216",
+ height:"122"
+ };
+
+
+
+
+
+ var libraries = [];
+ libraries.push("/lib/pivot-core-2.0.1.jar");
+ libraries.push("/lib/pivot-wtk-2.0.1.jar");
+ libraries.push("/lib/pivot-wtk-terra-2.0.1.jar");
+ libraries.push("/lib/pivot-tutorials-2.0.1.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/lists/list_views_with_images.bxml");
+
+ parameters.startup_properties = startupProperties.join("&");
+
+
+ deployJava.runApplet(attributes, parameters, "1.6");
+ </script>
+
+ <p>
+ The BXML source for the example follows.
+ </p>
+
+ <p>
+ In this case list contents are set using the content namespace,
+ they are ListItem instances (not only plain Strings as the previous sample),
+ and there is a ListViewItemRenderer set.
+ Note that references to images (icon) here are set in a relative path,
+ to reuse images already existing just for convenience.
+ </p>
+
+ <pre class="brush:xml">
+
+ <lists:ListViews title="List Views with Images" maximized="true"
+ xmlns:bxml="http://pivot.apache.org/bxml"
+ xmlns:content="org.apache.pivot.wtk.content"
+ xmlns:lists="org.apache.pivot.tutorials.lists"
+ xmlns="org.apache.pivot.wtk">
+ <Border>
+ <BoxPane styles="{padding:4, spacing:4}">
+ <Border styles="{color:10}">
+ <ScrollPane preferredWidth="80" preferredHeight="110"
+ horizontalScrollBarPolicy="fill"
+ verticalScrollBarPolicy="fill_to_capacity">
+ <ListView bxml:id="listView" selectMode="multi"
+ >
+ <itemRenderer>
+ <content:ListViewItemRenderer iconWidth="16" iconHeight="16"
+ showIcon="true"
+ />
+ </itemRenderer>
+
+ <content:ListItem icon="@../anchor.png" text="Anchor"/>
+ <content:ListItem icon="@../bell.png" text="Bell"/>
+ <content:ListItem icon="@../clock.png" text="Clock"/>
+ <content:ListItem icon="@../cup.png" text="Cup"/>
+ <content:ListItem icon="@../house.png" text="House"/>
+ <content:ListItem icon="@../star.png" text="Star"/>
+ </ListView>
+ </ScrollPane>
+ </Border>
+ <BoxPane orientation="vertical" preferredWidth="120" styles="{fill:true}">
+ <Label text="You selected:"/>
+ <Label bxml:id="selectionLabel" styles="{wrapText:true}"/>
+ </BoxPane>
+ </BoxPane>
+ </Border>
+ </lists:ListViews>
+
+ </pre>
+
+ <p>
+ The Java code for the example is the same seen in the previous sample.
+ </p>
+ </div><p>Next: <a href="list-buttons.html">List Buttons</a></p></div></div></div><div id="footer" class="group"><div class="footerLogo">Copyright (c) 1999-2012<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://cwiki.apache.org/confluence/display/PIVOT/Other+Demos" 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.1/docs/api/">Javadoc (2.0.1)</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 hre
f="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/a/apache-extras.org/p/pivot-jfree/">JFreeChart Provider</a></li><li><a href="http://code.google.com/a/apache-extras.org/p/pivot-common/">Pivot-Common</a></li><li><a href="http://code.google.com/a/apache-extras.org/p/pivot-contrib/">Pivot-Contrib</a></li><li><a href="http://code.google.com/a/apache-extras.org/p/pivot-multilang/">Pivot-Multilang</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="http://cwiki.apache.org/confluence/display/PIVOT/News">News</a></li><li><a href="/legal.html">Legal/License</a></li></ul></li></ul></div><div class="footerLinks">
+ Apache Pivot is a trademark of the Apache Software Foundation
+ </div></div></div></body></html>
\ No newline at end of file