I can’t run the app right on Samsung Galaxy S3 tab Lte

Asked

Viewed 60 times

0

I’m in trouble and I believe it’s something or in framework7 I’m using for the layout or Android version compatibility issue.

I’m using the following frameworks and API:

  • Phonegap
  • framework7 (design material included)
  • jquery

config.xml

<?xml version='1.0' encoding='utf-8'?>
  <widget id="br.com.mentor.amjb" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:gap="http://phonegap.com/ns/1.0">
<name>Jorge Bichara</name>
<description>
    App Mobile Candidato
</description>
<author email="[email protected]" href="http://w3com.com.br">
    Mentor
</author>
<content src="index.html" />
<preference name="DisallowOverscroll" value="true" />
<preference name="android-minSdkVersion" value="17" />
<preference name="android-maxSdkVersion" value="23" />
<preference name="android-targetSdkVersion" value="17" />   
<plugin name="cordova-plugin-battery-status" source="npm" spec="~1.1.1" />
<plugin name="cordova-plugin-camera" source="npm" spec="~2.1.1" />
<plugin name="cordova-plugin-media-capture" source="npm" spec="~1.2.0" />
<plugin name="cordova-plugin-console" source="npm" spec="~1.0.2" />
<plugin name="cordova-plugin-contacts" source="npm" spec="~2.0.1" />
<plugin name="cordova-plugin-device" source="npm" spec="~1.1.1" />
<plugin name="cordova-plugin-device-motion" source="npm" spec="~1.2.0" />
<plugin name="cordova-plugin-device-orientation" source="npm" spec="~1.0.2" />
<plugin name="cordova-plugin-dialogs" source="npm" spec="~1.2.0" />
<plugin name="cordova-plugin-file" source="npm" spec="~4.1.1" />
<plugin name="cordova-plugin-file-transfer" source="npm" spec="~1.5.0" />
<plugin name="cordova-plugin-geolocation" source="npm" spec="~2.1.0" />
<plugin name="cordova-plugin-globalization" source="npm" spec="~1.0.3" />
<plugin name="cordova-plugin-inappbrowser" source="npm" spec="~1.3.0" />
<plugin name="cordova-plugin-media" source="npm" spec="~2.2.0" />
<plugin name="cordova-plugin-network-information" source="npm" spec="~1.2.0" />
<plugin name="cordova-plugin-splashscreen" source="npm" spec="~3.2.1" />
<plugin name="cordova-plugin-statusbar" source="npm" spec="~2.1.2" />
<plugin name="cordova-plugin-vibration" source="npm" spec="~2.1.0" />
<plugin name="cordova-plugin-whitelist" source="npm" spec="~1.2.1" />
<icon src="icon.png" />
<platform name="android">
    <preference name="orientation" value="portrait" />
    <icon density="ldpi" src="www/res/icon/android/drawable-ldpi/icon.png" />
    <icon density="mdpi" src="www/res/icon/android/drawable-mdpi/icon.png" />
    <icon density="hdpi" src="www/res/icon/android/drawable-hdpi/icon.png" />
    <icon density="xhdpi" src="www/res/icon/android/drawable-xhdpi/icon.png" />
    <icon density="xxhdpi" src="www/res/icon/android/drawable-xxhdpi/icon.png" />
    <icon density="xxxhdpi" src="www/res/icon/android/drawable-xxxhdpi/icon.png" />
    <splash density="land-ldpi" src="www/res/screen/android/drawable-land-ldpi-screen/default.png" />
    <splash density="land-mdpi" src="www/res/screen/android/drawable-land-mdpi-screen/default.png" />
    <splash density="land-hdpi" src="www/res/screen/android/drawable-land-hdpi-screen/default.png" />
    <splash density="land-xhdpi" src="www/res/screen/android/drawable-land-xhdpi-screen/default.png" />
    <splash density="land-xxhdpi" src="www/res/screen/android/drawable-land-xxhdpi-screen/default.png" />
    <splash density="land-xxxhdpi" src="www/res/screen/android/drawable-land-xxxhdpi-screen/default.png" />
    <splash density="port-ldpi" src="www/res/screen/android/drawable-port-ldpi-screen/default.png" />
    <splash density="port-mdpi" src="www/res/screen/android/drawable-port-mdpi-screen/default.png" />
    <splash density="port-hdpi" src="www/res/screen/android/drawable-port-hdpi-screen/default.png" />
    <splash density="port-xhdpi" src="www/res/screen/android/drawable-port-xhdpi-screen/default.png" />
    <splash density="port-xxhdpi" src="www/res/screen/android/drawable-port-xxhdpi-screen/default.png" />
    <splash density="port-xxxhdpi" src="www/res/screen/android/drawable-port-xxxhdpi-screen/default.png" />
