Navigating between pages in ADF Mobile with Swipe gestures

Mobile users are getting used to specific touch gestures, such as swipe, in their applications. And sometimes you might want to incorporate those gestures as a means for navigating between pages in your ADF Mobile application.

You can do this by using the amx:actionListener component and having it bind to a method in your backing bean.

The basic ingredients:

In an AMX page add an actionListner to a component for example:

         <amx:listItem id="li1">
            <amx:outputText value="#{row.name}" id="ot3"/>
            <amx:actionListener id="al1" type="swipeLeft" binding="#{viewScope.ma.navigateMethod}"/>
          </amx:listItem>

The binding edit function in the property inspector can help you create the above managed bean (ma).

In the managed bean you can code this:

    public void navigateMethod(ActionEvent actionEvent) {
        AdfmfContainerUtilities.invokeContainerJavaScriptFunction(AdfmfJavaUtilities.getFeatureName(), "adf.mf.api.amx.doNavigation", new Object[] { "go" });
    }

In your taskflow for the feature have a navigation rule like this:

      <control-flow-case id="__3">
        <from-outcome>go</from-outcome>
        <to-activity-id>camera</to-activity-id>
      </control-flow-case>

Now with a swipe to the right on the list item you'll navigate to the camera page.


Comments:

Hi,
I m new in ADF Mobile & didn't got your point,
can you send me full step by step code of above example.
and can I use Jdeveloper 11.1.2.4 on Windows 8.

Posted by guest on March 02, 2014 at 06:30 PM PST #

Hi Shay - thanks very much for this. Do you have any thoughts on a clean way to make a full page swipeable? I've got a scenario where I want to show different charts for a given data set, and I'd like navigation to be with left and right swipes, as if navigating a carousel (but essentially different representations of one record). Since the actionListener can only be a child of an artifact with its own listener, my current approach is to put my header for each page in to a dummy ListView with one static ListItem containing the outputText and the actionListeners. But I'd really like to let the whole panePage - or at least the chart area - be swipeable. Is there any sort of larger container with a listener I can use to achieve this? I've been looking through the tag library of items I don't use that often and haven't found the solution yet.

Posted by guest on April 09, 2014 at 10:47 AM PDT #

Post a Comment:
  • HTML Syntax: NOT allowed
About

me
I'm a Director of Product Management for the Oracle Java Development Tools.
Follow me:
Search

Archives
« April 2014
SunMonTueWedThuFriSat
  
1
2
3
4
5
6
7
8
9
10
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
   
       
Today