如何在各种移动设备上调整SAP M按钮的位置?

2020-09-21 07:14发布

         点击此处--->   EasySAP.com群内免费提供SAP练习系统(在群公告中)

加入QQ群:457200227(SAP S4 HANA技术交流) 群内免费提供SAP练习系统(在群公告中)


嗨,

我想根据所使用的移动设备来调整按钮的位置。

以下是屏幕截图:

我要根据运行该应用程序的移动设备来调整"单击此处"按钮的位置。

到目前为止,我想出了以下代码来处理调整(用onRouteMatched函数编写的代码):

 this.getView()。byId('idBtn')。onAfterRendering = function(){
 jQuery.sap.delayedCall(100,this,function(){
 var btnClnt = this.getView()。byId(" idBtn")。getDomRef()。getBoundingClientRect();
 如果(sap.ui.Device.system.phone === true){
 var marginTopVal ="";
/*if(sap.ui.Device.os.name ===" iOS"){
 jQuery(this.getDomRef())。css({
 'margin-top':'355px'
 });
 返回;
 } */
//纵向模式
 如果(sap.ui.Device.resize.width === 375){
//-305通过Cloud LaunchPad在Fiori客户端上用于iphone6
 marginTopVal = window.innerHeight-btnClnt.bottom-305;
  jQuery(this.getDomRef())。css({
        'margin-top':字符串(marginTopVal +" px")
//'margin-top':" 300px"
 });
//alert(" w-375");
 }否则,如果(sap.ui.Device.resize.width === 360){
//-165通过云启动板在andriod fiori客户端上正常工作
 marginTopVal = window.innerHeight-btnClnt.bottom-165;
//alert(marginTopVal);
 jQuery(this.getDomRef())。css({
 'margin-top':字符串(marginTopVal +" px")
//'margin-top':'180px'
 });
       //alert(" w-360");
       //alert(String(marginTopVal +" px"));
 }
 }
 });
 

当在index.html,HCP启动板和Apple Ipa内部版本中运行时,此代码在Web端的行为有所不同。

请建议如何在所有移动设备上固定按钮的位置。

谢谢

Saurabh。

button-positioning-issue.jpg (52.5 kB)

         点击此处--->   EasySAP.com群内免费提供SAP练习系统(在群公告中)

加入QQ群:457200227(SAP S4 HANA技术交流) 群内免费提供SAP练习系统(在群公告中)


嗨,

我想根据所使用的移动设备来调整按钮的位置。

以下是屏幕截图:

我要根据运行该应用程序的移动设备来调整"单击此处"按钮的位置。

到目前为止,我想出了以下代码来处理调整(用onRouteMatched函数编写的代码):

 this.getView()。byId('idBtn')。onAfterRendering = function(){
 jQuery.sap.delayedCall(100,this,function(){
 var btnClnt = this.getView()。byId(" idBtn")。getDomRef()。getBoundingClientRect();
 如果(sap.ui.Device.system.phone === true){
 var marginTopVal ="";
/*if(sap.ui.Device.os.name ===" iOS"){
 jQuery(this.getDomRef())。css({
 'margin-top':'355px'
 });
 返回;
 } */
//纵向模式
 如果(sap.ui.Device.resize.width === 375){
//-305通过Cloud LaunchPad在Fiori客户端上用于iphone6
 marginTopVal = window.innerHeight-btnClnt.bottom-305;
  jQuery(this.getDomRef())。css({
        'margin-top':字符串(marginTopVal +" px")
//'margin-top':" 300px"
 });
//alert(" w-375");
 }否则,如果(sap.ui.Device.resize.width === 360){
//-165通过云启动板在andriod fiori客户端上正常工作
 marginTopVal = window.innerHeight-btnClnt.bottom-165;
//alert(marginTopVal);
 jQuery(this.getDomRef())。css({
 'margin-top':字符串(marginTopVal +" px")
//'margin-top':'180px'
 });
       //alert(" w-360");
       //alert(String(marginTopVal +" px"));
 }
 }
 });
 

当在index.html,HCP启动板和Apple Ipa内部版本中运行时,此代码在Web端的行为有所不同。

请建议如何在所有移动设备上固定按钮的位置。

谢谢

Saurabh。

button-positioning-issue.jpg (52.5 kB)
付费偷看设置
发送
2条回答
何必丶何苦呢
1楼-- · 2020-09-21 07:34

我假设您想将按钮放在中间。

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

检查弹性框是否可以帮助

木偶小白
2楼-- · 2020-09-21 07:21

谢谢您的回答,但我想为每个移动设备固定按钮的位置,如上面的屏幕截图所示。 例如,当前屏幕快照中按钮的位置在页面底部距页边的某个位置,如果我将设备从iPhone 6更改为iPhone X,按钮的位置将发生变化(远离页面底部页边距)。 我已经将按钮放在FlexBox下方,以使其居中。

更改上面的设备后,请查看按钮"单击此处"的位置。

一周热门 更多>