ここでは、このトピックの理解を深めるために、
ユーザーコントロールがどのように動作するのかを簡潔に説明します。
ここでは以下について取り上げます:
- ユーザーコントロールの動作について
- GeneXus が実行時にユーザーコントロールをレンダリングする方法
答えは、ユーザーコントロールを使用するページを生成する場合に実行する、次の 3 つの手順で扱います。
ユーザーコントロールを含むページをレンダリングする際に、GeneXus はまず
DIV を挿入し (ユーザーコントロールがある場所に)、次にコントロールによって生成されたコード (手順 3 を参照) を、DIV の innerHtml として割り当てます。
GeneXus は、DIV を配置した後、実行時レンダリングクラスで定義されたクラスのインスタンスを作成します。次に、設計時に設定された値に従って、コントロールのプロパティが割り当てられます。データがバインドされたプロパティの場合、GeneXus は "SetValueData" メソッドを呼び出し、そのプロパティにバインドされた項目属性、変数、または SDT を渡します。
その項目属性、変数または SDT を、JavaScript コードから使用できます。
最後に、すべてのプロパティが初期化された後、コントロールの Show メソッドが呼び出されます。このメソッドは、コントロールを表示するために必要なすべての HTML コードを生成します。この HTML コードを、手順 1 で GeneXus が作成した DIV に "setHtml" 関数を使用して割り当てる必要があります:
//Hello World 実行時レンダリングファイルの例
this.show = function(data)
{
///UserCodeRegionStart: [ show ] (このコメントを削除しないでください)
var buffer= '<font face="' + this.FontFace + '" color="' + this.FontColor + '" size="' + this.FontSize + '">Hello World!!!</font>';
this.setHtml(buffer);
///UserCodeRegionEnd: (このコメントを削除しないでください)
}
ここで重要なことは、上記の手順は GeneXus によって自動的に「実行」されるということです。つまり、プログラマーが責任を負うのは、コントロールの HTML コードを生成する (Show メソッドの中で) ことだけです。その後、プログラマーは、上で説明したように、このコードを DIV に割り当てる必要があります。
また、Show メソッドの中では、必要なだけいろいろなことができることにも気付いたかもしれません。つまり、外部の JavaScript ライブラリを使用したり、フラッシュコントロールを作成したりすることができます。
外部の依存関係を使用することに関するその他の問題については、「
Loading external javascript resources」も参照してください。
詳細は、「
ユーザーコントロールの例」を参照してください。