Navigation between Full screen view and Master detail view in sapui5

sapui5

I have a requirement. the requirement is here is a one SAPUI5 application.
Application contains two views,
1. Initial View is Full Screen view
2. Second view is Master Detail view

am stuck at Navigation between Full screen view and Master detail view.
Even am not getting any error to share with you. after click on action/event(Button) the screen is dumb, that's it no response from the view.

Please give a suggestions, am waiting for your valuable reply.

Regards,
Kiran.

Best Answer

Create a project in which includes Master Detail Template View files & FullScreen templates files i.e.

  1. App.view.xml & App.Controller.js
  2. Master.view.xml & Master.controller.js
  3. Details.view.xml & Details.controller.js
  4. S1.view.xml & S1.controller.js

S1.view.xml 

<Button text="click to splite App" press="onPressSplite"/>
S1.controller.js

 onPressSplite : function(oEvent) {						
  var oRouter = sap.ui.core.UIComponent
  .getRouterFor(this);
  oRouter.navTo("main", {});
 },
 getEventBus : function() {
   return sap.ui.getCore().getEventBus();
 },
 getRouter : function() {
   return sap.ui.core.UIComponent.getRouterFor(this);
 }

After creating these views then just define the routing of pages in Component.js

	routing : {
		config : {
			routerClass : Application_Name.MyRouter,
			viewType : "XML",
			viewPath : "Application_Name.view",
			targetAggregation : "pages",
			clearTarget : false
		},
		routes : [{
			pattern : "",
			name : "S1",
			view : "S1",
			targetControl : "masterView",
		},{
			pattern : "App",
			name : "app",
			view : "App",
			targetControl : "masterView",
			subroutes : [{
				pattern : "master",
				name : "main",
				view : "Master",
				targetAggregation : "masterPages",
				targetControl : "idAppControl",
				subroutes : [{
					pattern : "detail/{key}",
					name : "Detail",
					view : "Detail",
					targetAggregation : "detailPages",
				}]
			}]
		}]
	}

Don't forget add MyRouter.js file

Related Topic