</platform>
<platform name="ios">
    <icon height="57" platform="ios" src="www/res/icon/ios/icon.png" width="57" />
    <icon height="114" platform="ios" src="www/res/icon/ios/[email protected]" width="114" />
    <icon height="40" platform="ios" src="www/res/icon/ios/icon-40.png" width="40" />
    <icon height="80" platform="ios" src="www/res/icon/ios/[email protected]" width="80" />
    <icon height="50" platform="ios" src="www/res/icon/ios/icon-50.png" width="50" />
    <icon height="100" platform="ios" src="www/res/icon/ios/[email protected]" width="100" />
    <icon height="60" platform="ios" src="www/res/icon/ios/icon-60.png" width="60" />
    <icon height="120" platform="ios" src="www/res/icon/ios/[email protected]" width="120" />
    <icon height="180" platform="ios" src="www/res/icon/ios/[email protected]" width="180" />
    <icon height="72" platform="ios" src="www/res/icon/ios/icon-72.png" width="72" />
    <icon height="144" platform="ios" src="www/res/icon/ios/[email protected]" width="144" />
    <icon height="76" platform="ios" src="www/res/icon/ios/icon-76.png" width="76" />
    <icon height="152" platform="ios" src="www/res/icon/ios/[email protected]" width="152" />
    <icon height="29" platform="ios" src="www/res/icon/ios/icon-small.png" width="29" />
    <icon height="58" platform="ios" src="www/res/icon/ios/[email protected]" width="58" />
    <icon height="87" platform="ios" src="www/res/icon/ios/[email protected]" width="87" />
    <splash height="1136" platform="ios" src="www/res/screen/ios/Default-568h@2x~iphone.png" width="640" />
    <splash height="1334" platform="ios" src="www/res/screen/ios/Default-667h.png" width="750" />
    <splash height="2208" platform="ios" src="www/res/screen/ios/Default-736h.png" width="1242" />
    <splash height="1242" platform="ios" src="www/res/screen/ios/Default-Landscape-736h.png" width="2208" />
    <splash height="1536" platform="ios" src="www/res/screen/ios/Default-Landscape@2x~ipad.png" width="2048" />
    <splash height="768" platform="ios" src="www/res/screen/ios/Default-Landscape~ipad.png" width="1024" />
    <splash height="2048" platform="ios" src="www/res/screen/ios/Default-Portrait@2x~ipad.png" width="1536" />
    <splash height="1024" platform="ios" src="www/res/screen/ios/Default-Portrait~ipad.png" width="768" />
    <splash height="960" platform="ios" src="www/res/screen/ios/Default@2x~iphone.png" width="640" />
    <splash height="480" platform="ios" src="www/res/screen/ios/Default~iphone.png" width="320" />
</platform>
<platform name="wp8">
    <icon height="99" platform="wp8" src="www/res/icon/wp8/ApplicationIcon.png" width="99" />
    <icon height="159" platform="wp8" src="www/res/icon/wp8/Background.png" width="159" />
    <splash height="1280" platform="wp8" src="www/res/screen/wp8/screen-portrait.jpg" width="768" />
</platform>
<platform name="windows">
    <icon height="150" platform="windows" src="www/res/icon/windows/Square150x150Logo.scale-100.png" width="150" />
    <icon height="30" platform="windows" src="www/res/icon/windows/Square30x30Logo.scale-100.png" width="30" />
    <icon height="50" platform="windows" src="www/res/icon/windows/StoreLogo.scale-100.png" width="50" />
    <splash height="300" platform="windows" src="www/res/screen/windows/SplashScreen.scale-100.png" width="620" />
    <icon height="120" platform="windows" src="www/res/icon/windows/StoreLogo.scale-240.png" width="120" />
    <icon height="44" platform="windows" src="www/res/icon/windows/Square44x44Logo.scale-100.png" width="44" />
    <icon height="106" platform="windows" src="www/res/icon/windows/Square44x44Logo.scale-240.png" width="106" />
    <icon height="70" platform="windows" src="www/res/icon/windows/Square70x70Logo.scale-100.png" width="70" />
    <icon height="71" platform="windows" src="www/res/icon/windows/Square71x71Logo.scale-100.png" width="71" />
    <icon height="170" platform="windows" src="www/res/icon/windows/Square71x71Logo.scale-240.png" width="170" />
    <icon height="360" platform="windows" src="www/res/icon/windows/Square150x150Logo.scale-240.png" width="360" />
    <icon height="310" platform="windows" src="www/res/icon/windows/Square310x310Logo.scale-100.png" width="310" />
    <icon height="150" platform="windows" src="www/res/icon/windows/Wide310x150Logo.scale-100.png" width="310" />
    <icon height="360" platform="windows" src="www/res/icon/windows/Wide310x150Logo.scale-240.png" width="744" />
    <splash height="1920" platform="windows" src="www/res/screen/windows/SplashScreenPhone.scale-240.png" width="1152" />
