PhoneGap - problem solving in the first application

PhoneGap is an HTML5 platform for developing applications for 7 existing mobile platforms. A few days ago they were updated to version 1.2.0 and moved under the Apache wing. The repository address is also updated. The documentation in the site is a wonderful step-by-step instruction for creating the first application, so we will no longer dwell on the intro part, we have already written about it. Small problems begin when a little bit beyond the standard capabilities of the platform, but everything can be solved.

Formulation of the problem

I wanted to make a Dutch-Russian dictionary for Android in the absence of a decent market. I came across a dictionary scanned with a good paper. The process of extracting information from images deserves a separate article. Therefore, skip this part. As a first step, I made a dictionary in the form of an html page. According to the instructions for creating "hello world" made the application and it started successfully. Then it was necessary to process the file and bring to mind the details.

Settings

To store the settings I used window.localStorage . I made a dialogue on the main html page with the necessary input fields and hung up the handler on the ' menubutton ', ' backbutton ' events to show / hide / save it. Everything works as it should. Later added to the same storage query history.

The inscription on the default button

When you open the software keyboard, the default button is labeled ' GO '. Which is not very consistent with the work with the dictionary. The framework documentation does not cover this situation in any way. The documentation in the SDK talks about setting the input android: imeOptions attribute. But of course inside the browser it does not work. Several times I rummaged the Internet in search of a solution. Finally, I came across a working version for the iPhone - instead of <input type="text" /> you must use <form><input type="search" /></form> And the form element is required. Under Android, it works without form, and the form is even harmful, since it is sent and it is necessary to prevent this business. So use <input type="search" /> and the default button magically turns into ' Search '.
')

Exit application

In the framework, there is an API for this - navigator.app.exitApp() . As it turned out, it just doesn't work out of the box. To make it work in AndroidManifest.xml, you must prescribe <uses-sdk android:minSdkVersion="2" /> . In the new version 1.2.0, the problem has already been fixed, so this is another reason to upgrade.

Translation from clipboard

In the reader ( CoolReader ) there is a copy of the word to the buffer. Therefore, in order not to make extra gestures when calling the dictionary, but to receive a translation right away, I wanted to get access to the clipboard. By default, this is not possible, but the platform is easily expanded by plugins. Found a plugin that provides an API for working with the buffer. Included was a bunch of others (27 pieces) - phonegap-plugins . Take a look, you will not regret.
Now the process looked like this - I saw an unfamiliar word, tapped it twice (a word in the buffer), called the task manager (a long tap), chose a dictionary (another tap) and opa - the translation is already here. I pressed the cancellation - and again in the reader.

Automatic call and transfer

But there is no limit to perfection. I wanted even less body movements. The reader has integration with 2 dictionaries - Fora Dictionary and 2 ways to call ColorDict. I downloaded the sources of the reader, since they are open, I looked at how the call takes place. Unfortunately, both dictionaries are sewn, although they are called in the standard way and could be configured. Therefore, the idea arose to pretend, for example, the odds. This instruction from the SDK documentation is quite enough to implement the required search interface, get the string passed in for the search and pass it by the parameter in the URL. The standard implementation of onCreate began to look like this:

  @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); Intent intent = getIntent(); String url = "file:///android_asset/www/index.html"; if (Intent.ACTION_SEARCH.equals(intent.getAction())) { url += "?search=" + intent.getStringExtra(SearchManager.QUERY); } super.loadUrl(url); } 

But this code only transmits the search string when creating the application. To get the search string when the application is already in the background, it was necessary to add another method to the standard Java code:

  @Override protected void onResume() { super.onResume(); Intent intent = getIntent(); if (Intent.ACTION_SEARCH.equals(intent.getAction())) { String sQuery = intent.getStringExtra(SearchManager.QUERY); this.appView.loadUrl( "javascript:try{PhoneGap.fireDocumentEvent('search', {detail: '" + sQuery + "'});}catch(e){};" ); } } 

The code generates a new event ' search ' for javascript and transmits the necessary data. How to create your own events peeped in the source code PhoneGap.
In order for the reader to think that it is causing a head start, I had to rename the classes. I looked up the necessary name in the source code of the reading room. This is of course not entirely correct, but will fit for private use.
Now the use of the dictionary was perfect - I saw an unfamiliar word, I tapped it twice - the dictionary showed the translation, I pressed the cancellation - again in the reader.

Drop application when changing screen orientation

After adding a search interface and renaming classes to a new project, the application began to fall out when changing orientation with the error "can't save it." Since the search showed that this problem happens, I will mention how it was resolved. What exactly was decisive, I did not understand. When creating a new project, I missed in AndroidManifest.xml
- in the root element manifest :

  <supports-screens android:largeScreens="true" android:normalScreens="true" android:smallScreens="true" android:resizeable="true" android:anyDensity="true" /> 

- did not create activity in the application element:

  <activity android:name="com.phonegap.DroidGap" android:label="@string/app_name" android:configChanges="orientation|keyboardHidden"> <intent-filter></intent-filter> </activity> 

In all android:configChanges="orientation|keyboardHidden" attribute is needed. Of course, I myself nakosyachil, because “hello world” has it all. Just be careful.

The application turned out very modest size - 186k ​​(not counting the dictionary data). Although initially there was an idea after PhoneGap to do everything according to the standard process, but since the result is 100% satisfied, then I don’t see the point.

Shl. Thanks to Vadim Lopatin for the Cool Reader with the source code, thanks to the creators of PhoneGap for the accessible source code platform, thanks to the creators of the plugins sorts, the github for access to the sources, and the bit package for keeping mine.