Axure-rp-advanced-interactions
Axure RP-高度なインタラクション
これまで、相互作用のためのAxureの基本機能を紹介してきました。 ただし、プロトタイプがインテリジェントである必要がある多くの現実のシナリオがあります。 インテリジェントという言葉で言えば、プロトタイプは、特定の動作を実行/トリガーするために、特定のウィジェットの状態を検出する必要があります。
このような相互作用の典型的な例は、ボタンの色の設定です。 これには、UXエンジニアが思考の帽子をかぶって、プロトタイプの設計を次のレベルに進めることが必要です。
Axureで変数を使用する
- 変数*は、定義により、変化または変化しやすい要因を表します。 Axureでは、変数を使用して、ウィジェット/相互作用の状態を表現または識別することができます。
典型的な例は、あるページから別のページにデータを転送するときにデータ値を保存することです。 例をわかりやすくするために、特定のウィジェットの状態を表示する必要があるシナリオを考えてみましょう。
最後の例を続けて、画像が何回表示されたかを表示したいと考えましょう。
ここに私たちがそれを行う方法があります-
- カウントを0に開始するための変数を作成します。
- [画像の表示]ボタンをクリックすると、この変数の値が増加します。
- テキストラベルに値を表示します。
この例では、ダイナミックパネルの下にテキストを作成します。 テキストが読み取られます–画像は0回表示されます。
クリティカル-ラベルが3つに分かれていることが重要です。 表にリストされているラベル名とテキストに従ってください。
| Label Name | Label Text |
|---|---|
| imageLabel | Image is shown |
| countLabel | 0 (zero in digits) |
| timesLabel | Times |
これは、Show ImageボタンのクリックごとにcountLabel値を制御するために必要です。
最初に変数を定義しましょう。
ボタンがクリックされると制御される変数が必要になります。 Axureの用語でのこの変数は-グローバル変数です。 グローバル変数を定義するには、メニューバーの[プロジェクト]をクリックし、[グローバル変数]をクリックします。 次のスクリーンショットに示すように、ダイアログボックスが開きます。
緑色のプラス（+）アイコンをクリックして、グローバル変数を追加します。 グローバル変数- varDynamicPanel を呼び出しましょう。 デフォルト値は 0 です。
[画像の表示]ボタンの操作で、ケース1をダブルクリックします。 別のアクションを追加します。 次のスクリーンショットに示すように、アクションは CountLabelのテキストをvarDynamicPanel + 1 に設定します*。
テキストラベルを値に選択するのは非常に簡単です。 動的パネルから値を取得する方法を見てみましょう。
上記のスクリーンショットのステップ4に示されているように、 fx ボタンをクリックすると、次のダイアログボックスが開きます。
最初のテキスト領域の下に、次の文字列を入力します。
[[varDynamicPanel + 1]]OKをクリックしてください。
次に、ボタンがクリックされるたびに変数が更新されるようにする必要があります。
ケースエディターダイアログボックスのアクションで、変数→変数値の設定を選択します。
変数としてvarDynamicPanelを選択します。
使用可能なオプションからcountLabelとしてウィジェット上のテキストから値を取得するように変数を設定します。
[OK]をクリックして、ケースエディターを閉じます。 次に、[プレビュー]ボタンをクリックします。
画像を4回表示/非表示にした後、プレビュー画面に結果が表示されます。