</platform>
<access origin="*" />
<allow-intent href="http://*/*" />
<allow-intent href="https://*/*" />
<allow-intent href="tel:*" />
<allow-intent href="sms:*" />
<allow-intent href="mailto:*" />
<allow-intent href="geo:*" />
<platform name="android">
    <allow-intent href="market:*" />
</platform>
  <platform name="ios">
    <allow-intent href="itms:*" />
    <allow-intent href="itms-apps:*" />
  </platform>
 </widget>

The following occurs: .css is completely deformed, the font-icons does not appear all, really do not know what to do I’ve tried to change version equal to the device and nothing , only works on other phones and a tablet I have here, if someone can give Force, thanks. Android version of this device is 4.2.2(API 17)

  • The layout break problem may be related to CSS class addressing. It doesn’t have much to do with config.xml, try compiling using "Android Studio". Usually acquisitions are replicated to a folder called /Platforms/ at the root of the project.

  • www is only project editing folder.

  • To better help you, publish the code of your file index.html containing the links of the CSS classes. or main.html

1 answer

0

Follows the index

<!DOCTYPE html>
<html class="android android-4">

<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no, minimal-ui" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<title>Dr. Jorge 43</title>
<link rel="stylesheet" href="css/framework7.material.colors.min.css" />
<link rel="stylesheet" href="css/framework7.material.css" />
<!-- Path to your custom app styles-->
<link rel="stylesheet" href="css/my-app.css" />
<link href="css/galeria.css" rel="stylesheet" />
<link rel="stylesheet" href="css/blueimp/blueimp-gallery.css" />
<link rel="stylesheet" href="css/blueimp/blueimp-gallery-indicator.css" />
<link rel="stylesheet" href="css/blueimp/blueimp-gallery-video.css" />

</head>

<body>
<!-- Status bar overlay for fullscreen mode-->
<div class="statusbar-overlay"></div>
<!-- Panels overlay-->
<div class="panel-overlay"></div>
<!-- Left panel with reveal effect-->
<div class="panel panel-left panel-reveal">

    <div class="content-block">
        <div class="list-block">
            <div class="card-content">
                <div class="list-block media-list">
                    <ul>
                        <li class="item-content">
                            <div class="item-media">
                                <img class="redondo" src="img/candidato.jpg" width="44" />
                            </div>
                            <div class="item-inner">
                                <div class="item-title-row">
                                    <div class="item-title"><strong>Dr. Jorge Bichara</strong></div>
                                </div>
                                <div class="item-subtitle">Partido Verde</div>
                            </div>
                        </li>
                    </ul>
                </div>
            </div>

            <ul>
                <li>
                    <a href="index.html" data-view=".view-main" class="index item-link close-panel">
                        <div class="item-content">
                            <div class="item-inner">
                                <div class="item-title"> <img class="icone" src="svg/home.svg" t=""> Inicio</div>
                            </div>
                        </div>
                    </a>
                </li>
                <li>
                    <a href="sobre.html" data-view=".view-main" class="sobre-link item-link close-panel">
                        <div class="item-content">
                            <div class="item-inner">
                                <div class="item-title"> <img class="icone" src="svg/sobre.svg" alt=""> Sobre</div>
                            </div>
                        </div>
                    </a>
                </li>
                <li>
                    <a href="propostas.html" data-view=".view-main" class="propostas-link item-link close-panel">
                        <div class="item-content">
                            <div class="item-inner">
                                <div class="item-title"><img class="icone" src="svg/propostas.svg" alt=""> Propostas</div>
                            </div>
                        </div>
                    </a>
                </li>
                <li>
                    <a href="noticias.html" data-view=".view-main" class="noticias-link item-link close-panel">
                        <div class="item-content">
                            <div class="item-inner">
                                <div class="item-title"><img class="icone" src="svg/noticias.svg" alt=""> Notícias</div>
                            </div>
                        </div>
                    </a>
                </li>
                <li>
                    <a href="galeria.html" data-view=".view-main" class="galerias-link item-link close-panel">
                        <div class="item-content">
                            <div class="item-inner">
                                <div class="item-title"><img class="icone" src="svg/galeria.svg" alt=""> Galeria</div>
                            </div>
                        </div>
                    </a>
                </li>
                <li>
                    <a href="videos.html" data-view=".view-main" class="videos-link item-link close-panel">
                        <div class="item-content">
                            <div class="item-inner">
                                <div class="item-title"> <img class="icone" src="svg/video.svg" alt=""> Vídeos</div>
                            </div>
                        </div>
                    </a>
                </li>
                <li>
                    <a href="contato.html" data-view=".view-main" class="contato-link item-link close-panel">
                        <div class="item-content">
                            <div class="item-inner">
                                <div class="item-title"><img class="icone" src="svg/contato.svg" alt=""> Contato</div>
                            </div>
                        </div>
                    </a>
                </li>

                <li>
                    <a href="envia_foto.html" data-view=".view-main" class="envia_foto-link item-link close-panel">
                        <div class="item-content">
                            <div class="item-inner">
                                <div class="item-title"> <img class="icone" src="svg/contato.svg" alt=""> Fale c/ o candidato</div>
                            </div>
                        </div>
                    </a>
                </li>

                <li>
                    <a href="#" data-view=".view-main" class="back item-link close-panel alert-text-title">
                        <div class="item-content">
                            <div class="item-inner">
                                <div class="item-title"> <img class="icone" src="svg/info.svg" alt=""> Créditos do App</div>
                            </div>
                        </div>
                    </a>
                </li>

                <li>
                    <a href="#" class="confirm-ok">
                        <div class="item-content">
                            <div class="item-inner">
                                <div class="item-title"><img class="icone" src="svg/fechar.svg" alt=""> Fechar Aplicativo</div>
                            </div>
                        </div>
                    </a>
                </li>

            </ul>
        </div>
    </div>
