Axure RP-マスターとダイナミックパネルの使用

ソフトウェア開発アプローチの多くは、ユーザーインターフェイス開発に関しては、マスターの作成という一般的な手法を採用しています。

マスターは再利用可能なワイヤフレームであり、一度作成され、その後のページで広範囲に使用されます。 Axure RPでは、マスターページを作成すると、このページに加えられた変更が、使用されているページに適用されます。したがって、すべてのページに共通するコンポーネントの時間を大幅に短縮します。

マスターを開始するには、次のスクリーンショットで強調表示されているように、マスターセクション（5としてマーク）に集中できます。

このマスターセクションを使用して-

ダイナミックパネル

前の章で見たように、Axure RPには、特定のウィジェットに関連付けられたさまざまな状態があります。特定のウィジェットまたはウィジェットのセットの状態を統合/整理するには、コンテナ/プレースホルダーが必要です。動的パネルは、ウィジェットの状態のコンテナ/プレースホルダーとして機能します。

例を使用して、動的パネルをよりよく理解しましょう。メニューバーの例から続けます。

この例で追加されるのは、画像バーとメニューバーの下にあるボタンです。一般的なウィジェットの下の画像領域とボタンにウィジェットプレースホルダーを使用します。プレースホルダーにImageAreaPlaceholder、ボタンにshowImageButtonという名前を付けます。

また、メニューバーをマスターに追加してみましょう。メニューバーを右クリックし、[マスターに変換]をクリックします。マスターの名前を入力するダイアログボックスが表示されます。 menuBarMasterとして名前を追加します。

上記のスクリーンショットに示すように、メニューバーがピンク色に変わり、マスターのエントリが追加されました。

次に、動的パネルを作成しましょう。動的パネルのコンテキストは、[画像の表示]ボタンのクリックに基づいて画像領域の可視性を制御することです。動的パネルを使用すると、画像領域の柔軟性が得られます。

動的パネルの作成方法を見てみましょう。画像領域を右クリックすると、コンテキストメニューが表示されます。[ダイナミックパネルに変換]を選択します。

動的パネルは、「アウトライン：ページ」の下にあります。また、インスペクターの下に、動的パネルが表示されます。動的パネルにshowImageDynamicPanelという名前を付けます。この動的パネルの名前は、[アウトライン：ページ]セクションで更新されます。

設計領域で、[画像を表示]ダイナミックパネルを右クリックして、コンテキストメニューを表示します。 [非表示に設定]を選択すると、動的パネルが画面から消えます。

ダイナミックパネルにアクセスするには、[アウトライン：ページ]をダブルクリックします。

次に、ボタンにクリックイベントを提供します。 [画像の表示]ボタンをクリックし、[インスペクター]→[プロパティ]で[OnClickインタラクション]をダブルクリックします。

上記のスクリーンショットに示すように、ウィジェットの下にある表示/非表示をクリックします。アクションを構成するために使用可能なウィジェットが自動的に表示されます。 showImageDynamicPanelを選択してください。 OKをクリックしてください。

次に、「プレビュー」をクリックします。プレビュー画面で、「画像を表示」をクリックします。ボタンの別のインタラクションが最終的に作成されます。