2012-08-26 33 views
7

我已經添加zxing條碼掃描器插件成功在我的android phonegap應用程序這裏是js代碼在頁面上顯示我能夠看到條形碼掃描儀屏幕。zxing條碼掃描儀在固定格在phonegap android應用程序

$('#scanpage').live('pageshow', function (event, ui) { 
    //navigator.notification.alert("Search page"); 

    window.plugins.barcodeScanner.scan(function(result) { 
     //navigator.notification.alert("We got a barcode\n" + "Result: " + result.text + "\n" +"Format: " + result.format + "\n" + 
      // "Cancelled: " + result.cancelled); 
     }, function(error) { 
     navigator.notification.alert("Scanning failed: " + error); 
    }); 

}); 

這裏是HTML5網頁代碼

div id="scanpage" data-role="page"> 
<div data-role="header" class="pageheader"> 

<div class="height30" style="padding-right:2%;"> 
<div class="back" style="margin-right:2%;"><a href="#homepage">Back</a></div> 
<div class="logo2" ><a href="#" ><img src="images/scan.png" style="padding-top:12px;" alt="Scan Code" /></a> 
</div> 
</div> 
</div> 

<div data-role="content" class="wrapper" style="width:100%"> 


<div style="background-color:#000000;" > 
<div style="height:400px;" id="scanarea"></div> 


<input name="" type="button" class="button" value="Focus and Scan" data-role="none" /> 

    </div><!-- inner div--> 


</div> 
    </div> <!-- end SCAN PAGE --> 

,但它是如何工作的,當我打開網頁,首先加載HTML,但在第二個整個屏幕上覆蓋有條形碼掃描器的窗口,我想解決這個問題在DIV'scanarea'中掃描區域。但不知道如何修復它在某些div區域,並在按鈕單擊掃描將執行並閱讀條形碼。

掃描窗口 enter image description here

html頁面 enter image description here

需要表現出這樣的 enter image description here

回答

2

條形碼掃描屏幕被實現爲完全隱藏的PhoneGap的Web視圖的Android活動。如果您想自定義此屏幕,您可能需要以某種方式更改其layout file

我假設你的按鈕「焦點和掃描」應該觸發一個手動掃描(默認是識別第一個條形碼,我認爲) - 因此你可能必須更改activity implementation以包含該按鈕的處理程序。

另請參見Simon Mac Donald's blog(他似乎在開發Android上的條形碼掃描插件)和this answer(這正是我上面寫的,snap:P)。

+0

讓我檢查一下。非常感謝你 – Ayesha

+0

你能幫忙在處理java掃描這裏是我的帖子http://stackoverflow.com/questions/12627100/perform-scanning-manually-on-button-click-for-barcodesacnner-plugin-android- IN-p – Ayesha