<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
width="300" height="250" viewSourceURL="srcview/index.html">
<fx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
[Bindable]private var results:ArrayCollection = new ArrayCollection([
{name: "ketchup", latin:"splattis completus"},
{name: "mustard", latin:"musto tardis"},
{name: "mayonnaise", latin:"viscous raweggus"},
{name: "hot sauce", latin:"hurtsogoodus"},
{name: "pickle", latin:"gerkin entirus"},
{name: "relish", latin:"gerkin destructus"},
{name: "butter", latin:"fattus perfectus"},
{name: "BBQ sauce", latin:"smokus weeatus"},
]);
private function runSearch():void
{
currentState = "resultsScreen";
}
]]>
</fx:Script>
<s:states>
<s:State name="searchScreen"/>
<s:State name="resultsScreen"/>
</s:states>
<s:transitions>
<s:Transition toState="resultsScreen">
<s:Sequence>
<s:Fade target="{searchLabel}"/>
<s:Move targets="{[searchInput,searchButton]}"/>
<s:AddAction target="{searchResults}"/>
<s:Fade target="{searchResults}"/>
</s:Sequence>
</s:Transition>
</s:transitions>
<s:Label id="searchLabel" x="107" y="66" text="Food Item"
fontSize="18" fontWeight="bold"
includeIn="searchScreen"/>
<s:TextInput id="searchInput" x="86" y="91"
x.resultsScreen="84" y.resultsScreen="10"/>
<s:Button id="searchButton" x="115" y="121" label="Search"
enabled="{searchInput.text != ''}"
click="runSearch()"
x.resultsScreen="220" y.resultsScreen="10"/>
<mx:DataGrid id="searchResults" includeIn="resultsScreen"
x="10" y="38" width="280" height="202"
dataProvider="{results}">
<mx:columns>
<mx:DataGridColumn headerText="Common Name" dataField="name"/>
<mx:DataGridColumn headerText="Latin Name" dataField="latin"/>
</mx:columns>
</mx:DataGrid>
</s:Application>