Surviving w/ Android

Android development blog
Tutorials about Android dev topics

A Guide to Android RecyclerView and CardView

Topics covered

RecyclerView

CardView

Android adapter

The new support library in Android L (Lollipop) introduced two new UI widgets: RecyclerView and CardView. The RecyclerView is a more advanced and more flexible version of the ListView. This new component is a big step because the ListView is one of the most used UI widgets. The CardView widget, on the other hand, is a new component that does not "upgrade" an existing component. In this tutorial, I'll explain how to use these two widgets and show how we can mix them. Let's start by diving into the RecyclerView.

RecyclerView: Introduction

As I mentioned, RecyclerView is more flexible that ListView even if it introduces some complexities. We all know how to use ListView in our app and we know if we want to increase the ListView performances we can use a pattern called ViewHolder. This pattern consists of a simple class that holds the references to the UI components for each row in the ListView. This pattern avoids looking up the UI components all the time the system shows a row in the list. Even if this pattern introduces some benefits, we can implement the ListView without using it at all. RecyclerView forces us to use the ViewHolder pattern. To show how we can use the RecyclerView, we can suppose we want to create a simple app that shows a list of contact cards. The first thing we should do is create the main layout. RecyclerView is very similar to the ListView and we can use them in the same way:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
                xmlns:tools="http://schemas.android.com/tools"
                android:layout_width="match_parent" 
                android:layout_height="match_parent"
                android:paddingLeft="@dimen/activity_horizontal_margin" 
                android:paddingRight="@dimen/activity_horizontal_margin"
                android:paddingTop="@dimen/activity_vertical_margin"
                android:paddingBottom="@dimen/activity_vertical_margin"
                tools:context=".MyActivity">
   <android.support.v7.widget.RecyclerView
             android:id="@+id/cardList"
             android:layout_width="match_parent"
             android:layout_height="match_parent"/> 
</RelativeLayout>
As you'll notice from the layout shown above, the RecyclerView is available in the Android support library, so we have to modify build.gradle to include this dependency:
dependencies {
...
compile 'com.android.support:recyclerview-v7:21.0.0'

}

Develop android weather app with Material Design

Topics covered

Material design

Weather app

Android toolbar

Android material colors

Android material guidelines

This post describes how to create a weather app using material design guidelines. Material Design is  a set of rules for visual design, UI interaction, motion and so on. These rules help developer when they design and create an Android app.
This post wants to describe how we create a weather app using  Weatherlib as weather layer and Material design rules. We want to develop this app not only for Android 5 Lollipop that supports Material design natively but we want to support previous version of Android like 4.x Kitkat. For that reason we will introduce appCompat v7 library that helps us to implement the Material Design even in the previous Android versions.
We want to code an app that has a extended Toolbar that holds some information about the location and current weather and some basic weather information about temperature, weather icon, humidity, wind and pressure. At the end we will get something like the pic shown below:



Android project set up

The first thing we have to do is configuring our project so that we can use Weatherlib and especially appCompat v7. We can open build.graddle and add these lines:
dependencies {
    compile fileTree(dir: 'libs', include: ['*.jar'])
    compile 'com.android.support:appcompat-v7:21.0.+'
    compile 'com.mcxiaoke.volley:library:1.0.6@aar'
    compile 'com.survivingwithandroid:weatherlib:1.5.3'
    compile 'com.survivingwithandroid:weatherlib_volleyclient:1.5.3'
}

Now we have our project correctly set up, we can start defining our app layout.

Control Sphero using Temperature Sensor in Android

Topics covered

Sphero 2

Sphero Android SDK

Android temperature sensor

Android Service

Android Broadcastreceiver

Android AlarmManager

One of the most interesting topic around Android it is how we can connect our smart phones to other devices or smart devices to get information from them or to control them.
In this post I want to introduce a new way to use our Android phone and explain how we can use it to control Sphero ball.

Introduction

In this Android project, I want to describe how we can integrate the temperature sensor inside the smart phone to control the Sphero ball color. In other words, I want to change the color ball according to the temperature measured by the smart phone even if the smart phones is in the stand by mode or the Activity is not in the foreground.
This is an interesting project because it can be used to describe some important concept:
and finally, but not less important, how to connect and use Sphero ball with its SDK. What we want to design an app like shown below:



Android promoted Actions: Floating action button (FAB)

Topics covered

Promoted Actions

Floating Action Button (FAB)

Custom component

Material design

Recently new design pattern were introduced in Android. One of the most known pattern is the Promoted Actions. They are actions that  are directly visible in the UI instead of using action bar button; for this reason these actions are called promoted, they can be easily accessed and define the main action in the current UI. For example, if we are using an email app and we are listing the inbox folder, one promoted action can be a new mail. The visual pattern is called Float Action Button (or FAB) because the promoted action can be represented using a floating circular button on the UI.
This type of design patterns are available in Android L but we can create a floating button also in previous Android version. Let us suppose we have a list of elements in our UI, the promoted action can be ‘Add new item’, so we can have something like the pic shown below:

android_floating_action_button_1

There are several way we can use to crate a floating action button.

Floating action button using ImageButton

The first way to create a FAB is using the ImageButton, we simply add the ImageButton to our UI layout and exploit some new features provided by Android L.
<ImageButton
android:layout_width="56dp"
android:layout_height="56dp"
android:src="@drawable/plus"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_marginRight="16dp"
android:layout_marginBottom="16dp"
android:tint="@android:color/white"
android:id="@+id/fab"
android:elevation="1dp"
android:background="@drawable/ripple"
android:stateListAnimator="@anim/fab_anim"
/>

If we look above, we can notice it is a normal ImageButton that we place usually at lower right corner. There are some aspects we should consider:
  • Background
  • Shadow
  • Animation

HAXM Module problem in OS X Yosemite: Fix

Topics covered

HAXM

Fix Yosemite HAXM

Fast android emulator

OS X AVD

After upgrading my Macbook Pro to Yosemite beta version, i experienced some problems starting Android emulator because HAXM didn’t work anymore. It was really a problem, because the emulator was really slow and hanged for long time. The first step i made was trying to re-install the HAXM. Even if the installation completed correctly and everything was compatible with HAXM requirement, at the end of the installation process i get i message explaining that the HAX installation couldn’t work properly. I decided to find a solution on the net and finally i find out something that could help me. In this post i’d like to explain how i made HAXM working on Yosemite. Some fo these information are extracted from here.

HAXM Problem

The first step is to check why HAX module doesn’t work. Instead of starting the emulator from Android Studio, you can start it from the command line and set some parameters.

./emulator -avd your_avd -verbose

Using this command you start the emulator and it shows the logs on the stdout. If you take some time reading them, you can notice that after some lines describing the type of AVD you are starting and so on there is some lines like those shown below:


As you can see the log shows a message saying that is impossible to open HAX module even if it is installed correctly.

We can investigate more the problem, using the command kextload:

sudo kextload -bunlde-id com.intel.kext.intelhaxm

the result is shown below:



It doesn't help us much, it just says it is impossible to load the module. The next step is using kextutil:

sudo kextutil -bunlde-id com.intel.kext.intelhaxm

It returns the information shown below:


 Finally we found out the reason, it is a signature problem. I guess it is because this module isn't certified for OS Yosemite.