design

Basic spinner design

SDK Version: 
M3

In android creating spinners - known as comboboxes or Drop-down list in other systems - is easy. However giving them a basic design is a little tricky.

In most application we dont want to add custom design to spinners, but at least we want thicker items in the list. With the default look, people will have trouble hitting the desired item.

The code, one may try at first, to fill a spinner with elements, will probably look like this:

The layout xml 'mylayout.xml':

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3. android:orientation="vertical"
  4. android:layout_width="fill_parent"
  5. android:layout_height="fill_parent">
  6.  
  7.         <Spinner android:id="@+id/myspinner"
  8.         android:layout_width="wrap_content"
  9.         android:layout_height="wrap_content" />
  10.  
  11. </LinearLayout>

In the Activity oncreate method:

  1. setContentView(R.layout.mylayout);
  2. ArrayAdapter myAdapter = new ArrayAdapter(this,

Gradient dividers

SDK Version: 
M3

Today I’m going to show you an easy way to create gradient backgrounds in your applications.

Create an xml file in drawable directory and modify like this:

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <shape xmlns:android="http://schemas.android.com/apk/res/android"
  3.         android:shape="rectangle">
  4.         <gradient
  5.          android:startColor="#FF0000"
  6.          android:endColor="#00FF00"
  7.          android:angle="90" />
  8. </shape>

This code snippet generate a divider with gradients that fade from green to red.

After that you can use that such a drawable for layout background.

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3.     android:orientation="vertical"
  4.     android:layout_width="fill_parent"
  5.     android:layout_height="fill_parent"
  6.     android:background="@drawable/gradientcolors">
  7.  
  8. </LinearLayout>

Syndicate content