title: Android GridView flip animation on each cell?
body: <p>I am fairly new to android development and i'm creating a few simple applications for myself.
  I have ran into a problem in relation to animations, in particular a flip animation on each individual cell of a gridview when that cell is clicked.</p>
  
  <p>What my application does so far is retrieves the contacts from the phone and displays the contact photo and the name in a gridview using an array adapter.</p>
  
  <p>What i want to happen is when the user clicks on the grid cell of a contact it will perform a flip animation and display the contacts phone number on the back.
  When the user clicks on that cell again it will flip back to the previous view of the name and photo.</p>
  
  <p>I have searched the internet and tried a few tutorials but none that have been of any great help, must of them infact confuse me, so if someone could help that would be great.</p>
  
  <p>I'll post my current code below!</p>
  
  <p>Thanks in advance.</p>
  
  <p>This code is used to retrieve the information of the contacts!</p>
  
  <pre><code>package content;
  
  import android.provider.MediaStore.Images;
  
  public class ContactBean {
  private String name;
  private String phoneNo;
  private String proPic;
  
  public String getName() {
      return name;
  }
  public void setName(String name) {
      this.name = name;
  }
  public String getPhoneNo() {
      return phoneNo;
  }
  public void setPhoneNo(String phoneNo) {
      this.phoneNo = phoneNo;
  }
  
  public String getProPic() {
      return proPic;
  }
  
  public void setProPic(String proPic) {
      this.proPic = proPic;
  }
  
  }
  </code></pre>
  
  <p>ViewContatcsActivity</p>
  
  <pre><code>package viewContacts;
  
  import com.example.contactflipper.R;
  
  import content.ContactBean;
  
  import android.app.Activity;
  import android.app.AlertDialog;
  import android.content.DialogInterface;
  import android.database.Cursor;
  import android.graphics.Bitmap;
  import android.os.Bundle;
  
  import android.provider.ContactsContract;
  import android.view.View;
  import android.widget.AdapterView;
  import android.widget.GridView;
  import android.widget.Toast;
  import android.widget.AdapterView.OnItemClickListener;
  
  import java.util.ArrayList;
  import java.util.Collections;
  import java.util.Comparator;
  import java.util.List;
  
  
  public class ViewContactsActivity extends Activity implements
  OnItemClickListener {
  
  private GridView listView;
  private List&lt;ContactBean&gt; list = new ArrayList&lt;ContactBean&gt;();
  
  @Override
  protected void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.menu_viewcon_grid);
  
      listView = (GridView) findViewById(R.id.gridview);
      listView.setOnItemClickListener(this);
      String image_uri = ""; 
      Bitmap bitmap = null;
  
      Cursor phones = getContentResolver().query(
              ContactsContract.CommonDataKinds.Phone.CONTENT_URI, null,   null,
              null, null);
      while (phones.moveToNext()) {
  
          String name = phones
                  .getString(phones
                          .getColumnIndex(ContactsContract.CommonDataKinds.Phone.DISPLAY_NAME));
  
          String phoneNumber = phones
                  .getString(phones
                          .getColumnIndex(ContactsContract.CommonDataKinds.Phone.NUMBER));
  
          image_uri = phones
                    .getString(phones
                          .getColumnIndex(ContactsContract.CommonDataKinds.Phone.PHOTO_URI));
  
          ContactBean objContact = new ContactBean();
          objContact.setName(name);
  
          objContact.setPhoneNo(phoneNumber);
          list.add(objContact);
  
  
  
      }
      phones.close();
  
      GridAdapter objAdapter = new GridAdapter(
              ViewContactsActivity.this, R.layout.card_front, list);
      listView.setAdapter(objAdapter);
  
      if (null != list &amp;&amp; list.size() != 0) {
          Collections.sort(list, new Comparator&lt;ContactBean&gt;() {
  
              @Override
              public int compare(ContactBean lhs, ContactBean rhs) {
                  return lhs.getName().compareTo(rhs.getName());
              }
          });
          AlertDialog alert = new AlertDialog.Builder(
                  ViewContactsActivity.this).create();
          alert.setTitle("");
  
          alert.setMessage(list.size() + " Contact Found!!!");
  
          alert.setButton("OK", new DialogInterface.OnClickListener() {
  
              @Override
              public void onClick(DialogInterface dialog, int which) {
                  dialog.dismiss();
              }
          });
          alert.show();
  
      } else {
          showToast("No Contact Found!!!");
      }
  }
  
  private void showToast(String msg) {
      Toast.makeText(this, msg, Toast.LENGTH_SHORT).show();
  }
  
  @Override
  public void onItemClick(AdapterView&lt;?&gt; listview, View v, int position,
          long id) {
      ContactBean bean = (ContactBean) listview.getItemAtPosition(position);
      //implement something on the click of each listed item - bean
  }
  
  }
  </code></pre>
  
  <p>GridAdapter</p>
  
  <pre><code>package viewContacts;
  
  import java.util.List;
  
  import com.example.contactflipper.R;
  import com.example.contactflipper.R.id;
  
  import content.ContactBean;
  
  
  import android.app.Activity;
  import android.content.Context;
  import android.graphics.Bitmap;
  import android.graphics.drawable.Drawable;
  import android.text.Html;
  import android.view.LayoutInflater;
  import android.view.View;
  import android.view.ViewGroup;
  import android.widget.ArrayAdapter;
  import android.widget.BaseAdapter;
  import android.widget.ImageView;
  import android.widget.TextView;
  
  public class GridAdapter extends ArrayAdapter&lt;ContactBean&gt; {
  
      private Activity activity;
      private List&lt;ContactBean&gt; items;
      private int row;
      private ContactBean objBean;
  
  
      public GridAdapter(Activity act, int row, List&lt;ContactBean&gt; items) {
          super(act, row, items);
  
          this.activity = act;
          this.row = row;
          this.items = items;
  
  
      }
  
      @Override
      public View getView(final int position, View convertView, ViewGroup parent) {
          View view = convertView;
          ViewHolder holder;
          if (view == null) {
              LayoutInflater inflater = (LayoutInflater) activity
                      .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
              view = inflater.inflate(row, null);
  
              holder = new ViewHolder();
              view.setTag(holder);
          } else {
              holder = (ViewHolder) view.getTag();
          }
  
          if ((items == null) || ((position + 1) &gt; items.size()))
              return view;
  
          objBean = items.get(position);
  
          holder.tvname = (TextView) view.findViewById(R.id.profileName);
          //holder.tvPhoneNo = (TextView) view.findViewById(R.id.tvphone);
  
          if (holder.tvname != null &amp;&amp; null != objBean.getName()
                  &amp;&amp; objBean.getName().trim().length() &gt; 0) {
              holder.tvname.setText(Html.fromHtml(objBean.getName()));
          }
          if (holder.tvPhoneNo != null &amp;&amp; null != objBean.getPhoneNo()
                  &amp;&amp; objBean.getPhoneNo().trim().length() &gt; 0) {
              holder.tvPhoneNo.setText(Html.fromHtml(objBean.getPhoneNo()));
          }
          if (holder.ivPic != null &amp;&amp; null != objBean.getProPic()
                  &amp;&amp; objBean.getProPic().trim().length() &gt; 0) {
              holder.ivPic.setBackground((Drawable) Html.fromHtml(objBean.getProPic()));
          }
          return view;
      }
  
      public class ViewHolder {
          public TextView tvname, tvPhoneNo;
          public ImageView ivPic;
      }
  
  }
  </code></pre>
  
  <p>ViewContactsFragment</p>
  
  <pre><code>package viewContacts;
  
  import com.example.contactflipper.R;
  import com.example.contactflipper.R.id;
  import com.example.contactflipper.R.layout;
  
  import content.AppDetails;
  import android.app.Activity;
  import android.app.Fragment;
  import android.content.res.Configuration;
  import android.os.Bundle;
  import android.util.Log;
  import android.view.LayoutInflater;
  import android.view.View;
  import android.view.ViewGroup;
  import android.widget.GridView;
  
  public class VCGridFragment extends Fragment {
  
  
      public static GridView mGridview;
  
      @Override
      public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState){
  
              View view = inflater.inflate(R.layout.menu_viewcon_grid, container, false);
              Log.d("Called", "on Create View");
              return view;
          }
  
      //super.onCreateView(inflater, container, savedInstanceState);
      @Override
      public void onViewCreated(View view, Bundle savedInstanceState){
          super.onViewCreated(view, savedInstanceState);
          Log.d("Called", "created Grid");
          mGridview = (GridView) view.findViewById(R.id.gridview);
  
  
          Configuration config = getResources().getConfiguration();
  
          if(AppDetails.isTablet){
  
              if(config.orientation == Configuration.ORIENTATION_LANDSCAPE){
                  mGridview.setNumColumns(4);
              }else{
                  mGridview.setNumColumns(3);
              }
  
          }else{
              if(config.orientation == Configuration.ORIENTATION_LANDSCAPE){
                  mGridview.setNumColumns(3);
              }else{
                  mGridview.setNumColumns(2);
              }
          }
  
          /*
          mGridview.setOnItemClickListener(new onItemClickLitener(){
  
              @Override
              public void onItemClick(AdapterView&lt;?&gt; parent, View view, int position, long id){
                  onGridItemClick((GridView) parent, view, position, id);
              }
  
          });
      }
  
      public void onGridItemClick(GridView g, View v, int position, long id){
          Activity activity = getActivity();
      }
      */
   }
  }
  </code></pre>
  
  <p>GridView xml - </p>
  
  <pre><code>&lt;RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
      xmlns:tools="http://schemas.android.com/tools"
      android:id="@+id/contact_grid"
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      android:layout_gravity="center"
      android:background="#ffffff"
      android:scrollbars="none"
      tools:context=".MainActivity" &gt;
  
      &lt;FrameLayout
          android:layout_width="match_parent"
          android:layout_height="match_parent"
          android:layout_gravity="center"
          android:background="@drawable/gradient"
          android:padding="10dp" &gt;
  
          &lt;GridView
              android:id="@+id/gridview"
              android:layout_width="match_parent"
              android:layout_height="match_parent"
              android:layout_marginTop="50dp"
              android:numColumns="2"
              android:horizontalSpacing="8dp"
              android:scrollbars="none"
              android:verticalSpacing="8dp" &gt;
  
          &lt;/GridView&gt;
  
          &lt;Button
              android:id="@+id/backButton"
              android:layout_width="100dp"
              android:layout_height="wrap_content"
              android:layout_gravity="top|right"
              android:background="#8043BFC7"
              android:text="@string/edit_contacts"
              android:textColor="#ffffff"
              android:textStyle="bold" /&gt;
  
      &lt;/FrameLayout&gt;
  
  &lt;/RelativeLayout&gt;
  </code></pre>
  
  <p>FRONT OF CARD XML - </p>
  
  <pre><code>&lt;?xml version="1.0" encoding="utf-8"?&gt;
  &lt;LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
      android:layout_width="180dp"
      android:layout_height="180dp"
      android:orientation="vertical" &gt;
  
      &lt;ImageView
          android:id="@+id/profileThumb"
          android:layout_width="match_parent"
          android:layout_height="140dp"
          &gt;&lt;/ImageView&gt;
  
      &lt;TextView
          android:id="@+id/profileName"
          android:layout_width="match_parent"
          android:layout_height="40dp"
          android:layout_gravity="bottom"
          android:background="#40000000"
          android:textColor="#ffffff"
          android:textSize="22sp"&gt;
          &lt;/TextView&gt; 
  
  
  &lt;/LinearLayout&gt;
  </code></pre>
  
  <p>BACK OF CARD XML - </p>
  
  <pre><code>&lt;?xml version="1.0" encoding="utf-8"?&gt;
  &lt;LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
      android:layout_width="180dp"
      android:layout_height="180dp"
      android:orientation="vertical"
      android:background="#a6c"
      android:padding="10dp"
      android:gravity="bottom"
      &gt;
      &lt;TextView
          android:id="@+id/infoName"
          style="?android:textAppearanceLarge"
          android:textStyle="bold"
          android:textColor="#fff"
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:text="HCKDAHOIW" 
          &gt;&lt;/TextView&gt;   
  
      &lt;TextView
          android:id="@+id/infoLocality"
          style="?android:textAppearanceSmall"
          android:textAllCaps="true"
          android:textStyle="bold"
          android:textColor="#80ffffff"
          android:lineSpacingMultiplier="1.2"
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:text="convoy" 
          &gt;&lt;/TextView&gt;
  
      &lt;TextView
          android:id="@+id/infoEmail"
          style="?android:textAppearanceSmall"
          android:textColor="#80ffffff"
          android:lineSpacingMultiplier="1.2"
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:text="fowfow@email.com" 
          &gt;&lt;/TextView&gt;
  
      &lt;TextView
          android:id="@+id/infoNumber"
          style="?android:textAppearanceSmall"
          android:textColor="#80ffffff"
          android:lineSpacingMultiplier="1.2"
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:text="(086) 123 4567" 
          &gt;&lt;/TextView&gt;
  
  &lt;/LinearLayout&gt;
  </code></pre>