4.5. 実装上の補足¶

 const uniquePropertyDefinition: PropertyDefinition & IUniquePropertyDefinition = {
   stringProperty: {
     displayName: 'stringProperty',
     definition: {},
     type: 'string',
     value: 'string',
   },
   integerProperty: {
     displayName: 'integerProperty',
     definition: {},
     type: 'integer',
     value: 1,
   },
   decimalProperty: {
     displayName: 'decimalProperty',
     definition: {},
     type: 'decimal',
     value: 10,
   },
   booleanProperty: {
     displayName: 'booleanProperty',
     definition: {},
     type: 'boolean',
     value: true,
   },
 }
 ...
 public updateElement(
   builder: IHTMLElementBuilder,
   container: IUIContainer,
   properties: IUIElementPropertyAccessor<PropertyDefinition & ICommonPropertyDefinition>
 ): void {
   // 文字列として取得する
   const stringValue = properties.getProperty('stringProperty').toString();

   // 数値として取得する
   const integerValue = properties.getProperty('integerProperty').toNumber();
   const decimalValue = properties.getProperty('decimalProperty').toNumber();

   // 真偽値として取得する
   const booleanValue = properties.getProperty('booleanProperty').toBoolean();

   // null かどうかを判定する
   const isNull = properties.getProperty('sampleProperty').isNull();

   // 配列かどうかを判定する
   const isArray = properties.getProperty('arrayProperty').isArray();

   // オブジェクトかどうかを判定する
   const isObject = properties.getProperty('objectProperty').isObject();

   ...
}

public updateElement(...): void {
  ...
  // 文字列をセットする
  properties.setProperty('stringProperty', 'foo', false);

  // 数値をセットする
  properties.setProperty('integerProperty', 1, false);
  properties.setProperty('decimalProperty', 10, false);

  // 真偽値をセットする
  properties.setProperty('booleanProperty', true, false);

  // null をセットする
  properties.setProperty('sampleProperty', null, false);

  // 配列をセットする
  properties.setProperty('arrayProperty', ['foo', 'bar'], false);

  // オブジェクトをセットする
  properties.setProperty('objectProperty', {foo: 'bar'}, false);
  ...
}

public createElement(...): void {
  ...
  // 自身のエレメントも含めて再レンダリングするときだけ第3引数に true を指定する
  // 自身の updateElement が再度呼び出されるため、無限ループに注意する
  tag.addEventListener('xxx', () => {
    properties.setProperty('stringProperty', 'somevalue', true);
  }
  ...
}

public run(...) {
  // 取得
  // アクションダイアログの設定どおりに取得したい場合
  const paramRaw = parameters.getParameter('param').toRaw(container);

  // 変数の値を取得したい場合
  const paramArgument = parameters.getParameter('param').toArgument(container);

  ...

  // セット
  // プリミティブな値をセットする場合
  container.parameters.writeAsPrimitive(container, parameters.getParameter('param').toRaw(), paramPrimitive);

  // Argument をセットする場合
  container.parameters.writeAsArgument(container, parameters.getParameter('param').toRaw(), paramArgument);

  // 配列を考慮してセットする場合
  // 変数のパラメータが配列の場合、自動的に要素数1の ArrayArgument に変換されます。
  // 変数のパラメータが配列でなく、かつ value に配列が指定された場合、最初の要素に対して Argument に変換されます。
  container.parameters.writeAsPrimitiveStrictArrayTyped(container, parameters.getParameter('param').toRaw(), param);

// StringArgument を作成する
const stringArgument = window.imHichee.ArgumentFactory.createAsString(container, 'foo');

// ObjectArgument の中身を作成する
const obj = new window.imHichee.KeyValueMap<string, IArgument>();
obj.put('integer', window.imHichee.ArgumentFactory.createAsInteger(container, 1));
...
// ObjectArgument を作成する
const objectArgument = window.imHichee.ArgumentFactory.createAsObject(container, obj);

// 例：フォーカスアウト時に、プロパティで指定されたアクションの前に処理を行う
public createElement(...): void {
  ...
  tag.addEventListener('blur', () => { // 上記のフォーカスアウトに相当するイベントタイプ blur を指定します。
    // 処理
  }
  ...
}