特集「ヨモヤマビルド」

InputWidgetをAjax Refreshする時にAnimation EffectのHighlightを出す方法

こんにちは、OutSystems Platformチームの清水です。

今回はタイトルの通り、豆知識程度の事をご紹介させていただきます。

 

「こんなこと、InputWidgetに設定したAjax RefreshのAnimation EffectをHighlightに

すればいいだけでは?」とおっしゃる方もいるかもしれませんが、そうでもありません。

実際にInputWidgetにAjax Refreshのアニメーションを設定しても、FadeとVertical Slideは表示されるにも拘らず、Highlightだと画面上では何のエフェクトも起こらないのです。

 

だからといってエラーが発生しているわけでもない……。

 

そこでどうするか、というと以下のような設定をHighlightさせたいInputWidgetの

プロパティに記述します。

op8①

上図の様に記述することでInputWidgetの背景が透過され、Highlightが見えるようになります。

(おそらくはInpuWidgetの背景のさらに後ろでHighlightが実行されていたためにHighlightが

行われていないように見えていたのだと思います。)

 

また、Highlightをデフォルトの黄色以外にしたい時には、HighlightさせたいInputWidgetをContainerで囲み、そのContainerのプロパティに以下の設定を記述します。

op8②

上図の「’#CC3300’」の部分を変えることでHighlightの際の色を自由に変えることが出来るようになります。

 

上記の記述方法は例えばWeb ScreenのJavascriptなどに記述しても正常に機能するので、

利用方法次第では面白いことが出来そうですね。

 

以上です。