最近のアクセス:
Hello World ユーザーコントロール

: ユーザーコントロールを作成する場合、GeneXus 16 以降では、User Control オブジェクトを作成することを推奨していますが、この記事での説明はまだ有効です。
このドキュメントの目的は、単純な Hello World ユーザーコントロールの作成方法を説明することです。この例の手順を完了すると、ツールボックスで使用可能な Hello World という新しいユーザーコントロールが完成します。
このコントロールの機能について説明します。このユーザーコントロールを Web フォームにドラッグすると、GeneXus アプリケーション内に「Hello World」というメッセージを表示します。色およびフォントはコントロールプロパティを使用して設定できます。
このようなコントロールを使うことで、メニュー、ツリービュー、Silverlight コントロールなどを作成できます。

Hello World ユーザーコントロールの定義

このコントロールは次のことを実行します:
  • 「Hello World」というメッセージを表示する
  • ​​プログラマーが次のことを設定できる:
    • 「Hello World」というテキストの色
    • 「Hello World」というテキストのフォント
    • 「Hello World」というテキストのサイズ

コントロールの作成

1) GeneXus インストールディレクトリーにある UserControlEditor.exe (User Control Editor) を実行して、 [ New ] ボタンをクリックします。ユーザーコントロールの名前とフォルダの場所を入力します。すべてのユーザーコントロールは UserControls ディレクトリーの下に配置する必要があります。このディレクトリーも GeneXus インストールディレクトリーの下にあります。
イメージ:4881.png
2) [ Control Definition ] タブの下で、 [ Icon (used in toolbox) ] プロパティを入力します。ここでは、HelloWorldIcon.ico というアイコンを使用します。これは手順 1 で作成した HelloWorld フォルダの下に配置する必要があります。
イメージ:4882.png
3) 前述のとおり、コントロールには Hello World というテキストのフォント、色、およびサイズを設定するための 3 つのプロパティが必要です。したがって、 [ Properties ] タブの下には、次の 3 つのプロパティを作成する必要があります。
  • FontFace
    • タイプ: Combo
    • 既定値: Verdana
    • 値: Arial=Arial,Verdana=Verdana,Comic Sans MS=Comic Sans MS
  • FontColor
    • タイプ: Color
    • 既定値: #000000 (黒)
  • FontSize
    • タイプ: Text
    • 既定値: 10
イメージ:4883.png
4) コントロールのレンダリング時に、GeneXus は実行時レンダリングファイル ( [ Control Definition ] タブで指定) の Show メソッドを呼び出します。このファイルは [ JScript Runtime Render ] タブの下に継承されます。このファイルで、コントロールの主要ロジックをすべてプログラミングします。この例では、指定したフォント、色、およびサイズで Hello World メッセージを表示するだけなので、レンダリングファイルは次のようになります:
イメージ:4884.png
薄いグレーで塗りつぶされたコードはすべてエディターによって自動生成されるため、追加する必要があるのは「Hello World」テキストと、GeneXus から受け取るパラメーター (フォント、色、サイズ) だけです。この場合、行は次のとおりです:
var buffer= '<span style="color:#'+ this.FontColor.Hexa + ';font-size:'+ this.FontSize + ';font-family:'+ this.FontFace + '">HelloWorld!!!</span>'
5) この手順はオプションです: ユーザーコントロールを作成するときに、コントロールが GeneXus IDE でどのように表示されるかを指定します。たとえば、コントロールを表す画像を表示できます。また、GXChart のように、プロパティに従ってコントロールを動的にレンダリングするようなことも可能です。
ここでは、コントロールが Web フォームにドラッグされたときに単純な「Hello World Control」というテキストを表示します。次のように [ xsl Designer Render ] タブの下で実行時レンダリングファイルを編集し、「Hello World Control」というテキストだけを追加します。
イメージ:4885.png
この操作により、コントロールが次のように表示されます:
イメージ:4886.png
6) GeneXus を閉じて (開いていた場合)、コマンドプロンプトを起動し、GeneXus インストールディレクトリーで「GeneXus.exe /install」を実行します。その後、通常どおりに GeneXus を起動します。
これでコントロールが完成し、使用できるようになりました。

コントロールの使用

先ほど作成したコントロールを使用してみます。これは非常に簡単なプロセスです。
1) Web パネルを作成し、ツールボックスから [ Hello World ] をドラッグします。
イメージ:4887.png
2) プロパティを設定します。
イメージ:4888.png
3) 実行します。
イメージ:4889.png

サンプルのダウンロード

このドキュメントで説明したサンプルをダウンロードできます: HelloWorld のサンプル



サブページ
Created: 14/09/18 03:16 by Admin Last update: 23/05/08 21:27 by Admin
カテゴリ
Powered by GXwiki 3.0