tutorials/www/fill-panes.xml - pivot - Git at Google

 <?xml version="1.0" encoding="UTF-8"?>
 <!--
 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.
 -->

 <document id="fill-panes">
     <properties>
         <title>Fill Panes</title>
     </properties>

     <body>
         <p>
             Fill panes are similar to Box panes in that they arrange their child components in
             in a line, either horizontally or vertically.  But, unlike Box panes, they always
             fill out the available space of their container in both directions and size their
             children evenly to fill up the space.  So, in this respect a Fill pane is a simpler
             version of a Grid pane, but in only one direction.
         </p>

         <p>
             Fill panes support some styles that allow a caller to customize the arrangement
             of child components:
         </p>

         <ul>
             <li>
                 "padding" - the amount of space the fill pane reserves around the perimeter of the
                 container.
             </li>
             <li>
                 "spacing" - the amount of space the fill pane inserts between components.
             </li>
         </ul>

         <application class="org.apache.pivot.wtk.ScriptApplication"
             width="460" height="310">
             <libraries>
                 <library>core</library>
                 <library>wtk</library>
                 <library>wtk-terra</library>
                 <library>tutorials</library>
             </libraries>
             <startup-properties>
                 <src>/org/apache/pivot/tutorials/layout/fill_panes.bxml</src>
             </startup-properties>
         </application>

         <p>
             The BXML source for the application is shown below:
         </p>

         <source type="xml" location="org/apache/pivot/tutorials/layout/fill_panes.bxml">
             <![CDATA[
             <layout:FillPanes title="Fill Panes" maximized="true"
                 xmlns:bxml="http://pivot.apache.org/bxml"
                 xmlns:layout="org.apache.pivot.tutorials.layout"
                 xmlns="org.apache.pivot.wtk">
                 <TablePane>
                     <columns>
                         <TablePane.Column width="300"/>
                         <TablePane.Column width="-1"/>
                     </columns>

                     <TablePane.Row height="1*">
                         <Border styles="{padding:6, color:'#999999'}">
                             <FillPane bxml:id="fillPane">
                                 <PushButton buttonData="One"/>
                                 <PushButton buttonData="Two"/>
                                 <PushButton buttonData="Three"/>
                             </FillPane>
                         </Border>

                         <BoxPane orientation="vertical" styles="{padding:6, spacing:8}">
                             <bxml:define>
                                 <ButtonGroup bxml:id="orientation"/>
                             </bxml:define>

                             <Label text="Orientation" styles="{font:{bold:true}}"/>
                             <RadioButton bxml:id="horizontalOrientationButton" buttonData="Horizontal" buttonGroup="$orientation" selected="true"/>
                             <RadioButton bxml:id="verticalOrientationButton" buttonData="Vertical" buttonGroup="$orientation"/>

                         </BoxPane>
                     </TablePane.Row>
                 </TablePane>
             </layout:FillPanes>
             ]]>
         </source>

         <p>
             The Java source is as follows. Most of the code is simply event handling logic that
             responds to changes in the radio buttons' state:
         </p>

         <source type="java" location="org/apache/pivot/tutorials/layout/FillPanes.java">
             <![CDATA[
             package org.apache.pivot.tutorials.layout;

             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.ButtonStateListener;
             import org.apache.pivot.wtk.Checkbox;
             import org.apache.pivot.wtk.FillPane;
             import org.apache.pivot.wtk.Orientation;
             import org.apache.pivot.wtk.RadioButton;
             import org.apache.pivot.wtk.Window;

             public class FillPanes extends Window implements Bindable {
                 private FillPane fillPane = null;
                 private RadioButton horizontalOrientationButton = null;
                 private RadioButton verticalOrientationButton = null;

                 @Override
                 public void initialize(Map<String, Object> namespace, URL location, Resources resources) {
                     fillPane = (FillPane)namespace.get("fillPane");
                     horizontalOrientationButton = (RadioButton)namespace.get("horizontalOrientationButton");
                     verticalOrientationButton = (RadioButton)namespace.get("verticalOrientationButton");

                     ButtonStateListener buttonStateListener = new ButtonStateListener() {
                         @Override
                         public void stateChanged(Button button, Button.State previousState) {
                             updateFillPaneState();
                         }
                     };

                     horizontalOrientationButton.getButtonStateListeners().add(buttonStateListener);
                     verticalOrientationButton.getButtonStateListeners().add(buttonStateListener);

                     updateFillPaneState();
                 }

                 private void updateFillPaneState() {
                     Orientation orientation = null;
                     if (horizontalOrientationButton.isSelected()) {
                         orientation = Orientation.HORIZONTAL;
                     } else if (verticalOrientationButton.isSelected()) {
                         orientation = Orientation.VERTICAL;
                     }

                     if (orientation != null) {
                         fillPane.setOrientation(orientation);
                     }
                 }
             }
             ]]>
         </source>
     </body>
 </document>
	<?xml version="1.0" encoding="UTF-8"?>
	<!--
	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.
	-->

	<document id="fill-panes">
	<properties>
	<title>Fill Panes</title>
	</properties>

	<body>
	<p>
	Fill panes are similar to Box panes in that they arrange their child components in
	in a line, either horizontally or vertically. But, unlike Box panes, they always
	fill out the available space of their container in both directions and size their
	children evenly to fill up the space. So, in this respect a Fill pane is a simpler
	version of a Grid pane, but in only one direction.
	</p>

	<p>
	Fill panes support some styles that allow a caller to customize the arrangement
	of child components:
	</p>

	<ul>
	<li>
	"padding" - the amount of space the fill pane reserves around the perimeter of the
	container.
	</li>
	<li>
	"spacing" - the amount of space the fill pane inserts between components.
	</li>
	</ul>

	<application class="org.apache.pivot.wtk.ScriptApplication"
	width="460" height="310">
	<libraries>
	<library>core</library>
	<library>wtk</library>
	<library>wtk-terra</library>
	<library>tutorials</library>
	</libraries>
	<startup-properties>
	<src>/org/apache/pivot/tutorials/layout/fill_panes.bxml</src>
	</startup-properties>
	</application>

	<p>
	The BXML source for the application is shown below:
	</p>

	<source type="xml" location="org/apache/pivot/tutorials/layout/fill_panes.bxml">
	<![CDATA[
	<layout:FillPanes title="Fill Panes" maximized="true"
	xmlns:bxml="http://pivot.apache.org/bxml"
	xmlns:layout="org.apache.pivot.tutorials.layout"
	xmlns="org.apache.pivot.wtk">
	<TablePane>
	<columns>
	<TablePane.Column width="300"/>
	<TablePane.Column width="-1"/>
	</columns>

	<TablePane.Row height="1*">
	<Border styles="{padding:6, color:'#999999'}">
	<FillPane bxml:id="fillPane">
	<PushButton buttonData="One"/>
	<PushButton buttonData="Two"/>
	<PushButton buttonData="Three"/>
	</FillPane>
	</Border>

	<BoxPane orientation="vertical" styles="{padding:6, spacing:8}">
	<bxml:define>
	<ButtonGroup bxml:id="orientation"/>
	</bxml:define>

	<Label text="Orientation" styles="{font:{bold:true}}"/>
	<RadioButton bxml:id="horizontalOrientationButton" buttonData="Horizontal" buttonGroup="$orientation" selected="true"/>
	<RadioButton bxml:id="verticalOrientationButton" buttonData="Vertical" buttonGroup="$orientation"/>

	</BoxPane>
	</TablePane.Row>
	</TablePane>
	</layout:FillPanes>
	]]>
	</source>

	<p>
	The Java source is as follows. Most of the code is simply event handling logic that
	responds to changes in the radio buttons' state:
	</p>

	<source type="java" location="org/apache/pivot/tutorials/layout/FillPanes.java">
	<![CDATA[
	package org.apache.pivot.tutorials.layout;

	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.ButtonStateListener;
	import org.apache.pivot.wtk.Checkbox;
	import org.apache.pivot.wtk.FillPane;
	import org.apache.pivot.wtk.Orientation;
	import org.apache.pivot.wtk.RadioButton;
	import org.apache.pivot.wtk.Window;

	public class FillPanes extends Window implements Bindable {
	private FillPane fillPane = null;
	private RadioButton horizontalOrientationButton = null;
	private RadioButton verticalOrientationButton = null;

	@Override
	public void initialize(Map<String, Object> namespace, URL location, Resources resources) {
	fillPane = (FillPane)namespace.get("fillPane");
	horizontalOrientationButton = (RadioButton)namespace.get("horizontalOrientationButton");
	verticalOrientationButton = (RadioButton)namespace.get("verticalOrientationButton");

	ButtonStateListener buttonStateListener = new ButtonStateListener() {
	@Override
	public void stateChanged(Button button, Button.State previousState) {
	updateFillPaneState();
	}
	};

	horizontalOrientationButton.getButtonStateListeners().add(buttonStateListener);
	verticalOrientationButton.getButtonStateListeners().add(buttonStateListener);

	updateFillPaneState();
	}

	private void updateFillPaneState() {
	Orientation orientation = null;
	if (horizontalOrientationButton.isSelected()) {
	orientation = Orientation.HORIZONTAL;
	} else if (verticalOrientationButton.isSelected()) {
	orientation = Orientation.VERTICAL;
	}

	if (orientation != null) {
	fillPane.setOrientation(orientation);
	}
	}
	}
	]]>
	</source>
	</body>
	</document>