Dreamer’s Blog ドリーマーさんのブログ

又看到一篇不错的Flex初级教程，翻译了过来。も参照し良いFlexの主なガイド、翻訳者です。 翻译已经经过作者Marco Casario的同意，原文版权归原作者所有，译文版权归Dreamer所有。著者の後に翻訳されマルコcasarioの同意を得、元のテキストに属してオリジナルの著者、ドリーマー：すべてに属しています。 此文未经同意，谢绝转载。この記事は同意せず、再版を拒否しています。

英文原文：http://mxdj.sys-con.com/read/276919_1.htm英語のテキスト： http://mxdj.sys-con.com/read/276919_1.htm
作者： Marco Casario著者： マルコcasario

译者：Dreamer翻訳：ドリーマー

Flex应用程序可能有复杂的结构但它们通常都是由多个MXML，Actionscript 以及CSS文件组成。 Flexアプリケーション年5月には複雑な構造しかし、彼らは通常、いくつかのmxmlされ、ドキュメントのActionScriptとCSS組成します。

在单个文件里编写整个程序不是一个最佳实践。用意されたドキュメントを1つのプロセス全体でのベストプラクティスではない。 那样会使代码难以维护和重用，而且程序没有被架构成逻辑上的各个部分。を維持するのは難しいとのコードの再利用、および手続きをされていない論理構造は、様々な部分です。

Flex允许开发者将一个工程分成外部的模块，创建分离的MXML文件并且单独维护它们。フレックスにより、開発者をプロジェクトには、外部モジュールに分かれて、 mxmlの分離を個別に作成するドキュメントおよび保持します。 将Flex程序分离成各个逻辑模块有很多好处。 Flexのプログラムは別に分けられるロジックモジュールには多くの利点があります。 它允许开发小组独立地开发和调试单个模块，模块中的错误和功能可以被独立出来。これにより、グループの発展に独立した1つのモジュールを開発し、デバッグするには、ミスは、モジュール、および関数を使えば独立しています。 这使得代码变得容易维护，也提高了代码在多个应用程序间的重用性。これを簡単に維持するコードでは、コードでは、多くのアプリケーションも増加の間に再利用します。

每个MXML文件是一个MXML组件，但是只有主MXML程序可以加载外部组件。 mxml MXMLコンポーネントを各文書には、 mxmlの主な手続きだけ外付け部品を読み込むことです。 事实上一个应用程序中只能有一个Application 标签，其它所有都是MXML组件。アプリケーションでアプリケーションを実際にすることもでき、 1つのラベルにのみ、他のすべてのコンポーネントがmxmlです。

为了设计一个MXML组件，需要创建一个MXML文件。 MXMLコンポーネントを設計するためには、 mxmlドキュメントを作成する必要があります。 这个文件的根标签不是Application而是一个组件标签（比如VBox，Panel，Canvas，Button，DataGrid等等），而且根标签中需要声明命名空间http://www. adobe .com/2006/mxml 。このドキュメントではないのルートにラベルのアプリケーションではなく、コンポーネントのラベル（例えば、車速計VBOX 、パネル、キャンバス、ボタンを押すと、データグリッドなど） 、およびラベルのニーズに声明のルーツ@命名空間です。 .com/2006/mxmlはAdobeです。

下面的代码展示了一个简单的叫做custDataGrid.mxml 的MXML组件，它由一个用来存储数据的DataGrid组成。ディスプレイの下に、単純なコードと呼ばれるcustdatagrid.mxml 、 MXMLコンポーネント、使用されるデータを格納するデータグリッドコンポーネントの1つです。

根标签是一个简单的VBox组件并且其中声明了xmlns:mx="http://www.adobe.com/2006/mxml"。世代-ラベルは、単純なステートメントの車速計VBOXシステムコンポーネントとのxmlns ： MXの= " http://www.adobe.com/2006/mxml "です。 一旦创建了外部模块，主程序就可以像下面一样调用这个MXML组件：一度外部モジュールを作成する場合、これはメインのプログラムを呼び出すことが可能と同じ下MXMLコンポーネント：

主程序添加了一个新的XML命名空间并使用一个包名来表示在一个文件夹中定义的所有组件：メインプログラムを追加するに新しいXML名前空間とパッケージの名前を使用して、フォルダ内のすべてのコンポーネントの定義には：

