Master menu is not visible on mobile devices but is visible on tablet

问题

I have created a split app using the sap.m.SplitApp control.

Mobile Device:

iPad:

回答1:

I believe this is the intended behaviour.

See this github issue: https://github.com/SAP/openui5/issues/30

One of the devs says

The SplitApp is designed to behave like e.g. the "Settings" app on iPhone, where a master-detail structure on tablet is mapped to a linear set of pages on phone. As such it is correct not to display a "Show Master" button.

However, they suggest the following

On phones there is no master button, but you should initially see the master area and navigate from there to the detail area by selecting items.

To achieve this you can do the following: Your detail pages should contain a button with which you can navigate back to the master view (this button should only be visible if the device is a phone):

<Page id="detailPage" showNavButton="{device>/isPhone}" navButtonPress="handleNavButtonPress">
</Page>

The navButtonPress handler is implemented in your detail view's controller

handleNavButtonPress: function () {
    var oSplitApp = this.getView().getParent().getParent();
    var oMaster = oSplitApp.getMasterPages()[0];
    oSplitApp.toMaster(oMaster, "flip");
}

The device model I used can be implemented as follows (place this code in the init of your Component.js

var deviceModel = new sap.ui.model.json.JSONModel({
    isPhone: sap.ui.Device.system.phone
});
this.setModel(deviceModel, "device");

See this resource for further information: http://help.sap.com/saphelp_hanaplatform/helpdata/en/32/5b8edafcfa4c9c8fbd42455a60e379/content.htm

回答2:

hi every one i found the solution: on XML view : you must put true to the property showheader for the page ypu want to see the button fo navigate and implemet the handle method for mavigate

<Page id="detail"
        showHeader="true"
       showNavButton = "true"  navButtonPress = "handleNav"

来源：https://stackoverflow.com/questions/36326189/master-menu-is-not-visible-on-mobile-devices-but-is-visible-on-tablet

标签

sapui5