<?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>
