Menu appears in emulator, but does not appear on mobile

Asked

Viewed 901 times

2

I created an app in Eclipse using the Intel Appframework, with HTML5 and everything. In Browser it runs normal, Android emulator runs normal; however, when I export APK, it does not show the menu, which in this case is a div footer, with some icons.

In APK (running directly on mobile), appears only the first page of the app and nothing else. How to solve this?

    <!DOCTYPE html>
<html>
<head>
    <title>  </title>
<!--
    This template can be used for simple tab view application that has tabs at the bottom to switch views, for applications like Phone app, Facebook App or Instagram app.
--> 
    <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0;" />
<style type="text/css">

.list-image {float: left;width: auto;height:50px}
.list-text {margin-left: auto;min-height:50px}   


</style>

</head>
<body> 
<div id="afui">

    <div id="content" style=""> 

    <!--Tab View Pages-->
        <div class="panel" title="Home" id="page1" data-tab="tab1" selected="true">
            <header>
                <h1><b>Quem somos</b></h1>
            </header>

            <p>A   &   é uma ótima oportunidade para pessoas que querem ganhar um dinheiro a mais. 
                A empresa de venda social permite às mulheres ter seu próprio negócio de moda ao tornar-se uma estilista, a qual é responsável 
                pelas vendas das joias da marca. Os produtos são exclusivos, com características finas e delicadas, e elaborados por profissionais 
                com mais de 10 anos de mercado, que fazem com total zelo e dedicação a produção e finalização dos itens. 
                O papel da estilista é auxiliar a potencial compradora a escolher as joias da marca que mais realçarão sua beleza.<br /> 
                A   &   disponibiliza ferramentas online para ajudar a estilista a conquistar clientes fiéis e oferece 50% 
                de desconto para adquirir os primeiros itens. <br />
                Sem dúvidas, ser uma parceira de negócios da   &   traz 
                muitas vantagens para a mulher moderna!</p>
        </div>



        <!-- Tendências -->


        <div class="panel" title="Favorites" id="page2" data-tab="tab2">
            <header>
                <h1>Tendências</h1>
            </header>
            <p>Esteja sempre linda, acompanhe nossas dicas e fique por dentro das tendências.</p> <br />

           <ul class="list">

                <li>
                    <img class="list-image" src="imagens/brincos2.jpg" /> &nbsp;
                    <a href="#detailview">Agarradinho as orelhas</a>

                </li>
                <li>
                    <img class="list-image" src="imagens/caselux.jpg" /> &nbsp;
                    <a href="#detailview2">Arrumando as malas</a>

                </li>
                <li>
                    <img class="list-image" src="imagens/colar.jpg" /> &nbsp;
                    <a href="#colar">1001 colares</a>

                </li>

            </ul>



        </div>

        <div class="panel" title="Dicas" id="page3" data-tab="tab3">
            <header>
                <h1>Dicas de Moda</h1>
            </header>
            <p>Acompanhe nossas dicas e esteja sempre fashion</p>
            <ul class="list">

                <li><a href="#detailview">Anéis</a></li>
                <li><a href="#detailview2">Brincos</a></li>
                <li><a href="#detailview">Colares</a></li>
                <li><a href="#detailview">Pedras</a></li>

            </ul>
        </div>
                <div class="panel" title="Brincos" id="detailview" data-footer="none">
                                    <img src="imagens/brincos.jpg" alt=" " style="max-width: 100%; border-image:round"/>
            <p>
                <br />
                Agarradinhos às orelhas, os solitários e brincos curtos são ideais tanto para o dia como para a noite.<br />
                E melhor ainda ficam bem em qualquer formato de rosto.<br />
                Basta apenas escolher o modelo conforme a ocasião que você vai utilizar.

            </p>


            <br />

        </div>

        <div class="panel" title="Viajar" id="detailview2" data-footer="none">
            <p>
                <p style="text-align: center"> <b>Vai viajar?</b> </p>
                <br />
                Que bom, viajar é ótimo!<br />
                Traz um ar novo a tudo, muda o ambiente, permitindo um novo olhar sobre as coisas.<br />
                Para montar sua mala, em primeiro lugar, escolha as roupas que deseja levar.<br />
                Depois  escolha seus acessórios que possam fazer conjuntos entre si.<br />
                Não esqueça que um dia pode ter até três programas, um programa matinal, um à tarde e outro, geralmente mais sofisticado, à noite.  

            </p>

            <p>
                E o mais importante é como você vai transportar suas joias dentro da mala ou bolsa.<br />
                Pensando nisso a  &  lançou os <b>Cases Lux</b> para solucionar essa questão para voce.<br />
                Se vai ser uma viajem curta invista no <b>Case Mini Lux</b>, prefeito para ser colocado na bolsa e garantir a segurança das joias.<br />
                Mas, se sua viagem for durar uma semana ou mais aposte no Case Lux, tem compartimentos suficientes para várias opções.<br />


            </p>
                <img src="imagens/caselux.jpg" alt=" " style="max-width: 100%; border-image:round" />
                <img src="imagens/caselux2.jpg" alt=" " style="max-width: 100%; border-image:round" />
                <img src="imagens/caselux3.jpg" alt=" " style="max-width: 100%; border-image:round" />


        </div>


        <div class="panel" title="Agarre seu colar" id="colar" data-footer="none">
            <p>
           <p>
                Um, dois, três, quatro colares longos de pedras.<br />
                Isso mesmo você pode usá-los juntos para fazer parecer que é um só.<br />
                Monte o seu com todas as opções que você mais gosta!<br />

            </p>

                <img src="imagens/colar3.jpg" alt=" " style="max-width: 100%; border-image:round"  /> &nbsp;
                <img src="imagens/colar.jpg" alt=" " style="max-width: 100%; border-image:round"  />
                <img src="imagens/colar2.jpg" alt=" " style="max-width: 100%; border-image:round"  />

        </div>



    </div>

    <!--Footer with Tabs or Navigation bar -->
    <div id="navbar">
        <a href="#page1" id='tab1' class="icon home" data-transition="none">Home</a>
        <a href="#page2" id='tab2' class="icon heart" data-transition="none">Tendências</a>
        <a href="#page3" id='tab3' class="icon info" data-transition="none">Dicas</a>
   <!--     <a href="#page4" id='tab4' class="icon user" data-transition="none">Profile</a>-->
    </div>

