on 09-23-2014 10:39 AM
Hi Experts,
We are implementing SAP ITS for our WMS. I have a Motorola MC55A0, I am just testing with the standard ITSMOBILE01 for the device symbol 3090. Every is working fine except the screen resolution. It doesn't fit to the screen for the device Motorola MC55A0, every time i need to zoom in to key in the username & password and consecutive screens. Other threads, i noticed we need to change the HTML code like meta data or to change height and width settings. But nowhere clear documentations are mentioned. Please let me know the exact place were to Change/ Add the code in the program. Is it in the custom module pool program need to do the changes? if yes then please tell me the exact place under which tag need to place the code. If we need to change the code of the HTML Template include eg: DEVINCLUDE_SYMBOL3090. Please let me know the exact place. System information : EHP7 , Motorola OS: Windows 6.5 Classic. OS Version: 05.02.29217 OEM Name: Motorola MC55A ,OEM Version: 03.47.0004,OS Cert: SymbolCert. Your response will be appreciated!!!
Regards,
Vinoth
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.
Vinoth,
Have you explored the option of using an alternate browser. The native browsers that are delivered in Windows CE have a bad rendering of the HTML.
Try using the Naurtech browser for Windows CE. Its designed to work well with SAP ITS mobile developments.
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.
Hi Kelvin Baldwart,
Many Thanks for your assistance. Seems Naurtech browser does not come for free. I am looking for the best fit with the default browser provided by Motorola. I tried the option using Pocket Browser, that is also not free. Have to buy the pocket browser, which we are not convinced . Would like to use the Max facility provided by SAP. Thanks!
Regards,
Vinoth
Hi Vinoth,
When you generated the templates in SE80
Were the screen sizes 16x20 or 8x40?
Is the ITS Mobile Visual Editor Wiki of use here:
http://wiki.sdn.sap.com/wiki/x/cr8 --> ITSmobile Visual Editor
Regards,
Oisin
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.
Hi Oisin,
I was expecting your reply. Really thanks for helping out all our people in SDN. Is it the screen size you are referring to please see the below screen shot. I did it in the SPRO configuration path.i tried will all the possibilities. But couldn't see the expected output. Please assist . Many Thanks!
I have already gone through all the ITS visual editor and their related child thread also. but nowhere the screen resolution documentations are clear.
Regards,
Vinoth
Hi Vinoth,
I believe your ITSMobile HTML templates should be generated with the 16x20 screen if you are to use this ITSMobile service on a Motorola MC55A0 device.
What transaction are you hoping to use?
See ITS Mobile Wiki re template generator
https://www.sdn.sap.com/irj/sdn/wiki?path=/display/HOME/ITSmobile
and
http://help.sap.com/saphelp_nw70/helpdata/en/
46/65635b4d045de8e10000000a1553f6/frameset.htm
> Creating Mobile Applications with ITSmobile
also refer to the following note:
1316326 - ITSmobile: HTML element size is independent of font size
(will only be useful for minor changes)
Regards,
Oisin
Hi Oisin,
I have tested with all 4 screen size from 16x20,8x40,16x20ITS,16x20MIN. But there are no differences noticed even after re-publishing all the screen.
We are doing a POC to use the ITS for the WMS. Planned to create a custom module pool program to scan the Bar code and do GR,create TO,Confirm TO,Change Bin etc. i am doing the feasibility testing with the SAP standard ITS services, but facing a problem in Screen fixes. As i don't know HTML & Java Script. Not sure were to Fix the template size in html or in java. Please assist.
All the link which you have shared shows what to do, but i seeking a clear view on how to do and were to do in the template. assist me if i am missing anything. Thanks!
Regards,
Vinoth
Hi Oisin,
please find the below code which is exactly same as program SAPMIMOB1 under the ITS services ITSMOBILE01.
`if (~currdynpro.speechenabled != "")
`<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
`end;`
<html`if (~currdynpro.speechenabled != "")
` xmlns="http://www.w3.org/1999/xhtml"
xmlns:vxml="http://www.w3.org/2001/vxml"
xmlns:ev="http://www.w3.org/2001/xml-events"
xmlns:xv="http://www.voicexml.org/2002/xhtml+voice"`
end;` class="MobileHtml">`
if ( ~itsmobileNameSpace != "" )
~current_service = ~itsmobileNameSpace & ~service;
elseif ( strsub(~sources, 0, 1) == "/" )
~current_service = strsub(~sources, 0, strchr(~sources, "/", 1)+1) & ~service;
else
~current_service = ~service;
end;`
`
<!-- Generated Template
NAME: ZVSAPMIMOB1
SCREEN: 0500
DATE: 20140917
TIME: 161851
STYLE: MOBILE4
-->
declare class(name, idx=1), style(name, idx=1), style_attr(name, idx=1), icon(name, idx=1),
class_ext(name, idx=1), align(name, idx=1), label(name, idx=1), has_label(name, idx=1),
width(i, a), margin_left(i, a), w(i, a) in "some.html";
if ( ~itsmobileFuncInclude != "" )
include(~service=~current_service, ~language="", ~theme=~theme, ~name=~itsmobileFuncInclude, ~style="x");
else
include(~service="itsmobile", ~language="", ~theme="99", ~name=nonExt&"functions", ~style="x");
end;
`<head>`
if ( ~itsmobileDeviceInclude != "" )
include(~service=~current_service, ~language="", ~theme=~theme, ~name=~itsmobileDeviceInclude & ".html");
end;
`<title>`~windowtitle`</title>`
if ( ~itsmobileSoundInclude != "" ) <!-- customers sound -->
include(~service=~current_service, ~language="", ~theme=~theme, ~name=~itsmobileSoundInclude & ".html");
else <!-- default -->
include(~service="itsmobile", ~language="", ~theme="99", ~name="include/sound.html");
end;`
`
if ( ~itsmobileCssInclude != "" ) <!-- customer include from gui settings -->`
<link rel="stylesheet" href="`mimeURL(~service=~current_service, ~theme=~theme, ~language="", ~name=~itsmobileCssInclude & ".css")`" type="text/css" />
` else <!-- default include from itsmobile --> `
<link rel="stylesheet" href="`mimeURL(~service="itsmobile", ~theme=99, ~language="", ~name="styles/all/mobile.css")`" type="text/css" />
` end;
if ( ~itsmobileJsInclude != "" ) <!-- customer include specified in gui settings -->`
<script type="text/javascript" language="javascript" src="`mimeURL(~service=~current_service, ~theme=~theme, ~language="", ~name=~itsmobileJsInclude & ".js")`"></script>
` else <!-- default include from itsmobile -->`
<script type="text/javascript" language="javascript" src="`mimeURL(~service="itsmobile", ~theme=99, ~language="", ~name="scripts/all/mobile.js")`"></script>
` end;
if ( ~itsmobileCustomJsInclude != "" )`
<script type="text/javascript" language="javascript" src="`mimeURL(~service=~current_service, ~theme=~theme, ~language="", ~name=~itsmobileCustomJsInclude & ".js")`"></script>
` end;`
<script type="text/javascript" language="Javascript">
var itsmobile_eos = "`wgateurl(~okcode="/nex")`";
</script>
` <!-- rfid values --------------------------- -->
if ( ~RfidEnabledFields != "" ) `
<script type="text/javascript" language="javascript" src="`mimeURL(~service="itsmobile", ~theme=99, ~language="", ~name="rfid/rfbutton.js")`"></script>
<script type="text/javascript" language="Javascript">
var rfid_fields = new Object;
` repeat with i from 1 to ~RfidEnabledFields.dim
<!-- get field name and index -->
rfidField = ~RfidEnabledFields[i];
rfidFieldIdx = ~RfidEnabledFields[i].idx;
rfidFieldParams = ~RfidEnabledFields[i].params; `
rfid_fields["`rfidField`[`rfidFieldIdx`]"] = { `rfidFieldParams` };
` end;`
</script>
` end;`
` <!-- Check if screen supports voice integration -->
if ( ~currdynpro.speechenabled != "" )
<!-- include the htmlb functions for voice integration -->
if ( ~itsmobileVoiceInclude != "" ) <!-- customers voice generation html -->
include(~service=~current_service, ~language="", ~theme=~theme, ~name=~itsmobileVoiceInclude & ".html");
else <!-- default its default voice include -->
include(~service="itsmobile", ~language="", ~theme="99", ~name="include/voice.html");
end;
end;`
`
`</head>`
`<body class="MobileBody `class("~currdynpro", 1)`" `style_attr("~currdynpro", 1)` id="MobileBody"`
if (~currdynpro.speechenabled != "")` ev:event="load" ev:handler="#sayOnPageLoad"` else
` onload="setFocus('`~focusfield`');`~itsmobileOnloadHandler`"` end;
` onkeydown="return processKeyEvent(event);" onhelp="return false;">
`
`<form method="post" action="`WGateURL()`" id="mobileform" name="mobileform" onsubmit="return firstSend()" style="display:inline">
<input type="hidden" id="~OkCode" name="~OkCode" value="/0" />
<input type="hidden" id="~FKey" name="~FKey" value="" />
<input type="hidden" id="~Focusfield" name="~Focusfield" value="" />
`if (~SEC_SESSTOKEN != "")`<input type="hidden" name="~SEC_SESSTOKEN" value="`~SEC_SESSTOKEN`" />`end`
`if (~active_timer != "")
include(~service="itsmobile", ~theme="99", ~name="timer.html");
timer(~active_timer, width, height);
end`
`
`<!-- main screen begin -->
<div width="10%">`
if ( ~itsmobileCuaInclude != "" ) <!-- customers cua area -->
include(~service=~current_service, ~language="", ~theme=~theme, ~name=~itsmobileCuaInclude & ".html");
elseif ( ~itsmobileNoCuaInclude != "1" && ~itsmobileNoCuaInclude != "X" ) <!-- default cua area -->
include(~service="itsmobile", ~language="", ~theme="99", ~name="include/cuaarea.html");
end;`
</div>
<div width="10%" class="MobileUserArea">`
if ( ( ~DYNPRO_COMPRESSION != "1" && ~DYNPRO_COMPRESSION != "X" ) ||
( 'TEXT'[1].exists == "X" && 'TEXT'[1].visible == "X" ) ||
0 )
`<!-- line 1 -->
<div class="MobileRow">`
if ( ( 'TEXT'[1].exists == "X" ) && ( 'TEXT'[1].visible == "X" ) )
icon( "TEXT", 1 );
`<span style="`width("21", "17.220em"); align("TEXT", 1); style("TEXT", 1)`" `
if ( 'TEXT'[1].highlighted == "X" )
`class="MobileLabelHighlighted `class("TEXT", 1)`" `
else
`class="MobileLabel `class("TEXT", 1)`" `
end
`>`label("TEXT", 1)`</span>`
else
`<span style="`margin_left("21", "17.220em")`; height:1px"></span>`
end;
<!-- content row end -->`
</div>
`end;
if ( ( ~DYNPRO_COMPRESSION != "1" && ~DYNPRO_COMPRESSION != "X" ) ||
( 'TESTS'[1].exists == "X" && 'TESTS'[1].visible == "X" ) ||
1 )
`<!-- line 2 -->
<div class="MobileRow">`
includeFrame (~frameName="TESTS")
<!-- content row end -->`
</div>
`end;
if ( ( ~DYNPRO_COMPRESSION != "1" && ~DYNPRO_COMPRESSION != "X" ) ||
( 'DISP'[1].exists == "X" && 'DISP'[1].visible == "X" ) ||
0 )
`<!-- line 9 -->
<div class="MobileRow">`
if ( ( 'DISP'[1].exists == "X" ) && ( 'DISP'[1].visible == "X" ) )
`<input type="button" style="`width("8", "6.560em"); style("DISP", 1)`" `
`class="MobileButton`class_ext("DISP", 1)` `class("DISP", 1)`" `
if ( 'DISP'[1].disabled == "X" ) `disabled="disabled" `end;
`name="`'DISP'[1].name`" `
if ( ~currdynpro.speechenabled != "" ) `id="`'DISP'[1].name`" `end;
`value="`label("DISP", 1)`" `
if ( 'DISP'[1].onclick != "" )
`onclick="`'DISP'[1].onclick`;" `
elseif ( 'DISP'[1].rfidenabled == "X" )
`onfocus="setFocusField('`'DISP'[1].name`');"
onblur="leaveFocusField('`'DISP'[1].name`');"
onclick="RfidButtonClick();" `
else
`onclick="setOkCode('`'DISP'[1].okcode`');" `
end;
`/>`
else
`<span style="`margin_left("8", "6.560em")`; height:1px"></span>`
end;
if ( 12 != 0 )
`<span style="`margin_left("12", "9.840em")`; height:1px"></span>`
end;
<!-- content row end -->`
</div>
`end;
if ( ( ~DYNPRO_COMPRESSION != "1" && ~DYNPRO_COMPRESSION != "X" ) ||
( 'MENU'[1].exists == "X" && 'MENU'[1].visible == "X" ) ||
( 'START'[1].exists == "X" && 'START'[1].visible == "X" ) ||
( 'EXEC'[1].exists == "X" && 'EXEC'[1].visible == "X" ) ||
( 'FCODE'[1].exists == "X" && 'FCODE'[1].visible == "X" ) ||
0 )
`<!-- line 10 -->
<div class="MobileRow">`
if ( ( 'MENU'[1].exists == "X" ) && ( 'MENU'[1].visible == "X" ) )
`<input type="button" style="`width("5", "4.100em"); style("MENU", 1)`" `
`class="MobileButton`class_ext("MENU", 1)` `class("MENU", 1)`" `
if ( 'MENU'[1].disabled == "X" ) `disabled="disabled" `end;
`name="`'MENU'[1].name`" `
if ( ~currdynpro.speechenabled != "" ) `id="`'MENU'[1].name`" `end;
`value="`label("MENU", 1)`" `
if ( 'MENU'[1].onclick != "" )
`onclick="`'MENU'[1].onclick`;" `
elseif ( 'MENU'[1].rfidenabled == "X" )
`onfocus="setFocusField('`'MENU'[1].name`');"
onblur="leaveFocusField('`'MENU'[1].name`');"
onclick="RfidButtonClick();" `
else
`onclick="setOkCode('`'MENU'[1].okcode`');" `
end;
`/>`
else
`<span style="`margin_left("5", "4.100em")`; height:1px"></span>`
end;
if ( 0 != 0 )
`<span style="`margin_left("0", "0.000em")`; height:1px"></span>`
end;
if ( ( 'START'[1].exists == "X" ) && ( 'START'[1].visible == "X" ) )
`<input type="button" style="`width("5", "4.100em"); style("START", 1)`" `
`class="MobileButton`class_ext("START", 1)` `class("START", 1)`" `
if ( 'START'[1].disabled == "X" ) `disabled="disabled" `end;
`name="`'START'[1].name`" `
if ( ~currdynpro.speechenabled != "" ) `id="`'START'[1].name`" `end;
`value="`label("START", 1)`" `
if ( 'START'[1].onclick != "" )
`onclick="`'START'[1].onclick`;" `
elseif ( 'START'[1].rfidenabled == "X" )
`onfocus="setFocusField('`'START'[1].name`');"
onblur="leaveFocusField('`'START'[1].name`');"
onclick="RfidButtonClick();" `
else
`onclick="setOkCode('`'START'[1].okcode`');" `
end;
`/>`
else
`<span style="`margin_left("5", "4.100em")`; height:1px"></span>`
end;
if ( 0 != 0 )
`<span style="`margin_left("0", "0.000em")`; height:1px"></span>`
end;
if ( ( 'EXEC'[1].exists == "X" ) && ( 'EXEC'[1].visible == "X" ) )
`<input type="button" style="`width("6", "4.920em"); style("EXEC", 1)`" `
`class="MobileButton`class_ext("EXEC", 1)` `class("EXEC", 1)`" `
if ( 'EXEC'[1].disabled == "X" ) `disabled="disabled" `end;
`name="`'EXEC'[1].name`" `
if ( ~currdynpro.speechenabled != "" ) `id="`'EXEC'[1].name`" `end;
`value="`label("EXEC", 1)`" `
if ( 'EXEC'[1].onclick != "" )
`onclick="`'EXEC'[1].onclick`;" `
elseif ( 'EXEC'[1].rfidenabled == "X" )
`onfocus="setFocusField('`'EXEC'[1].name`');"
onblur="leaveFocusField('`'EXEC'[1].name`');"
onclick="RfidButtonClick();" `
else
`onclick="setOkCode('`'EXEC'[1].okcode`');" `
end;
`/>`
else
`<span style="`margin_left("6", "4.920em")`; height:1px"></span>`
end;
if ( 0 != 0 )
`<span style="`margin_left("0", "0.000em")`; height:1px"></span>`
end;
if ( 'FCODE'[1].exists == "X" )
if ( 'FCODE'[1].mode == "multiline" )
`<textarea `
`class="MobileEditMultiline`class_ext('FCODE', 1); class("FCODE", 1)`" `
if ( 'FCODE'[1].disabled == "X" ) `disabled="disabled" `end;
if ( 'FCODE'[1].readonly == "X" ) `readonly="readonly" `end;
if ( 'FCODE'[1].okcode != "" )
`onchange="setOkCode('`'FCODE'[1].okcode`');return false;" `
end;
`style="`width("5", "4.100em"); style("FCODE", 1)`" `
`rows="`'FCODE'[1].rows`" `
`onfocus="setFocusField('`'FCODE'[1].name`');" `
`onblur="leaveFocusField('`'FCODE'[1].name`');" `
`name="`'FCODE'[1].name`">`'FCODE'[1]`</textarea>`
else
if ( 'FCODE'[1].disabled == "X" )
if ( 'FCODE'[1].visible != "X" )
`<input type="hidden" `
elseif ( 'FCODE'[1].type == "Password" )
`<input type="password" readonly="readonly" tabindex="-1" `
`style="`width("5", "4.100em"); style("FCODE", 1)`" `
if ( 'FCODE'[1].highlighted == "X" )
`class="MobilePasswordHighlightedDisabled `class("FCODE", 1)`" `
else;
`class="MobilePasswordDisabled `class("FCODE", 1)`" `
end;
elseif ( 'FCODE'[1].inputrequired == "X" )
`<input type="text" readonly="readonly" tabindex="-1" `
`style="`width("5", "4.100em"); align("FCODE", 1); style("FCODE", 1)`" `
if ( 'FCODE'[1].highlighted == "X" )
`class="MobileEditRequiredHighlightedDisabled `class("FCODE", 1)`" `
else;
`class="MobileEditRequiredDisabled `class("FCODE", 1)`" `
end;
else
`<input type="text" readonly="readonly" tabindex="-1" `
`style="`width("5", "4.100em"); align("FCODE", 1); style("FCODE", 1)`" `
if ( 'FCODE'[1].highlighted == "X" )
`class="MobileEditHighlightedDisabled `class("FCODE", 1)`" `
else;
`class="MobileEditDisabled `class("FCODE", 1)`" `
end;
end;
`onfocus="focusField('`'FCODE'[1].name`');" `
`name="`'FCODE'[1].name`" `
if ( ( 'FCODE'[1].inputrequired == "X" ) && ( 'FCODE'[1] == "?" ) )
`value="" `
else
`value="`strmaskext('FCODE'[1], 1)`" `
end;
`size="`'FCODE'[1].width`" maxlength="`'FCODE'[1].maxinputsize`"/>`
else <!-- not disabled -->
icon( "FCODE", 1 );
if ( 'FCODE'[1].visible != "X" )
`<input type="hidden" `
elseif ( 'FCODE'[1].type == "Password" )
`<input type="password" `
`style="`width("5", "4.100em"); style("FCODE", 1)`" `
if ( 'FCODE'[1].highlighted == "X" )
`class="MobilePasswordHighlighted `class("FCODE", 1)`" `
else
`class="MobilePassword `class("FCODE", 1)`" `
end;
elseif ( 'FCODE'[1].inputrequired == "X" )
`<input type="text" `
`style="`width("5", "4.100em"); align("FCODE", 1); style("FCODE", 1)`" `
if ( 'FCODE'[1].highlighted == "X" )
`class="MobileEditRequiredHighlighted `class("FCODE", 1)`" `
else
`class="MobileEditRequired `class("FCODE", 1)`" `
end;
else
`<input type="text" `
`style="`width("5", "4.100em"); align("FCODE", 1); style("FCODE", 1)`" `
if ( 'FCODE'[1].highlighted == "X" )
`class="MobileEditHighlighted `class("FCODE", 1)`" `
else
`class="MobileEdit `class("FCODE", 1)`" `
end;
end;
if ( 'FCODE'[1].okcode != "" )
`onchange="setOkCode('`'FCODE'[1].okcode`');return false;" `
end;
`onfocus="setFocusField('`'FCODE'[1].name`');" `
`onblur="leaveFocusField('`'FCODE'[1].name`');" `
`name="`'FCODE'[1].name`" `
if ( ~currdynpro.speechenabled != "" )`id="`'FCODE'[1].name`" `end;
if ( ( 'FCODE'[1].inputrequired == "X" ) && ( 'FCODE'[1] == "?" ) )
`value="" `
else
`value="`strmaskext('FCODE'[1], 1)`" `
end;
`size="`'FCODE'[1].width`" maxlength="`'FCODE'[1].maxinputsize`"/>`
end;
end;
else
`<span style="`margin_left("5", "4.100em")`; height:1px"></span>`
end;
<!-- content row end -->`
</div>
`end;
`</div>
<!-- main screen end -->`
`</form>`
`</body>`
`</html>
Hi Vinoth,
See the section:
`<!-- main screen begin -->
<div width="10%">`
if ( ~itsmobileCuaInclude != "" ) <!-- customers cua area -->
include(~service=~current_service, ~language="", ~theme=~theme, ~name=~itsmobileCuaInclude & ".html");
elseif ( ~itsmobileNoCuaInclude != "1" && ~itsmobileNoCuaInclude != "X" ) <!-- default cua area -->
include(~service="itsmobile", ~language="", ~theme="99", ~name="include/cuaarea.html");
end;`
</div>
<div width="10%" class="MobileUserArea">`
this I believe explains why the screen area is so small.
Why the template was generated at this width I cannot explain though?
if the <div width="10%">`
is changed to 100%
What is the result?
Regards,
Oisin
Hi Oisin,
Apologies for delay. Even after changing the width to 100%,still no change in the output. I suspect CSS has priority over our custom change. Please assist and do let me know how to find the css path from the html template,so that i will try to play around on that. Many Thanks for the timely help.
Regards,
Vinoth
Hi Vinoth,
I presume you are using the standard mobile.css file in the itsmobile service?
You should copy this file to your own service and then use the parameter: ~ITSMOBILECSSINCLUDE
See the WIKI: Service Parameter and Settings - Wiki - SCN Wiki
Regards,
Oisin
Hi Oisin,
Thanks for your support. Yes, i am using mobile.css file(default SAP is using this file i think), finding hard to get the file Mobile.css from Tcode SE80 under MIME repository. Please assist me the way where can i find the file mobile.css under which path, so that i can copy to my ITS services. Many Thanks!
Regards,
Vinoth
User | Count |
---|---|
93 | |
10 | |
10 | |
9 | |
9 | |
7 | |
6 | |
5 | |
5 | |
4 |
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.