“cust”命名空间指向”comp”文件夹中的MXML组件，实际上如果是最佳实践所有的组件都应当被保存在一个子目录下。を" cust "命名スペースで開催された"のCOMP "フォルダ内のMXMLコンポーネントは、実際には、ベストプラクティスのすべてのコンポーネントの場合はサブディレクトリに格納されています。

使用组件和使用其它MXML标签一样，唯一不同的是不再使用”mx”前缀而是使用自定义前缀：使用するの他のコンポーネントとMXMLタグの使用は、使用されなくなった唯一の違いの" MX "を使用する接頭辞しかし、カスタムの接頭辞：

注意MXML标签的名字对应着这个组件的文件名。 mxmlの注意をラベルに対応しているコンポーネントの名前のファイル名を入力します。

紧耦合组件与松耦合组件 疎結合のコンポーネントコンポーネントと緊密に結合

为了使组件在程序中可以配置和重用，你可能会想要创建可以接受属性，创建方法以及分派事件的MXML组件。で手続きを行うためにコンポーネントを再利用できるような構成と、受け入れのプロパティを作成することができますし、分布を作成する方法を、事件のMXMLコンポーネントです。 为了做到这样，组件必须不依赖于特定的程序（紧耦合），包括它们的变量名或标签实例的名字。これを行うには、特定のコンポーネントに依存して具体的な手順必要があります（密結合）など、彼らの名前を変数名やラベルの例です。 紧耦合情况下如果程序或者组件的代码改变了，相应的代码就不能再工作，我们必须修改紧耦合的组件来相应这些变化。密結合の手続きの状況やコンポーネントの場合は、コードが変更されると、仕事には対応するコードはもはや、私たちを改正する必要がタイトなカップリングのコンポーネントに対応して、これらの変更を適用します。

一种更清晰也更好的方式是开发松耦合的组件，它可以分派传播返回数据给程序的事件并且包含一些属性使得可以从程序传送信息给它。を明確に、より良い方法は、疎結合のコンポーネントの開発、それを割り当てることができるの普及に復帰するとのデータを処理してイベントには、いくつかの属性は、そのプロセスで作られてメッセージを送信してください。

这种方式可以让你像创建“黑盒子”一样创建MXML组件，并且有以下好处：これにより、あなたを作成するとして、 "ブラックボックス"のようにMXMLコンポーネント、およびには、次のような利点：

•它们容易重用和维护•除了内部的组件它们不了解其它的东西•它们不依赖于一个变量名和标签实例的名字 •彼らは簡単に再利用やメンテナンス•し、内部の部品に加えて、他のことを理解していない•に依存していない変数名とラベルの名前を例として

如我们所说的那样，为了创建一个松耦合的组件我们需要属性来存储信息，需要一个事件模型来分派包含有返回数据的事件。として私たちによると、疎結合のコンポーネントを作成するために私たちの属性を格納する必要がある情報については、イベントモデルの必要性を割り当てるにはデータを省略しているイベントが含まれています。

属性经常在ActionScript中定义（尽管你可以在MXML中定义它们）并且放在一个<mx:Script>块中： ActionScriptのプロパティを頻繁に定義されている（ただし、それらを定義することができますmxml ）と<mx:スクリプトをブロックする：

定义MXML组件的方法也是一样： MXMLコンポーネントのメソッドの定義は、同じ：

在下面的例子中，组件定义了一个作为DataGrid的dataProvider的属性和一个返回字符串的方法。以下の例では、コンポーネントの定義として、 DataProviderのデータグリッドのプロパティを返すと文字列とメソッドを使用します。 下面是custDataGrid.mxml 文件的全部代码：以下はドキュメントの完全なcustdatagrid.mxmlコード：

Flex 2文档中的声明 ：在<mx:Script>标签中声明的公有变量或set函数会是这个组件的一个属性。 Flexのドキュメントは声明の中で2 ： <mx:スクリプト]タブで、公共のステートメントまたは関数は、次のコンポーネントに設定される変数の属性を設定します。 <mx:Script>标签中的公有函数会是组件的一个方法。 <mx:script> ]タブで、公共の機能はコンポーネントとしての道です。

