自作コンポーネントをデザインビューで表示する方法

FlexUserGroupでも書きましたが、せっかくなのでここでも書いておきます。

自作コンポーネントをきちんとデザインビューでプレビューさせるとか、
コンポーネントビューに表示するとかは、いろいろ設定が必要です。

まずは以下のような自作コンポを作ったとしましょう。

package com.smpl
{
	import mx.controls.TextInput;

	[IconFile("CustomTxi.png")]

	public class CustomTxi extends TextInput
	{
		
		public function CustomTxi()
		{
			super();
		}
	}
}

次に、ライブラリプロジェクトのプロパティから、名前空間マニフェストファイルを指定します。


例)

名前空間http://www.smpl.com/

マニフェストファイル:smpl-mf.xml


マニフェストファイルは以下の通り作ったとします。

<?xml version="1.0"?>
<componentPackage>
    <component id="CustomTxi" class="com.smpl.CustomTxi"/>
</componentPackage>

これでビルドするのですが、次の設定が問題です。

以下のパスにXMLファイルで定義を配置する必要があります。
%eclipseディレクトリ%\plugins\com.adobe.flexbuilder.components.config_2.0.155577\config\components

ただ、このパスは環境により微妙に違うので注意してください。

Flex標準部品のために、builtin.xmlというファイルが必ずあるはずなので、それを目印にしてください。

そしてこのパスに、たとえば、smpl.xmlというファイル名で、以下のようなXMLを配置します。
(ファイル名は何でもいいみたいです)

<?xml version="1.0"?>
<components>
	<namespaces>
		<namespace prefix="smpl" uri="http://www.smpl.com/"/>
	</namespaces>
	<categories>
		<category id="controls" label="Controls" defaultExpand="true">
			<component name="CustomTxi" namespace="smpl"/>
		</category>
	</categories>
</components>

(10/23追記)
これで、デザインビューに表示されますが、ソースに以下のように、IconFileメタデータタグを付けて、該当の画像ファイルをライブラリのアセットとして入れておくと、コンポーネントビューにちゃんと反映されます。

[IconFile("CustomTxi.png")]

試してみましょう〜。