SAPUI5: Page without Shell

[Former Member]

I am creating a SAPUI5 project without a shell so that I can have more screen space. This is what I currently have in the index page:

<script>

     sap.ui.getCore().attachInit(function() {

        new sap.m.App ({

        pages: [

        new sap.m.Page({

        id: "test",
        title: "My SAPUI5 Page",
        enableScrolling : true,
        footer: new sap.m.Bar({

             contentRight: new sap.m.Button({text: "Some text here"})

        }),
        content: [ new sap.ui.core.ComponentContainer({

        name : "sap.demo.project"
        })]

       })

       ]

       }).placeAt("content");
   });
</script>

It works, and if I wanted to, I could dynamically operate on the page through JS within the app controller. However, I would prefer to specify the page data and footer event handlers as XML inside the page I am calling, as would normally do if I had used a shell and had gone down this route:

sap.ui.getCore().attachInit(function () {
     new sap.m.Shell({
     app: new sap.ui.core.ComponentContainer({
          name: "sap.demo.project"
     })
     }).placeAt("content");
});

Any ideas on how I could achieve this?

[Former Member · Accepted solution]

You can set the appWidthLimited property of the shell control as false. This will allow the application to take the entire screen.

Else, you can also use:

sap.ui.getCore().attachInit(function() {

  new sap.m.App ({

  pages: [

  new sap.m.Page({

  enableScrolling : false,

  content: [ new sap.ui.core.ComponentContainer({

  height : "100%", name : "sap.demo.project"

  })]

  })

  ]

  }).placeAt("content");

  });

Thanks,

Esha.

[Former Member · Accepted solution]

Thank you!