我们可以在主程序文件中访问组件的方法或者传值给组件的属性：のドキュメントをすることができるようにする方法はメインのプログラムのコンポーネントまたはコンポーネントのプロパティの値をして：

在主程序中我们创建了一个叫做”myData”的ArrayCollection变量，我们可以通过下面的方法在MXML组件标签声明中将它传递给组件：は、メインプログラムは、私たちを作成したと呼ばれる" mydata " arraycollection変数を、私たちはMXMLコンポーネントを通じて、以下の方法を記載されラベリング声明で、それに渡されたコンポーネント：

我们用来展示自定义组件中定义的属性的Flex数据绑定机制可以利用数据绑定特性。私たちの表示に使用されるコンポーネントのカスタマイズの属性を定義については、 Flexのデータバインディングメカニズムを使用してデータバインディングの特性です。 ”lista”变量是custDataGrid组定义组件的一个公有变量，所以我们将它写在custDataGrid标签声明中。 "リスト" custdatagridグループでは変数のコンポーネントは、パブリック変数の定義をするので、私たちは、 custdatagrid label文を書こうとしています。

类似地，也可以创建一个数据绑定调用自定义组件中的一个方法：同様に、データバインディングを作成することもできます。カスタムコンポーネントをコールする方法：

Label控件的text属性将接收自定义组件custDataGrid的公有方法返回的文本： Labelコントロールのテキストの属性を受け取る方法custdatagridカスタマイズコンポーネントを省略して、国民のテキスト：

设计一个松耦合组件的最后一步是处理包含返回数据的事件的分派。のデザインを疎結合のコンポーネントを、最後のステップは、データを省略しているイベントを含める割り当てられています。 每个自定义MXML组件都可分派事件，事件可以通过三个简单的步骤自定义：各カスタムMXMLコンポーネントに分散すること、 3つのイベントを通じて簡単な手順を実行できるカスタム：

•使用[Event]元数据标签•创建一个事件对象•分派事件并创建一个函数来处理该事件 •使用する[イベント]メタデータタグを作成してイベントオブジェクト• •割り当てられた関数を作成するイベントや事件に対処するには

[Event]元数据标签定义了组件可以分派的事件。 [イベント]メタデータラベルのコンポーネントに割り当てることが可能で定義されて、事件のです。 可以在一个ActionScript类中包定义之后类定义之前声明[Event]元数据标签： ActionScriptのは、特定の定義にカテゴリ分類した後で定義されてパッケージの前に声明[イベント]メタデータラベル：

或者在MXML文件中的<mx:Metadata>标签中： mxmlは、文書または<mx: metadata> ]タブ：

一旦[Event]元数据标签创建，组件就可以使用dispatchEvent()方法来分派该事件。一度[イベント]メタデータタグを作成し、コンポーネントを使用dispatchEvent （ ）メソッドを配布する事件です。 dispatchEvent()方法将事件对象作为参数，如下面的代码中所示： dispatchEvent （ ）メソッドのパラメータとしてイベントオブジェクトに示すように、次のコードは：

我们来修改一下custDataGrid.mxml文件，使其可以在用户点击DataGrid中一项的时候分派一个事件。私たちcustdatagrid.mxmlを改正し、ドキュメントを行うことができますが、ユーザーがクリックするデータグリッド内の時間に割り当てられたイベントです。 主程序将处理自定义组件触发的事件并在一个TextArea控件中添加一些文字。以来、メインプログラムでは、アドレスの定義されたイベントをトリガするコンポーネントのtextareaを制御するいくつかのテキストを追加します。

使用Flex Builder 2打开custDataGrid.mxml 并添加[Event]元数据标签： Flex Builder 2のcustdatagrid.mxmlの使用を開き、追加[イベント]メタデータラベル：

[Event]元数据标签定义了一个普通Event类型的&#34;changeBlog&#34;事件并且将这个事件设为公有的，这样MXML编译器就会发现它。 [イベント]メタデータラベルイベントの定義を、共通のタイプの" changeblog "今回の事件とは、公共のイベントを設定、このようなmxmlコンパイラは見つけることです。

当DataGrid的change事件被触发时这个事件就会被分派： DataGridの事件の時に変更される今回の事件のきっかけに割り当てられたとき：

