Monday, December 31, 2012

Converting an Existing App to use ActionbarSherlock


I recently converted the Connexions app to use ActionbarSherlock.  This removed the dreaded menu button of shame when the device is running on Honeycomb and above.  It also had the side benefit of removing the menu button on Gingerbread and below.  It was fairly simple to migrate the app.  This post assumes you are able to add ActionbarSherlock as a library to your existing app.

Activities

All of the Activities were changed to extend ActionbarSherlock classes instead of the usual Android classes. Activity was changed to SherlockActivity, ListActivity to SherlockListActivity, etc.

Menus

Two Android menu classes were replaced wth the similar ActionbarSherlock classes

  • Menu
  • MenuItem

The menu XML files were modified to add the android:showAsAction attribute.  If you want the item to show up as a button on the Actionbar, set it to "ifRoom".  Otherwise, set it to "never" and the item will show up in the overflow drop down.

Actionbar

The Actionbar is accessed by calling getSupportActionbar().  Once you have a reference to the Actionbar, you can set the title by calling setTitle().

Progress Bar

The ProgressDialog and ActionbarSherlock did not play well together, so I removed the dialog and replaced it with the indeterminante progress spinner in the Actionbar.  To do this, I called setSupportProgressBarIndeterminateVisibility(true) in the onCreate() method and then set it to false when the Activity finished loading data.  You can see an example in almost all of the Activity classes

The code is available from our repository in GitHub. The Connexions for Android app is available in the Google Play Store or from the Connexions website.

Sunday, October 14, 2012

Copy Text in a WebView in Android 2.3 and Below

Copy functionality in a WebView is available by default in Android 3.0 and above.  To enable copy in version below 3.0, there is a little code that has to be added.  The first thing I did was add a Copy button to my Actionbar at the bottom of the view.

ImageButton copyButton = (ImageButton)findViewById(R.id.copyButton);
if(Build.VERSION.SDK_INT < 11) 
{
    copyButton.setOnClickListener(new OnClickListener() 
    {
              
          public void onClick(View v) 
          {
              emulateShiftHeld(webView);

          }
      });
}
else
{
    copyButton.setVisibility(View.GONE);
}

The code checks to see if the version of Android is less than 11 which is Honeycomb. If it is, then the emulateShiftHeld() method is called. If the version is 11 or above, the Copy button is not needed (copy is available by default), so the Copy button is hidden. Here is the code for emulateShiftHeld()

private void emulateShiftHeld(WebView view)
{
    try
    {
        KeyEvent shiftPressEvent = new KeyEvent(0, 0, KeyEvent.ACTION_DOWN, KeyEvent.KEYCODE_SHIFT_LEFT, 0, 0);
        shiftPressEvent.dispatch(view);
        if(Build.VERSION.SDK_INT == 10) 
        {
            Toast.makeText(this, "Select Text then tap the text", Toast.LENGTH_LONG).show();
        }
        else
        {
            Toast.makeText(this, "Select Text", Toast.LENGTH_LONG).show();
        }

    }
    catch (Exception e)
    {
        Log.e("dd", "Exception in emulateShiftHeld()", e);
    }

}

The behavior of Gingerbread is different from versions before Gingerbread. In Gingerbread (version 10), the user has to select the text to copy and then tap the screen to have it added to the clipboard. In earlier versions, when the user conpletes the selection, the text is automatically added to the clipboard. Because of the different ways to copy, the version is checked and different instructions are displayed in a Toast.

You can get the code from our repository in GitHub. Connexions for Android is available in the Google Play Store or from the Connexions website.

Saturday, May 12, 2012

Using ListView as Part of Android Layout

I've written other posts about using a ListView.  This one covers using a ListView as part of an overall layout.  The first screen of the Connexions for Android app has a ListView for the bottom half of the screen.  The top half is an image and a search box.  To get the layout correct, I had to nest several layouts.

The layout for the screen is in the landing.xml file.  The nesting of the layout is

Linear Layout
    Linear Layout
        Relative Layout
    Relative Layout
    Linear Layout
   
The ListView is in the last LinearLayout.  The Layout for the ListView is pretty straightforward.
...
<LinearLayout
    android:id="@+id/relativeLayout2"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" 
    android:background="@color/blue_background">

    <ListView
        android:id="@+id/landingList"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:cacheColorHint="#00000000"
        android:fastScrollEnabled="true"
        android:smoothScrollbar="true" />
</LinearLayout>

...
The list layout is in the landing_list.xml file.  It is somewhat similar to the List layout for the booklists with the exception of there is only one line of text which is centered in the list item.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="@color/blue_background"
    android:cacheColorHint="#00000000">
    
  <LinearLayout
      android:id="@+id/LinearLayout01"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:orientation="vertical"
      android:gravity="center"
      android:layout_alignParentLeft="true"
      android:layout_toLeftOf="@+id/arrowView">
        <TextView
               android:id="@+id/optionName"
               android:layout_width="fill_parent"
               android:layout_height="wrap_content"
               android:layout_marginTop="15dip"
               android:layout_marginBottom="15dip"
               android:layout_marginLeft="3dip"
            style="@style/TextAppearance.Title.Landing" />
      
  </LinearLayout>
    <ImageView
           android:id="@+id/arrowView"
      android:layout_width="24sp"
      android:layout_height="24sp"
      android:layout_alignParentRight="true"
          android:layout_centerVertical="true"
        android:layout_margin="6sp" 
      android:layout_toRightOf="@id/lensOther"
      android:src="@drawable/arrow"/>
</RelativeLayout>

As always, you can browse the source or download a zip file of the source. Connexions for Android is available in Google Play or from the Connexions website.