SAPUI5 - ヘッダ、サイドバーとナビゲーション

Question

私はSAPUI5に新しいですし、私は、ナビゲーション、サイドバーやヘッダといくつかの問題を抱えています。 ヘッダーとサイドバーでアプリケーションを開発したいと思います。私はこれのために "ToolPage"を使用します。すべてのページにツールページがあり、次のようになります。

これらはすべてコンテンツタグに異なるコードがあります。これにより

私は私がしたいレイアウトを実現し、私はmanifest.jsonを内のルートに移動します。私はすべてのページのためのコントローラを持っているとしてナビゲート：

onNavToBeTask: function(oEvent) { 
     this.getRouter().navTo("pageTasklist"); 
} 

私は今、私が移動するたびに、ヘッダーとサイドバーが再びロードされ、サイドバーの間違ったフィールドが強調表示されます問題を抱えています。

私は例を見つけましたが、ここでは https://sapui5.netweaver.ondemand.com/sdk/explored.html#/sample/sap.tnt.sample.ToolPage/code

私の質問があり、非常に不明確されるであろう含まれるすべての.xmlのコードと.jsファイルできました：

• は何ですか一般的にサイドバーとヘッダーでナビゲートする最善の方法は？
• ヘッダーやサイドバーで「マスターページ」を持つとちょうどコンテンツのタグにコンテンツを追加する方が良いでしょうか？
• また、ページに移動したときに呼び出される関数でサイドバーの右側のフィールドを選択するだけでよいですか？

編集：

Sample screenshot, what I would like to achieve

Answer 1

は限り私はあなたのポストから理解されるように、あなたはToolPageとSideNavigationを保持するメインビュー（マスターページ）を持っています。

そして、あなたはToolPageのメインコンテンツタグ内に自分の意見を載せていきたいと思います。 この場合： ルータは使用しないでください。ルーターを使用すると、メインビューを離れます。

私はあなたが何をすべきかをここにリストアップ：

1. は、別のビューファイルとしてあなたのビューを作成します。 （XMLまたはJS）View1を作成するとしましょう。

2. は、あなたのメニュー項目のボタンのクリック（タップ）のイベントハンドラを作成します。これは、メインビューのコントローラに転送する必要があります。 （EventBus）

3. メインビューのコントローラーで、View1をインスタンス化する関数を作成します。インスタンス化の後、ToolPageのScrollContainer（またはNavContainer）のコンテンツにView1を追加します。

このような何か：

onGoToProductTable: function(oEvent) { 
var oScrollContainer = sap.ui.getCore().byId("idScrollContainer"); 
var oCurrentView = oScrollContainer.getContent(); 
if (!oCurrentView[0]) { 
     var view = sap.ui.getCore().byId("ProductTable"); 
     if (view === undefined) { 
      view = sap.ui.view({ 
       type: sap.ui.core.mvc.ViewType.JS, 
       viewName: "xxx.yyy.view.ProductTable" 
      }); 
     } 
     oScrollContainer.addContent(view); 
}}, 

を