正如你看到的那样，&#34;changeHandler&#34;函数简单地执行了dispatchEvent()方法：見て分かるように、 " changehandler "を実装するの簡単な関数をdispatchevent （ ） ：

主程序通过使用<mx:Script>块中定义的事件处理函数来处理自定义MXML组件所触发的事件：メインプログラムを使用したスクリプトブロックを<mx:すると、関数の定義に事件に対処するには、カスタムMXMLコンポーネントによって誘発されたイベント：

custDataGrid组件触发&#34;changeBlog&#34;事件并将它与一个事件处理函数相关联： custdatagridコンポーネントトリガー" changeblog "事件とするには、関数に関連付けられて事件：

changeBlogHandler函数将事件对象作为一个参数并在TextAream控件中打印了一个简单的文本： changebloghandlerイベントオブジェクトとしての役割を果たすのパラメータには、コントロールとtextareamを印刷するに単純なテキスト：

注意使用事件对象的event.type 会返回事件触发者的类型（这个例子中会返回changeblog ）。注目event.typeを使用してイベントオブジェクトに復帰することを誘発するタイプの事件（この例に復帰することをchangeblog ） 。

注意 ：Flex Builder 2会自动找到在组件中自定义事件的引用并使用显示代码提示显示它： 注： Flex Builder 2のカスタムコンポーネントが自動的に見つけるには、事件のコードを使用すると引用してヒント：

尽管我们可以看到为松耦合组件创建一个自定义事件是多么简单，但是如果我们想要发送数据给这个自定义事件，这种方式也会有一些限制。我々が目にするものの疎結合のコンポーネントを作成するにカスタムケースは非常に簡単ですが、データを送信したい場合、カスタム、この方法にはいくつかの制限があります。 实际上flash.events.Event类不允许开发者向其添加属性。実際には許可されませんflash.events.eventカテゴリを追加する開発者の属性を設定します。

实际上我们分派事件只是为了通知在自定义MXML组件中有一些事情发生了。実際には、私たちにのみ配布させてその事件のカスタムMXMLコンポーネントでは、多くのことが起こった。 但是如果我们需要发送复杂的数据给一个自定义事件的时候要怎么办呢？しかし、もし私たちを複雑なデータを送信する必要が事件をどのようにカスタムときにこれを行うに»

不用担心。心配しないでください。 我们可以通过在ActionScript中创建自定义事件类来实现！でActionScriptの私たちを作ることもできますカスタムイベントは、カテゴリを達成するために！ 我将会通过一个例子向你展示如何开发自定义事件类。私は経由での例を表示するカスタムイベントを開発する方法をカテゴリをクリックします。

在ActionScript中创建自定义事件类来发送复杂数据 ActionScriptのカスタムイベントの作成には、複雑なデータを送信するカテゴリ

使用Flex可以创建一个使用自定义类型的事件对象的自定义事件。フレックスの使用を使用するカスタムの種類のイベントを作ることもできますカスタムイベントオブジェクトです。 只需要创建一个扩展自Event类的子类然后向其中添加属性。のみを作成する必要がある種の拡大以来、イベントのクラスと属性を追加するにはどのします。 不要忘了扩展自既有Flex类的自定义组件会继承基类的所有事件。を展開することを忘れないよう、既存のFlexコンポーネントのすべてのカスタム基底クラスを継承するイベントです。

要创建一个自定义类我们需要创建一个扩展自flash.events.Event的ActionScript类，这个类将作为所有事件对象的基类。カスタムカテゴリを作成するに私たちの拡張を作成する必要がflash.events.event以来、 ActionScriptのクラスには、そのオブジェクトのすべてのイベントとしてカテゴリをクリックします。 接下来，为了调用父类的构造方法并将事件类型传给它，我们要调用super()方法。その後、父のように建設するために呼び出すメソッドとの種類のイベント渡すことは、私たちを呼び出すにはスーパー（ ）メソッドを使用します。 我们还需要覆写&#34;clone()&#34; 方法，通过设定type属性和其它一些属性来返回事件对象的一个拷贝。また、オーバーライドする必要がある"クローン（ ） "メソッドは、いくつかの属性を設定するタイプと他の属性を返すのコピーをして、イベントオブジェクトを作成します。

