Topic
IC4NOTICE: developerWorks Community will be offline May 29-30, 2015 while we upgrade to the latest version of IBM Connections. For more information, read our upgrade FAQ.
8 replies Latest Post - ‏2012-12-11T16:38:56Z by SystemAdmin
SystemAdmin
SystemAdmin
2327 Posts
ACCEPTED ANSWER

Pinned topic WL.App.overrideBackButton

‏2012-12-04T08:06:01Z |
Hello, Im doing an application, and in the android version i want the backbutton to work.. so Ive researched and found out its this function i have to use but what i couldnt find was how i use this and dojoviews.

This is a part of my Javascript code in Andoird --> JS --> projectname.js

The question is am I placing this code in the right place? am i doing the code wrong? My views are named like Info Graduate About and so on. Now when i press the backbutton it still closes my program. Any help would be appreciated.

function initBackButton() {
WL.logger.debug('AFR.js Android: Back button handler installed');
WL.App.overrideBackButton(backKeyDownFunction);

}
function backKeyDownFunction(){
WL.logger.debug('AFR.js Android: backKey pressed on view:'+ currentView.id);
switch (currentView.id)
{
case "Info"
currentView.performTransistion("MainView01",1,"fade",null);
break;
case "Graduate"
currentView.performTransistion("Info",1,"fade",null);
break;
default:
//All other views returns to the main view
WL.TabBar.setSelectedItem('about');
currentView.performTransition('MainView01',1,"fade",null);
return;
}
}
  • IdanAdar
    IdanAdar
    741 Posts
    ACCEPTED ANSWER

    Re: WL.App.overrideBackButton

    ‏2012-12-04T08:23:26Z  in response to SystemAdmin
    I don't quite follow what you're doing with "initBackButton" as it is not something that you need to initialize, it is already so.
    We do not provide an API to disable or enable it, only to override it.

    For example, if your traverse between "pages" in your app, and you want the back button to return to the previous page instead of quit the app, you use the WL.App.overrideBackButton API to do, as instructed in the documentation: http://public.dhe.ibm.com/ibmdl/export/pub/software/mobile-solutions/worklight/docs/wl_5_0_dev_ref.pdf

    Which device/OS are you testing this on? Android, iOS?
    I see you use transitions. Is this done via jQuery Mobile? Worklight-based Fragments and Pages?

    Idan Adar
    QA Engineer
    IBM Worklight Mobile Platform
    • SystemAdmin
      SystemAdmin
      2327 Posts
      ACCEPTED ANSWER

      Re: WL.App.overrideBackButton

      ‏2012-12-04T08:42:04Z  in response to IdanAdar
      The initBackButton i found in one of the guides that told me how to do it, so i dont need it?

      Im using dojox mobile 1.7.2. the original page swapping is done through dojo. Ill paste a code snippet from the html file. Im doing this for Android and Iphone but the backbutton i do want for android and im testing it with API 17 and in a HTC Phone (not sure which phone it is)

      More about Cultures

      • x

      • The code above is for the view and the header and also a backbutton that is there for Iphone.
        The code below is a button to move forward in the app

        <button data-dojo-type="dojox.mobile.ToolBarButton"data-dojo-props="transition:'fade',dir:'1',moveTo:'GBS'"class="buttonMed">Global Business Services</button>
      • SystemAdmin
        SystemAdmin
        2327 Posts
        ACCEPTED ANSWER

        Re: WL.App.overrideBackButton

        ‏2012-12-04T08:44:23Z  in response to SystemAdmin
        hmm my code for the view/head and backbutton seem to become something instead of just being code

        div data-dojo-type="dojox.mobile.ScrollableView" id="Morecult"
        data-dojo-props="selected:false,scrollDir:''" style="background-image:url(images/background.jpg); background-size: cover; height:100%; width:100%;">

        More about Cultures

        • x
        • </h1

          Hopefully you can see it now

  • IdanAdar
    IdanAdar
    741 Posts
    ACCEPTED ANSWER

    Re: WL.App.overrideBackButton

    ‏2012-12-04T09:00:11Z  in response to SystemAdmin
    Use "{ code } ... something here ... { code }" (minus the spaces) to paste code.

    I will wait for someone with better Dojo understanding to help you out here.

    Idan Adar
    QA Engineer
    IBM Worklight Mobile Platform
    • SystemAdmin
      SystemAdmin
      2327 Posts
      ACCEPTED ANSWER

      Re: WL.App.overrideBackButton

      ‏2012-12-04T09:04:04Z  in response to IdanAdar
      Oh im sorry im new to Dev works.

      
      <div data-dojo-type=
      "dojox.mobile.ScrollableView" id=
      "Morecult" data-dojo-props=
      "selected:false,scrollDir:''"> <h1 data-dojo-type=
      "dojox.mobile.Heading" data-dojo-props=
      "fixed:"top
      ""><img src=
      "logo.png" class=
      "logo"></img><p style=
      "margin-top:-1px; margin-right:70px;"><p style=
      "margin-top:-3px;">More about Cultures </p> <li data-dojo-type=
      "dojox.mobile.TabBarButton" class=
      "buttonBack" data-dojo-props=
      "transition:'fade',dir:'-1',moveTo:'Services'">x</li> </h1>
      


      now there it is!
      • Eric Durocher
        Eric Durocher
        38 Posts
        ACCEPTED ANSWER

        Re: WL.App.overrideBackButton

        ‏2012-12-04T17:19:29Z  in response to SystemAdmin
        Hello,

        Rather than overriding the back button's behavior, you should use the "bookmarkable" feature of Dojo Mobile.

        Please have a look at this page that explains how to use this:

        https://dojotoolkit.org/reference-guide/1.8/dojox/mobile/bookmarkable.html

        Note that you can also use the second part ("The bookmarkable feature in 1.8") since the version of Dojo Mobile included in Worklight since 5.0 is 1.8 (even though Dojo itself is 1.7).

        Hope this will help.

        Eric
  • SystemAdmin
    SystemAdmin
    2327 Posts
    ACCEPTED ANSWER

    Re: WL.App.overrideBackButton

    ‏2012-12-11T07:23:48Z  in response to SystemAdmin
    Thanks! It works perfectly fine now!
    • SystemAdmin
      SystemAdmin
      2327 Posts
      ACCEPTED ANSWER

      Re: WL.App.overrideBackButton

      ‏2012-12-11T16:38:56Z  in response to SystemAdmin
      You might still want to override the back button.

      Requiring dojox/mobile/bookmarkable and putting hash tags in your view navigation does most of what you might want but what do you want to happen if the back button is pressed when you have already backed up all the way to the initial page?

      The default behavior is to exit the app.

      If you want to remain on the initial page when there is no more history to back up through and the back button is pressed, put :

      WL.App.overrideBackButton(function() {history.back();});

      in wlEnvInit() in the Android Environment.

      If you want the back button to cause the app to exit when there is no more history, then all you need is bookmarkable.