イベントを使用してブロックの変更を親に反映する
親ブロックまたは親画面にブロック内のイベントを通知することができます。これを行うには、以下を実行します。
- ブロックでイベントを定義する
- イベントによってトリガーされるハンドラアクションを定義する
概要を以下に示します。
- ブロックを作成し、イベントを追加します。値を親要素に渡す場合、イベントに入力パラメータを追加することもできます。
- ブロックを画面または別のブロックにドラッグします。ブロックにはイベントが含まれているため、イベントによってトリガーされる親要素内のアクションを定義する必要があります。また、イベントにパラメータがある場合、それらをアクションにも渡す必要があります。
- アプリが実行されると、ブロックによって親画面内のアクションがトリガーされ、パラメータが渡されます。
例: サイズラベルを含むボタン
ここでは、動作例について詳細に説明します。画面で再利用できるブロックを作成し、ユーザーが3つのサイズのうち1つを選択できるようにします。
イベントでブロックを定義する
最初に、「Small」、「Medium」、「Large」の各ボタンを含むブロックを作成します。これらのボタンがクリックされたとき、サイズを示すテキストをイベントに送信します。実際のアプリではこのサイズのアイテムを命令に追加しますが、この例では選択後にメッセージを表示します。
- フローを右クリックして［Add Block］を選択します。「Sizes」という名前を付けます。
- Sizesブロックを右クリックして［Add Event］を選択します。「SelectSize」という名前を付けます。
-
SelectSizeイベントを右クリックして［Add Input Parameter］を選択します。「SizeName」という名前を付けます。
-
ブロックをダブルクリックして、そこにButtonウィジェットをドラッグします。Buttonのプロパティで［Events］を探し、On ClickでSelectSizeイベントを選択します。SizeName入力パラメータに「Small」と入力します。最後に、ボタンのテキストを編集して「small」にします。
-
同じ手順を実行して、さらに「Medium」と「Large」のボタンを追加します。
画面でイベントを含むブロックを使用する
- Sizesブロックを画面にドラッグします。ブロック内に処理を要するイベントが含まれるため、Service Studioによって警告が発生します。
-
画面内でブロックを選択し、Handlerプロパティで［New Client Action］を選択します。これで、この新しいアクションBlockSizesSelectSizeが編集可能になります。
-
Messageツールをフローにドラッグし、Messageプロパティに「
"You selected a " + SizeName + " item."」と入力します。SizeNameはブロックからのパラメータです。
-
サンプルアプリをパブリッシュします。「Large」というラベルのボタンをクリックすると、「You selected a large item.」というメッセージが表示されます。