</div>
<!-- Views-->
<div class="views">
    <div class="view view-main">
        <!-- Top Navbar-->
        <div class="navbar theme-teal">
            <div class="navbar-inner">
                <div class="centerlogo sliding"><img src="img/logo.png" alt=""></div>
                <div class="right">
                    <a href="#" class="link icon-only open-panel"> <i class="icon icon-bars"></i></a>
                </div>
            </div>
        </div>
        <!-- Pages, because we need fixed-through navbar and toolbar, it has additional appropriate classes-->
        <div class="pages navbar-through toolbar-through">
            <!-- Page, data-page contains page name-->
            <div data-page="index" class="page bg_inicial">
                <!-- Scrollable page content-->
                <div class="page-content">

                    <div class="content-block-title">Welcome To My Awesome App</div>
                    <div class="content-block">

                        <div class="logo_home">
                            <img src="img/candidato2.png" class="logo-resize" alt="">
                        </div>

                        <div class="row">
                            <!-- Each "cell" has col-[widht in percents] class -->
                            <div class="col-50 icon_home">
                                <a href="noticias.html" data-view=".view-main" class="white noticias-link-atalho item-link close-panel">
                                    <img src="img/noticias.png" alt="">

                                    <p>Últimas notícias</p>
                                </a>
                            </div>

                            <div class="col-50 icon_home">
                                <a href="galeria.html" data-view=".view-main" class="white galerias-link-atalho item-link close-panel">
                                    <img src="img/galeria.png" alt="">

                                    <p>Galeria de fotos</p>
                                </a>
                            </div>

                            <div class="col-50 icon_home">
                                <a href="videos.html" data-view=".view-main" class="white videos-link-atalho item-link close-panel">
                                    <img src="img/video.png" alt="" />

                                    <p>Últimos vídeos</p>
                                </a>
                            </div>
                            <div class="col-50 icon_home">
                                <a href="contato.html" data-view=".view-main" class="white videos-link-atalho item-link close-panel">
                                    <img src="img/contato.png" alt="" />

                                    <p>Entre em contato</p>
                                </a>
                            </div>

                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- 
            <div class="toolbar theme-gray">
                <div class="toolbar-inner">
                    <a href="#">  <img class="link" src="img/logo_mentor.gif" alt=""></a>
                </div>
            </div>
            -->
    </div>
</div>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/framework7.min.js"></script>
<script type="text/javascript" src="js/my-app.js"></script>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="js/index.js"></script>
<script type="text/javascript" src="js/default.js"></script>
<script type="text/javascript" src="js/push.js"></script>
<script src="js/blueimp/blueimp-helper.js"></script>
<script src="js/blueimp/blueimp-gallery.js"></script>
<script src="js/blueimp/blueimp-gallery-fullscreen.js"></script>
<script src="js/blueimp/blueimp-gallery-indicator.js"></script>
<script src="js/blueimp/blueimp-gallery-video.js"></script>
<script src="js/blueimp/blueimp-gallery-vimeo.js"></script>
<script src="js/blueimp/blueimp-gallery-youtube.js"></script>
<script src="js/blueimp/vendor/jquery.js"></script>
<script src="js/blueimp/jquery.blueimp-gallery.js"></script>
<script src="js/jquery.mask.min.js" type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $('#cpf').mask('000.000.000-00', {
            reverse: true
        });
    })
</script>
</body>

</html>

Browser other questions tagged

You are not signed in. Login or sign up in order to post.