How to adjust position of a sap m button across various mobile devices?

[former_member200679]

Hi,

I want to adjust the position of a button depending on the mobile device used.

Here is the screenshot below:

I want to adjust the position of "Click here" button according to the mobile device on which the application is running.

So far i have come up with the following code, to handle adjustment(code written in onRouteMatched function):

this.getView().byId('idBtn').onAfterRendering = function() {
jQuery.sap.delayedCall(100, this, function() {
var btnClnt = this.getView().byId("idBtn").getDomRef().getBoundingClientRect();
if (sap.ui.Device.system.phone === true) {
var marginTopVal = "";
/*if(sap.ui.Device.os.name === "iOS"){
	jQuery(this.getDomRef()).css({
		'margin-top': '355px'
			});
		return;
}*/
//Portrait mode
if (sap.ui.Device.resize.width === 375) {
//- 305 for iphone6 on fiori client via cloud launchpad
marginTopVal = window.innerHeight - btnClnt.bottom - 305;
 jQuery(this.getDomRef()).css({
       'margin-top': String(marginTopVal + "px")
	//'margin-top': '300px'
				});
	//alert("w-375");
		} else if (sap.ui.Device.resize.width === 360) {
	// -165 works properly on andriod fiori client via cloud launchpad
	marginTopVal = window.innerHeight - btnClnt.bottom - 165;
	//alert(marginTopVal);
	jQuery(this.getDomRef()).css({
	'margin-top': String(marginTopVal + "px")
	//'margin-top': '180px'
				});
       //alert("w-360");
       //alert(String(marginTopVal + "px"));
					}  
				} 
			});

This code behaves differently in web-ide when run as index.html, in HCP launchpad and in Apple Ipa build.

Please suggest how to fix the position of button across all mobile devices.

Thanks,

Saurabh.

[junwu]

I assume you want to put the button in the center.

https://ui5.sap.com/#/sample/sap.m.sample.FlexBoxBasicAlignment/preview

check if flex box can help

[former_member200679]

Thank you for answering, but i want to fix the position of button for every mobile device as shown in the above screenshot. For example, the position of button in current screenshot is at certain point from bottom margin of page and if i change device from iPhone 6 to iPhone X, the position of button changes(moves far away from the bottom margin of page). I have already placed the button under FlexBox to bring it in center.

Please look at the position of button "Click here" after changing the device above.