Flexメモ/「Flex3プログラミング入門」ざっと読み http://www.ark-web.jp/sandbox/marketing/wiki/457.html

Flexメモ/「Flex3プログラミング入門」ざっと読み

Flexについて知らなさ過ぎるので、「Flex3プログラミング入門」にざっと目を通して
何ができるものなのか把握する。

目次 †

Flexアプリのショーケースサイト、リファレンス等 †

• Flex Showcase： http://flex.org/showcase/
  • Flexサンプル多数。
• Adobe - Flexデベロッパーセンター： http://www.adobe.com/jp/devnet/flex/
  • Flex開発者向けサイト。チュートリアル、サンプル、ダウンロードなど。
• Flex 3 リファレンスガイド: http://livedocs.adobe.com/flex/3_jp/langref/

Flexアプリケーションの構成物 †

• ソースファイルはMXML + ActionScript で記述する。
• MXML --(コンパイル)--> ActionScript --> 実行ファイル：.swf
• SWC(拡張子.swc、ライブラリ、コンポーネントファイル）：コンパイル時に静的にリンクされる。
• RSL(拡張子.swc、ランタイム共有ライブラリ）：クライアントPC上にキャッシュされてアプリケーションに動的にリンクされる。

MXML, ActionScript †

• MXMLはマークアップ言語（XML）の一種。（拡張子.mxml)
  • <>タグ。XHTMLなどに似ている。
• ActionScript（拡張子.as)：制御構造を記述
  • ECMAScriptをベースにしたプログラミング言語。
  • JavaScriptに似ている。
  • MXML内に直接記述するか、外部ファイルとしてインポートされる

コンポーネント †

• コンポーネント（UIコンポーネントなど再利用可能な機能プログラム）
• ライブラリ（関数レベルの機能集合）
  • クラスライブラリ （API）
  • ActionScriptクラスライブラリ (Adobeが提供)
  • Flex 3 リファレンスガイド: http://livedocs.adobe.com/flex/3_jp/langref/

    ActionScript™ 言語で使用されるすべてのエレメントのシンタックスおよび使用方法に
    関する情報が記載されています。Adobe が正式にサポートしている Adobe® Flash®
    Player および Adobe® AIR™ のすべてのエレメントについて説明しています。

アプリケーション実行 †

• Flexアプリケーションの実行は Flash Player。エンジンはAVM（ActionScript Virtual Machine）。
  • 2006年 AVM2ソースコードを公開
  • Mozilla Foundationと共同で開発を進める方針を発表（Tamarinプロジェクト）

サーバとの連携 †

[[[[[[[[[[[ Flash Player ]]]]]]]]]]]]]]]
↓↑　           ↓↑　　　　　 ↓↑
[[[[[[[[[[[ Webサーバ ]]]]]]]]]]]]]]]]]]
↓↑　　　　　　　　　　　  ↓↑　　　　
XML/HTTP　　　　　　　　Live Cycle Date Services ES
REST　　　　　　　　　　  Java EEアプリケーションサーバ
SOAP Webサービス

• Live Cycle Date Services ES(LCDS)はサーバ上のJavaクラスメソッドを呼び出すことができる。協力なデータ処理やメッセージング機能を提供。
  • MS Windows 2000 Server、 Win XP Professional、Red Hat等で動作
  • FlexクライアントとJMS（Java Message Service）間のメッセージ送信をサポート
  • リアルタイムチャット、サーバからクライアントへメッセージ配信を行うアプリケーションが実現可能になる
  • リモートプロシージャコールサービル： サーバ-クライアント間の非同期型通信を提供する。HTTP POST/GET、SOAPプロトコル（Webサービス）、サーバ上のJavaクラスへのアクセスを実現する。
• データマネージメントサービル
  • Flexクライアント-サーバ間で同期されたデータ処理を可能にする。リアルタイムでデータ同期を行う、クライアント→サーバにデータ同期をかけるアプリケーションが実現可能になる。

Flexアプリケーションのビルド †

2方法ある

• Flex SDKのコマンドラインコンパイラからビルドする
• Flex Builder（Flex SDK同梱）上からビルドする

開発ツール †

• Flex SDK：Adobe提供の無償キット。テキストエディタで開発
  • アプリケーションコンパイラ（mxmlc）：SWFを生成
  • コンポーネントコンパイラ(compc)：SWCやRSLを生成
• Flex Builder：Exlipseベースの統合開発環境。有償。ソースエディタ、GUIベースの開発ツール、デバッガを有する

MXMLの基本 †

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
     <!-- コンポーネントの配置とか記述 -->
        <mx:Script>
            <![CDATA[
                // ActionScriptコードの記述
            ]]>
        </mx:Script>
        ....
</mx:Application>

• MXMLソース内にActionScriptコードを書く
  • MXMLタグ内にインラインで書く

    <mx:Button click="mx.controls.Alert.show('ほげほげ')" />

  • <mx:Script>タグ内にまとめて書く

    <mx:Script>
         <![CDATA[
              private function Button_click(): void {
                  mx.controls.Alert.show('ほげほげ');
              }
         ]]>
    </mx:Script>

Flexプログラミングの基本概念 †

イベント処理 †

• ユーザイベント（ click, doubleClick, mouseDown等）とシステムイベント（applicationComplete, error等）の2種類ある

• イベントハンドラ（イベントリスナー）の作成

  <mx:Script>
       <![CDATA[
           import flash.events.MouseEvent; ←flash.eventsパッケージのMouseEventクラス使うよ
           import mx.controls.Alert; ← mx.controls パッケージのAlert使うよ
           private function myEventHandler( event:MouseEvent ): void {
               mx.controls.Alert.show('ほげほげ');
           }
      ]]>
  </mx:Script>

• MXMLソース内から呼び出す

  <mx:Button label="クリックしてください" click="myEventHandler( event )" />

  • ASコード直書き（インラインイベントハンドラ）という手もある
  • ActionScriptでイベントハンドラを登録するには addEventListener()関数を使う

バインディング †

• コンポーネント間で、バインディングの設定ができる。source側の値が変更されると、destination側の値に自動反映される。
• 記述方法は {}によるか、タグで書くの2種類ある

  <mx:TextInput id="sourceText" text="文字を入力してください" /> ←こっちの結果が
  <mx:label text="{sourceText.text}" />　　←こちらに反映される

アイテムレンダラー †

（よくわからんので飛ばし）

Flexコンポーネント †

• カスタムコンポーネント （自分で作るやつ）
• Flexビジュアルコンポーネント（あるいは単にコンポーネント）

Flexビジュアルコンポーネント †

• ボタン、ラベルなど画面に配置する要素
• ビジュアルコンポーネントの配置＝画面のデザインということ

== (次回に続く) ==

投稿者八木 | パーマリンク

|

tag: Flex

Menu

• ピコ勉強会
• 企画メモ＆Tips
• Zen Cart
• Movable Type

Movable Type用プラグイン Aシリーズ

ECサイト構築 Zen Cartハイエンド

Tag

最新の20件

アークウェブビジネスブログ最新記事

menu edit