1
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

【OutSystems】UIウィジェット part1

Posted at

今回の記事は、UIウィジェットについて、いろいろなウィジェット(部品)について簡単に説明します。※初学者向けなので悪しからず。。。

Expression Widget

実行時にテキストまたは計算結果を表示するUIウィジェットです。
単純な計算式やテキスト、ビルドイン関数や関数化されたアクションを使用して表示することが可能です。
下記はButton Widgetのプロパティです。

image.png

ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー
・Value
表示する値を表します。(基本データ型)
・Example
開発時の画面に表示される値を表します。これは実際の画面には影響がありません(基本データ型)
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー

画面は下記となります。
image.png

Button Widget / Link Widget

ボタンとリンクは基本的にはほとんど同じ役割です。
ユーザがアクションをトリガーしたり、データを送信したり、別の画面に遷移したりする際に使用します。

下記はButton Widgetのプロパティです。
image.png

ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー
・Enabled
Widgetの有効/無効を表します(boolean)
・Is Form Default
Form内のInput Widgetにフォーカスが当たっているとき、Enterキーを押下するとアクションがトリガーされる機能です。また、Link Widgetにはありません(boolean)
・Visible
Widgetの表示/非表示を表します(boolean)
・On Click
Widgetが押下された場合のアクションを選択します(設定必須)
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー

画面は下記となります。
image.png

If Widget

ウィジェットをある条件下で表示/非表示を制御するためのウィジェットです。
下記開発環境のようにInput、IFを用意します。
IFの条件としては、Inputにバインドされた変数が空なら「Blank!」を、
バインドされた変数が空でなければ、「Not Blank!」を表示するように設定しました。

image.png

実際の画面では下記となります。
image.png

image.png

以上となります。
今回はExpession Widget、Button Widget、Link Widget、If Widgetについて説明しました。
次回は別のWidgetについて説明します。

1
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?