为了从自定义组件中分派一个新的事件，我们创建了这个自定义类的一个实例并传送属性值给它。カスタマイズしたコンポーネントを配布するために、新しい事件は、私たちの定義を作成して以来、このカテゴリの一例とプロパティの値を送信してください。

现在我会用一个例子来说明这种方式。私は今すぐこのアプローチを使用する例を説明する。 我们创建了一个简单的Blog阅读器，它允许用户使用下拉列表框从Blog列表中选择一个。を作成し、簡単なブログ読者は、これにより、ユーザを使用してドロップダウンリストボックスのリストから、ブログを選択します。 这个程序由2个MXML组件组成，这两个组件是一个用来显示日志内容的DataGrid以及一个含有Blog列表下拉列表框。この手順を実行される2つのコンポーネントをmxml 、これらの2つのコンポーネントは、ログを表示するには、 Blogのコンテンツは、データグリッドやリストを表示し、ドロップダウンリストボックスを含む。

我们将从一个自定义事件类（它被保存为&#34;evtClass.as&#34;，并放在了”com”文件夹里）开始，它接受一个简单字符串属性：カスタムイベントのカテゴリは、我々は（として保存されては、 " evtclass.as "とし、 " com "などのフォルダ）の受け入れに関しては、単純な文字列の属性：

象我们之前说的那样，这个类扩展自flash.events.Event类，调用了super()方法并且覆写了clone()方法。前に私たちによると、カテゴリの拡張として、このカテゴリにflash.events.eventて以来、スーパーと呼ばれる（ ）メソッドをオーバーライドするクローン（ ）メソッドを使用します。

现在，在Flex Builder 2中创建一个组件(File > New > MXML Component)并保存为custBlogList.mxml。今すぐは、 Flex Builder 2のは、作成されたコンポーネント（ファイル" >新規" > mxmlコンポーネント）とcustbloglist.mxmlとして保存することです。 这个组件包含有一个下拉列表框（ComboBox）并且它的dataProvider是一个ArrayCollection对象。のコンポーネントには、ドロップダウンリストボックス（コンボボックス）とそのarraycollection DataProviderのは、オブジェクトを作成します。

我们使用了[Event]元数据标签定义了这个MXML组件可以分派的事件。私たちを使用して[イベント]メタデータの定義を、このMXMLコンポーネントのラベルの場合に割り当てることが可能です。 赋给type属性的值就是我们的自定义事件类： type属性の値を割り当てることが私たちのカスタムイベント作成カテゴリ：

一旦用户在下拉列表框中选择了一个Blog，change事件就会被触发并且changeHandler()会被调用：一度、ユーザーは、ドロップダウンリストボックスで、ブログを選択して、変更イベントがトリガされるとchangehandler （ ）が呼ばれる：

这个事件处理器只有一个作用，就是创建一个自定义事件类的实例并将用户所选择的值传送给这个实例（将myCombo中的值作为一个字符串）：その事件の1つのプロセッサにのみ、カスタムカテゴリを作成するには、事件との例を選んだの値この場合は、ユーザーを送信する（されるの値を文字列としてmycombo ） ：

第二个MXML组件包含了DataGrid控件并且从主程序中接收dataProvider。 2番目のコンポーネントが含まれてmxml DataGridコントロールと受信者はメインのプログラムのDataProviderのです。 现在你需要将这个文件保存为custBlogData.mxml：今すぐに必要なファイルを保存するにこのcustblogdata.mxml ：

这个DataGrid定义了两列。この2つのデータグリッドの定義をします。 第一列从用户选择的RSS feed（在custBlogList中选择的）中获取数据。の最初の列を選択すると、ユーザーのRSSフィード（ custbloglistで選択）のデータにアクセスします。 第二列从类型为ArrayCollection 的变量&#34;lista&#34; 获取数据。 2番目の列の種類の変数からarraycollection "リスト"のデータにアクセスします。

接下来，就是主程序文件了（BlogReader.mxml），它会调用上面的两个组件，调用一个HTTPService来获取rss数据并且定义了一个事件处理函数：次に、そのドキュメントは、メインプログラム（ blogreader.mxml ） 、それは、上記の2つのコンポーネントを呼び出し、 1つの請求を入手するhttpservice RSSと定義することにより、データ処理機能の事件：