PHP Québec 2008 - Introduction à Flex

  • 863 views
Uploaded on

 

More in: Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
    Be the first to like this
No Downloads

Views

Total Views
863
On Slideshare
0
From Embeds
0
Number of Embeds
0

Actions

Shares
Downloads
0
Comments
0
Likes
0

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. Introduction à Flex PHP Québec - 3 avril 2008 Thursday, January 14, 2010
  • 2. Plan Qu’est-ce que Flex? Exemples (Amazon, PHP) Moteurs de recherche Thursday, January 14, 2010
  • 3. Qu’est-ce que Flex? Un Framework basé sur Flash ActionScript 3.0 MXML Parfait pour les données Thursday, January 14, 2010
  • 4. Hello World <mx:Model id="movies" source="disneymovies.xml" /> <mx:List dataProvider="{movies.movie}" labelField="title" /> <catalog> <movie title="Aladdin"></movie> <movie title="Balto"></movie> [...] </catalog> Thursday, January 14, 2010
  • 5. Thursday, January 14, 2010
  • 6. Data Binding mise à jour de la variable Binding élément élément visuel élément visuel visuel Thursday, January 14, 2010
  • 7. Sources de données Array/Object Fichiers XML REST / SOAP Data Services (BlazeDS) Thursday, January 14, 2010
  • 8. Exemple Amazon <mx:HTTPService id="search" url="http://ecs.amazonaws.com/onca/xml" /> private function init():void { var params:Object = { Service: "AWSECommerceService", AWSAccessKeyId: "07AJHV55CZA8XD0JPN82", Operation: "ItemSearch", SearchIndex: "Books", Title: "PHP" } search.send(params); } Thursday, January 14, 2010
  • 9. Exemple Amazon <mx:List dataProvider=" {search.lastResult.ItemSearchResponse.Items.Item}" labelFunction="booklabel" /> private function booklabel(item:Object):String { return item.ItemAttributes.Title + " - " + item.ItemAttributes.Author; } Thursday, January 14, 2010
  • 10. Thursday, January 14, 2010
  • 11. Visuel [Bindable] private var mergedResult:ArrayCollection = new ArrayCollection; <mx:TileList dataProvider="{mergedResult}" itemRenderer="renderer" /> <mx:VBox> <mx:Image source="{data.imgSrcMedium}"/> <mx:Text text="{data.title}" fontSize="12" fontWeight="bold" /> <mx:Text text="{data.author}" /> </mx:VBox> Thursday, January 14, 2010
  • 12. Thursday, January 14, 2010
  • 13. Drag & Drop <mx:TileList dataProvider="{mergedResult}" itemRenderer="renderer1" dragEnabled="true" /> <mx:List dropEnabled="true" itemRenderer="renderer2" /> <mx:VBox> <mx:Image source="{data.imgSrcSmall}" /> <mx:Text text="{data.title}" /> </mx:VBox> Thursday, January 14, 2010
  • 14. Thursday, January 14, 2010
  • 15. Communiquer avec PHP $xml = ''; $sql = 'SELECT * FROM gps'; $result = mysql_query($sql); while ($gps = mysql_fetch_assoc($result)) { $xml .= "<item manufacturer="{$gps['manufacturer']}" model="{$gps['model']}" bluetooth="{$gps['bluetooth']}" touchscreen="{$gps['touchscreen']}" audioguide="{$gps['audioguide']}" lcdw="{$gps['lcdw']}" lcdh="{$gps['lcdh']}" />"; } echo "<gps>{$xml}</gps>"; Thursday, January 14, 2010
  • 16. Communiquer avec PHP private function init():void { xml.send(); } <mx:HTTPService id="xml" url="http://localhost:8888/FlexIntro/ example05.php" /> <mx:List id="list" dataProvider="{xml.lastResult.gps.item}" labelField="model"/> Thursday, January 14, 2010
  • 17. Communiquer avec PHP <mx:Form> <mx:FormItem label="Manufacturer"> <mx:ComboBox dataProvider="{manufacturers}" selectedIndex="{int(list.selectedItem.manufacturer)}"/> </mx:FormItem> <mx:FormItem label="Model"> <mx:TextInput text="{list.selectedItem.model}"/> </mx:FormItem> <mx:FormItem label="Features"> <mx:CheckBox label="Bluetooth Data Connection" selected="{list.selectedItem.bluetooth == 1}"/> [...] </mx:FormItem> <mx:FormItem label="LCD Resolution"> <mx:HBox> <mx:NumericStepper value="{list.selectedItem.lcdw}"/> [...] </mx:HBox> </mx:FormItem> </mx:Form> Thursday, January 14, 2010
  • 18. Thursday, January 14, 2010
  • 19. Sauvegarder dans BD $sql = "UPDATE gps SET manufacturer="{$_POST['manufacturer']}", model="{$_POST['model']}", bluetooth="{$_POST['bluetooth']}", touchscreen="{$_POST['touchscreen']}", audioguide="{$_POST['audioguide']}", lcdw="{$_POST['lcdw']}", lcdh="{$_POST['lcdh']}" WHERE id="{$_POST['id']}" "; $response = mysql_query($sql) ? 'ok' : 'error'; echo "<response>{$response}</response>"; Thursday, January 14, 2010
  • 20. Sauvegarder dans BD <mx:HTTPService id="saveScript" url="http://localhost:8888/FlexIntro/ example06.php" /> <mx:Button label="Save" click="save()"/> private function save():void { list.selectedItem.manufacturer = cboManufacturer.selectedIndex; list.selectedItem.model = txtModel.text; [...] var params:Object = { id: list.selectedItem.id, manufacturer: list.selectedItem.manufacturer, [...] }; saveScript.method = "POST"; saveScript.send(params); } Thursday, January 14, 2010
  • 21. Thursday, January 14, 2010
  • 22. Avantages Puissant et Flash Flash Flash Flash Player 6 Player 7 Player 8 Player 9 flexible US/ 99.0% 99.0% 98.5% 96.8% Canada Populaire Europe2 98.1% 98.1% 97.6% 94.3% selon Adobe SDK et compilateur MXML gratuits “AIR” donne accès au disque dur Thursday, January 14, 2010
  • 23. Ressources Documentation - http://www.adobe.com/ support/documentation/en/flex/ Tutoriels - http://labs.adobe.com/ technologies/flexbuilder2/tutorials/ Blog - http://annafilina.com Thursday, January 14, 2010