In the Live docs you might have read about Retrieve and Display Data. Here I’ve enhanced the same MXML by the following
- The LinkButton hidden until the datagrid change event is fired.
- Enabled the Data Tips for ‘Posts’ column to show tool tips text on roll over.
- Made it a scalable layout by using constraint-based layout.
Here is the MXML code, I’ve highlighted the changes by bold, compare it with the original, compile and see for your self
[tabcontent]
[/tabcontent]
<?xml version="1.0" encoding="UTF-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="feedRequest.send()" <strong>minHeight</strong><strong>="360"</strong> <strong>minWidth</strong><strong>="500"</strong>>
<mx:HTTPService id="feedRequest" url="http://weblogs.macromedia.com/mchotin/index.xml" useProxy="false"/>
<mx:Pane<strong>l left="10"</strong> <strong>top</strong><strong>="10"</strong> <strong>bottom</strong><strong>="10"</strong> <strong>right</strong><strong>="1</strong>0" layout="absolute" title="<strong>BlogReader (</strong>{feedRequest.lastResult.rss.channel.title}<strong>)</strong>">
<mx:DataGrid id="dgPosts" <strong>left</strong><strong>="20"</strong> <strong>right</strong><strong>="20"</strong> <strong>top</strong><strong>="20"</strong> <strong>bottom</strong><strong>="12</strong>5" dataProvider="{feedRequest.lastResult.rss.channel.item}<strong>"</strong> <strong>change</strong><strong>="openLinkButton.visible=tru</strong>e">
<mx:columns>
<mx:DataGridColumn headerText="Posts" dataField="title<strong>"</strong> <strong>showDataTips</strong><strong>="tru</strong>e"/>
<mx:DataGridColumn headerText="Date" dataField="pubDate"/>
</mx:columns>
</mx:DataGrid>
<mx:TextArea left="20" right="20" bottom="46" height="75" htmlText="{dgPosts.selectedItem.description}"/>
<mx:LinkButto<strong>n id="openLinkButto</strong>n" right="20" bottom="20" label="Read Full Post" click="navigateToURL(new URLRequest(dgPosts.selectedItem.link));<strong>"</strong> <strong>visible</strong><strong>="fals</strong>e"/>
</mx:Panel>
</mx:Application>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="feedRequest.send()" <strong>minHeight</strong><strong>="360"</strong> <strong>minWidth</strong><strong>="500"</strong>>
<mx:HTTPService id="feedRequest" url="http://weblogs.macromedia.com/mchotin/index.xml" useProxy="false"/>
<mx:Pane<strong>l left="10"</strong> <strong>top</strong><strong>="10"</strong> <strong>bottom</strong><strong>="10"</strong> <strong>right</strong><strong>="1</strong>0" layout="absolute" title="<strong>BlogReader (</strong>{feedRequest.lastResult.rss.channel.title}<strong>)</strong>">
<mx:DataGrid id="dgPosts" <strong>left</strong><strong>="20"</strong> <strong>right</strong><strong>="20"</strong> <strong>top</strong><strong>="20"</strong> <strong>bottom</strong><strong>="12</strong>5" dataProvider="{feedRequest.lastResult.rss.channel.item}<strong>"</strong> <strong>change</strong><strong>="openLinkButton.visible=tru</strong>e">
<mx:columns>
<mx:DataGridColumn headerText="Posts" dataField="title<strong>"</strong> <strong>showDataTips</strong><strong>="tru</strong>e"/>
<mx:DataGridColumn headerText="Date" dataField="pubDate"/>
</mx:columns>
</mx:DataGrid>
<mx:TextArea left="20" right="20" bottom="46" height="75" htmlText="{dgPosts.selectedItem.description}"/>
<mx:LinkButto<strong>n id="openLinkButto</strong>n" right="20" bottom="20" label="Read Full Post" click="navigateToURL(new URLRequest(dgPosts.selectedItem.link));<strong>"</strong> <strong>visible</strong><strong>="fals</strong>e"/>
</mx:Panel>
</mx:Application>
Leave A Comment