</div>
</body>


    <script type="text/javascript"  src="js/jquery-1.10.2.min.js"></script>
    <link rel="stylesheet" type="text/css" href="appframework/af.ui.css" />
    <link rel="stylesheet" type="text/css" href="appframework/icons.css" />
    <script type="text/javascript" charset="utf-8" src="appframework/appframework.ui.min.js"></script>



 <script type="text/javascript">
        function onDeviceReady() {
            $.ui.launch();
            intel.xdk.device.hideSplashScreen();
        }
        document.addEventListener("intel.xdk.device.ready", onDeviceReady, false);
    </script>


    <script type="text/javascript">
        $.ui.autoLaunch = false;
        $.ui.animateHeaders = false;

        $(document).ready(function () {
            $.ui.launch();
        });
    </script>    


</html> 

Errado

Correto

  • 1

    Could you further detail your problem? Show some code? A screenshot of the error?

  • @Felipeavelar I can’t add image here, but I’ll post my code for you to see. Basically it is an app developed in HTML5 with the Intel appframework, simple thing, just for display of texts, nothing much, instead of the conventional menu, it has a div that is in the footer of the page where it contains this such menu, with icons, very cool... In the emulator it appears normal, without any change,with the menus in a good, but when I export the application and install it directly on my Smartphone, the menu does not appear.

  • @Felipeavelar managed to add the images

  • 1

    Try to take a logcat from your device running the app... It would help a lot to identify the problem.

1 answer

2

The whole problem was caused because the SDK did not carry a single image and triggered a series of errors throughout the project.

Just remove the link from the project image and everything went well.

Thanks to the @Igor.Araujo tip I analyzed Logcat and could understand the problem.

Browser other questions tagged

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