I recently came across this article comparing the implementation of a simple "slide gallery" application in Flash and Silverlight. I was inspired to try to replicate the application's behavior in Apache Pivot. The results of my efforts are below:

Functionally, the application is nearly identical to the Flash and Silverlight versions. On my system, it doesn't start up nearly as fast, but, once running, performance is comparable. One difference is that the horizontal slide transition used in the Pivot version doesn't support the bounce effect employed by the other two, though this could be added fairly easily.

However, the Pivot code is considerably less complex than the other two versions: the entire application was coded within a single WTKX file:

<Window title="Slide Gallery" maximized="true"
    xmlns:wtkx="http://pivot.apache.org/wtkx"
    xmlns:effects="org.apache.pivot.wtk.effects"
    xmlns="org.apache.pivot.wtk">
    <content>
        <StackPane>
            <CardPane wtkx:id="imageCardPane" styles="{selectionChangeEffect:'horizontal_slide'}">
                <ImageView image="@image1.jpg"/>
                <ImageView image="@image2.jpg"/>
                <ImageView image="@image3.jpg"/>
                <ImageView image="@image4.jpg"/>
                <ImageView image="@image5.jpg"/>
            </CardPane>
            
            <wtkx:define>
                <ButtonGroup wtkx:id="imageButtonGroup">
                    <buttonGroupListeners>
                        <wtkx:script>
                        <![CDATA[
                        function selectionChanged(buttonGroup, previousSelection) {
                            var selection = buttonGroup.getSelection();
                            if (selection != null) {
                                var index = imageButtonBoxPane.indexOf(selection);
                                imageCardPane.setSelectedIndex(index);
                            }
                        }
                        ]]>
                        </wtkx:script>
                    </buttonGroupListeners>    
                </ButtonGroup>        
            </wtkx:define>

            <BoxPane wtkx:id="imageButtonBoxPane" styles="{verticalAlignment:'bottom', padding:8}">
                <decorators>
                    <effects:FadeDecorator opacity="0.75"/>
                </decorators>
                
                <PushButton buttonData="1" toggleButton="true" buttonGroup="$imageButtonGroup" 
                    styles="@button_styles.json"/>
                <PushButton buttonData="2" toggleButton="true" buttonGroup="$imageButtonGroup" 
                    styles="@button_styles.json"/>
                <PushButton buttonData="3" toggleButton="true" buttonGroup="$imageButtonGroup" 
                    styles="@button_styles.json"/>
                <PushButton buttonData="4" toggleButton="true" buttonGroup="$imageButtonGroup" 
                    styles="@button_styles.json"/>
                <PushButton buttonData="5" toggleButton="true" buttonGroup="$imageButtonGroup" 
                    styles="@button_styles.json"/>
            </BoxPane>

            <wtkx:script>
            <![CDATA[
            imageButtonGroup.setSelection(imageButtonBoxPane.get(0));
            ]]>
            </wtkx:script>
        </StackPane>
    </content>
</Window>

The author of the original applications estimated that it took him about 40 minutes to write the Flash version and 30 minutes for Silverlight. For comparison, it took me around 20 minutes to put this version together.

So, what does this prove? Not much - it was just a fun diversion to see how implementing the application in Pivot compared to the other two platforms. Note that, although it was built against an early developer build of Pivot 1.4, it should also work with the recently released Pivot 1.3, available here.

Enjoy!

Read more from Greg Brown.