1

So i have this app i'm building and i'm a newbie to android apps. I am using phonegap to assist in making things easier. i used their example they have posted and when take the picture the app reverts back to the index page of my app instead of going to the page i want.

what i would like to know is where do i modify the code to go to another page and display the picture i just took?

here is some of my code:

    <script src="phonegap-1.1.0.js" type="text/javascript"></script>
</head>
<script type="text/javascript" charset="utf-8">

    var pictureSource;   // picture source
    var destinationType; // sets the format of returned value 

    // Wait for PhoneGap to connect with the device
    //
    document.addEventListener("deviceready",onDeviceReady,false);

    // PhoneGap is ready to be used!
    //
    function onDeviceReady() {
        pictureSource=navigator.camera.PictureSourceType;
        destinationType=navigator.camera.DestinationType;
    }

    // Called when a photo is successfully retrieved
    //
    function onPhotoDataSuccess(imageData) {
      // Uncomment to view the base64 encoded image data
      // console.log(imageData);

      // Get image handle
      //
      var smallImage = document.getElementById('smallImage');

      // Unhide image elements
      //
      smallImage.style.display = 'block';

      // Show the captured photo
      // The inline CSS rules are used to resize the image
      //
      smallImage.src = "data:image/jpeg;base64," + imageData;
    }

    // Called when a photo is successfully retrieved
    //
    function onPhotoURISuccess(imageURI) {
      // Uncomment to view the image file URI 
      // console.log(imageURI);

      // Get image handle
      //
      var largeImage = document.getElementById('largeImage');

      // Unhide image elements
      //
      largeImage.style.display = 'block';

      // Show the captured photo
      // The inline CSS rules are used to resize the image
      //
      largeImage.src = imageURI;
    }

    // A button will call this function
    //
    function capturePhoto() {
      // Take picture using device camera and retrieve image as base64-encoded string
      navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 50 });
    }

    // A button will call this function
    //
    function capturePhotoEdit() {
      // Take picture using device camera, allow edit, and retrieve image as base64-encoded string  
      navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 20, allowEdit: true }); 
    }

    // A button will call this function
    //
    function getPhoto(source) {
      // Retrieve image file location from specified source
      navigator.camera.getPicture(onPhotoURISuccess, onFail, { quality: 50, 
        destinationType: destinationType.FILE_URI,
        sourceType: source });
    }

    // Called if something bad happens.
    // 
    function onFail(message) {
      alert('Failed because: ' + message);
    }

    </script>
<body>




<div data-role="page" id="option" data-theme="e">
<div data-role="header" data-theme="e">
<h2 class="longHeader ui-title">Wedding Registry Scanner</h2>
</div>
<div data-role="controlgroup">
<div data-role="content" data-theme="d">
<a href="http://zxing.appspot.com/scan" data-role="button"><img src="images/upc.png"></a>
<a href="#" onclick="capturePhoto();" data-role="button"><img src="images/camera.png"></a>
<a href="manage.html" data-role="button"><img src="images/list.png"></a>

</div>
</div>

</div>
<div data-role="footer" data-theme="e">
        <h4 class="smallFont">Prejean IT Solutions 2011&copy;</h4>
</div>


<div data-role="page" id="capture" data-theme="e">
<div data-role="header" data-theme="e">
<h2 class="longHeader ui-title">Capture Photo</h2></div>
<div data-role="content" data-theme="d">
<img style="display:none;width:60px;height:60px;" id="smallImage" src="" />
    <img style="display:none;" id="largeImage" src="" />
</div>
</div>

EDIT: this is in my android manifest file.

<activity android:name="reg.scanner.DroidGap" 
        android:label="@string/app_name" 
        android:configChanges="orientation|keyboardHidden"> 
        <intent-filter> </intent-filter> 
        </activity>
Devin Prejean
  • 105
  • 1
  • 2
  • 16

3 Answers3

1

Its not your code.

The error is caused by poorly written Camera application.

Try installing a different Camera App - I use Go Camera 360

user782863
  • 11
  • 1
  • so the camera app built into android won't work? if thats the reason then i have to make every user download and install that app to use my app – Devin Prejean Dec 06 '11 at 23:05
0

I haven't used this, but I suspect that what you're seeing is a result of this line:

<a href="#" onclick="capturePhoto();" data-role="button">

(this has nothing to do with Android, obviously, since they're doing this via the web browser's connection to the underlying Android system).

href="#" will always go to the same page it's currently in. Presumably it has taken you through some steps (that looks like "pages" but in fact are just divs being hidden and displayed in some sequence) and it reloads the page, giving you the impression that you're "going" to the index page (when in fact you never left).

Try putting the location of your destination page in that href to see what happens.

And welcome to Stack. Don't forget to mark answers as correct, and upvote the ones that are the most useful.

-Cheers.

Yevgeny Simkin
  • 27,946
  • 39
  • 137
  • 236
  • the data-role is used with jquery mobile which i'm also using for design purposes. also, this code i gave you is off the page called option.html – Devin Prejean Dec 05 '11 at 19:13
  • just in case i replaced href="#" with href="#capture" which is a div on the option.html page. it still doesn't work. – Devin Prejean Dec 05 '11 at 19:20
  • href doesn't care about divs. If you start it with # it will reload the page (and look for an anchor named 'capture' in your case). You said you want it to go to some other page... what other page do you want it to go to? Why not set this other page as the destination for your link? – Yevgeny Simkin Dec 05 '11 at 23:46
  • i in jquery mobile you set each "page" as a div and have buttons link to the div which then go to that div and display it. i guess i can make a whole new html page for it... – Devin Prejean Dec 06 '11 at 23:04
  • I don't know anything about jQuery or jQuery mobile (you may want to add those to your tags, so people know what they're answering). As far as that HTML is concerned, unless that plug-in is part of jQuery mobile (as I said, I'm not familiar with it), the default behavior is for the page to act on the href as it normally would. Since I can't see any of the underlying javascript, I have no idea what else is going on. In your example you only include phonegap-1.1.0.js. Is that part of jqMobile? And does it override native href behavior? I suspect not, but that's where you need to look. – Yevgeny Simkin Dec 07 '11 at 00:15
  • Phonegap is a framework for smartphone development. I'll add the tags – Devin Prejean Dec 07 '11 at 04:08
0

Please make sure you have the following attribute in your main activity tag in your AndroidManifest.xml

android:configChanges="orientation|keyboardHidden"

without it the orientation change will force the WebView to reload.

Simon MacDonald
  • 23,253
  • 5
  • 58
  • 74
  • I want to stop the activity page reloading... not a webview... give me any idea. After taking the Photo, Activity page is reloaded. want to stop this. – Ponmalar May 09 '12 at 11:43
  • Did you put those configChanges in your Manifest? That will stop the activity from reloading when you come back from the camera. – Simon MacDonald May 09 '12 at 13:19