Announcement

Collapse
No announcement yet.
X
Collapse
  • Page of 1
  • Filter
  • Time
Clear All
new posts
Previous template Next
    #1

    SmartGWT 5.0p and Mobile skin problems

    SmartClient Version: v10.0p_2015-02-09/LGPL Development Only (built 2015-02-09)
    Chromium Version 37.0.2062.120 Ubuntu 12.04 (281580) (64-bit)

    I'm having problems with the Mobile skin. If I call SC.say() or show a window, the element is not visible. I dug into the css and found that the following classes have an opacity of zero:

    .windowBackground,
    .popupWindowBackground,
    .dialogBackground

    .windowBody,
    .popupWindowBody,
    .dialogBody,
    .promptBody

    If I change it to 1, then the elements become visible. The relevant lines are 319 and 334 in sc/skins/Mobile/skin_styles.css.

    Also, the NavigationBar buttons reference a missing png:

    GET http://127.0.0.1:8080/techtool/techtool/sc/skins/Mobile/images/back_arrow.png 404 (Not Found)

    Chrome shows a box where the missing image would appear in the button. I copied images/blank.png to back_arrow.png which resolves that problem.

    These seem like pretty basic issues. Is the Mobile skin compatible with 5p or is something else going on?

    thanks
    Tags: None
    #2
    This sounds like you may be loading two skins at once - instructions for correct theme switching are in the QuickStart.

    However, you probably don't want to use this theme at all. It looks like iOS6, and is now less optimized for mobile than the themes we recommend in the Mobile Development overview.

    Comment

      #3
      I don't think I am. Here is my gwt.xml:

      Code:
      <?xml version="1.0" encoding="UTF-8"?>
<module rename-to='techtool'>
	<inherits name='com.google.gwt.user.User' />
	<inherits name="com.smartgwt.SmartGwtNoScriptNoTheme" />
	<inherits name="com.smartgwt.tools.SmartGwtToolsNoTheme" />
	<inherits name='saucon.portal.common.Common' />
	<inherits name="com.google.gwt.i18n.I18N" />
	<inherits name="com.smartclient.theme.mobile.MobileResources" />

	<!-- SuperDev Configuration -->
	<add-linker name="xsiframe" />
	<set-configuration-property name="devModeRedirectEnabled"
		value="true" />
	<set-configuration-property name="xsiframe.failIfScriptTag"
		value="false" />
	<set-property name="compiler.useSourceMaps" value="true" />

	<entry-point class='saucon.techtool.client.TechToolEntryPoint' />

	<source path='client' />
</module>
      And my index.html:

      Code:
      <!doctype html>
<html>
  <head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" />

    <title>Tech Tool</title>
    
    <script src=techtool/sc/modules/ISC_Core.js></script>
    <script src=techtool/sc/modules/ISC_Foundation.js></script>
    <script src=techtool/sc/modules/ISC_Containers.js></script>
    <script src=techtool/sc/modules/ISC_Grids.js></script>
    <script src=techtool/sc/modules/ISC_Forms.js></script>
    <script src=techtool/sc/modules/ISC_DataBinding.js></script>

    <script src=techtool/sc/skins/Mobile/load_skin.js></script>
    
    <script type="text/javascript" src="techtool/techtool.nocache.js"></script>
  </head>

  <body style="overflow:hidden">
  </body>
</html>
      I take your point about the recommended themes. I'll probably go with a customized version of Graphite with larger text.

      Comment

        #4
        We don't see an obvious problem with your .gwt.xml, but we also don't see a bunch of invisible widgets in this skin.

        As far as using Graphite (a good choice) be sure to read the Mobile Development overview about getting your viewport settings right - there should be no need to enlarge text, and if you did so, it could look clownishly large on common mobile devices with larger screens.

        Comment

        Previous template Next
        Working...
        X