1

私は次のように設計されたアプリケーションを持っています。旅行代金返済アプリです。2つのタブがあります。

  1. 私の請求：これまでに行われたすべての払い戻し請求を表示します
  2. 私のアカウント：私の詳細を表示する

左側にクレームの数があり、選択すると右側にエントリが表示されます。

私は以下の見解を作成しました。

  • AppView：タブパネルとタブがあるアプリ全体の場合
  • MyAccountsView：[マイアカウント]タブのコンテンツ用。
  • MyClaims View：[マイクレーム]タブのコンテンツ用。これには2つのパネルがあります。左側のものはクレームをロードします。表示するクレームが選択されるまで、権利は空です。
  • SelectedClaimView：右側のパネルの場合。選択したクレームのクレームエントリが表示されます。

各ビューには、対応する場所とアクティビティがあります。

これらは、アプリケーションの作成中に問題が発生する次の要件です。

左側のパネルでクレームをクリックすると、右側のパネルにselectedClaimView内のクレームエントリが表示される必要があります。別のクレームをクリックすると、そのクレームの内容がリストに入力される必要があります。また、このクレーム選択の履歴サポートが必要です。

設計中に次の問題に直面しています。

  1. ネストされたアクティビティを追加する方法。たとえば、MyClaimsTabを選択すると、すべてのクレームが左側のパネルに読み込まれる必要があります。クレームの選択時に、クレームエントリは選択されたクレームビューを介して右側のパネルにロードする必要があります。ただし、アクティビティを呼び出して場所を変更すると、呼び出し中のアクティビティが停止します。

  2. また、両方のタブの両方のアクティビティを同時に実行する必要があり、タブスイッチ間で履歴を維持する必要があります。これは私がやり方を知らないことであり、提案をいただければ幸いです。

4

3 に答える 3

1

要件は非常に単純であり、設計も単純でなければなりません。AccountView と ClaimsView の 2 つのアクティビティと 2 つのビューのみが必要です。

ナビゲーション メニューとして、単純なウィジェット (タブとしてスタイル設定された 2 つのラベルを持つ FlowPanel) が必要です。このウィジェットを両方のビューの上部に配置し、ClickHandler を他のビューに対応するラベルにアタッチします。つまり、AccountView でハンドラーを Claims ラベルにアタッチし、presenter.goTo(new ClaimsTab("") をトリガーします。 ClaimsView では押されたタブ、AccountView ではアカウント ラベルとしてスタイルを設定する必要があります. これにより、ナビゲーションが処理されます: 特別な操作は必要ありません.

AccountView はシンプルです。上部にナビゲーション ウィジェット、下部に詳細があります。ClaimsView の場合、LayoutPanel を 3 つのレイヤーに分割して使用します: ナビゲーション ウィジェットの上部レイヤー、クレームの左側のレイヤー、詳細の右側のレイヤーです。クレームには Tree を使用し、クレームの詳細には ScrollPanel にラップされた FlowPanel ("claimDetailsPanel") を使用するとします。

ClaimsView には、(getter と setter を使用して) "initialized" フラグが必要です。ユーザーが ClaimsTab の場所に来たら、ClaimsActivity を開始します。このアクティビティは、ClaimsView への参照を取得します。ClaimsView が初期化されているかどうかを確認します。そうでない場合は、クレームのリストをロードし、クレーム ツリーにデータを取り込みます。ツリーを構築するときは、各クレームを各 TreeItem のユーザー オブジェクトとして設定します。次に、初期化フラグを true に設定します。

presenter.goTo(new ClaimsTab(selectedClaim.getId().toString())); を呼び出す選択ハンドラをツリーにアタッチします。

これにより、ユーザーは同じタブに戻りますが、新しい URL トークンが使用されます。選択したクレームが id=123 の場合、#ClaimsTab:123 トークンが表示されます。ClaimsView は既に構築されており、表示されているため、画面がちらつくことはありません。

これで、新しい ClaimsActivity が実行されます。このアクティビティは、(a) 処理する必要があるトークンがあること、および (b) ビューが初期化されているため、クレームを読み込んでクレーム ツリーにデータを設定する必要がないことを認識します。アクティビティはトークンを解析し (クレーム ID に変換)、このクレームの詳細を読み込み、この情報を ClaimsView に渡して claimDetailsPanel に入力する必要があります (前のクレームのコンテンツが含まれている可能性があるため、最初にクリアする必要があります)。

ちょっとしたディテール。ユーザーは任意のクレームをブックマークできます。したがって、ClaimsActivity がクレーム ツリーを構築する場合は、トークンをチェックする必要があります。ブックマークされたページにはトークンがあるため、アクティビティは選択するツリー項目をビューに伝える必要があります。

2 つのビュー、2 つのアクティビティです。ネストされたものはありません。

于 2012-09-24T13:57:22.680 に答える
0

Slottedフレームワークを使用すると、これを簡単に行うことができます。(免責事項: 私はSlottedを書きました)。あなたが望むことを行う簡単な方法を説明しましょう。メインの AppPlace を次のように定義します。

public class AppPlace extends SlottedPlace {
    public static final Slot TabsSlot = new Slot(new AppPlace(), new MyClaimsPlace());

    @Override public Slot getParentSlot() {
        return SlottedController.RootSlot;
    }

    @Override public Slot[] getChildSlots() {
        return new Slot[] {TabsSlot};
    }
}

これは、Slotted フレームワークに、現在のビュー内に別のアクティビティを含めることができるスロットが AppPlace にあることを伝えます。

AppActivity では、SlottedPlace を拡張し、このメソッドをオーバーライドする必要があります。

@Override public void setChildSlotDisplay(Slot slot) {
    slot.setDisplay(tabsSlotWidget);
}

tabsSlotWidget は、新しいアクティビティのコンテナーとして使用される SimplePanel または SimpleLayoutPanel になります。AppPlace に 2 つのスロットを配置することも、MyClaimsPlace 内にスロットを配置することもできます。TabPanel と同様の機能を提供する SlottedTab ウィジェットがありますが、各タブをアクティビティにすることができます。

上記の変更以外は、アクティビティは GWT A&P と同じように機能します。Slotted 内で既存の A&P サイトを実行し、ネストが必要なアクティビティのみをアップグレードすることもできます。

  1. これにより、通常の GWT A&P では許可されていない複数のアクティビティを同時に開始できます。アクティビティの同じレベルにある場所を呼び出すと、そのアクティビティのみが置き換えられ、残りの階層はそのまま維持されます。

  2. Slotted は階層全体の履歴を処理するため、ネストのレベル/幅に関係なく、履歴トークンにより再作成が可能になります。

于 2013-02-27T05:50:54.160 に答える
-1

私はあなたを正しい方向に向けることができることを願っています。

  1. ロジックを実装する方法は無限にあります。コマンドデザインパターンを読むことをお勧めします（グーグルであなたは良いリソースを見つけるでしょう）

  2. ブラウザの履歴で履歴を意味する場合は、DevGuideを参照してください。つまり、ユーザーがオプションを選択したことを単に覚えておいてください。次に、それを記憶する独自のクラスを作成します。これは、1でも役立つ場合があります。

于 2012-09-24T10:26:36.477 に答える