Android Programming Tutorial 63: Whats App Type Example - II In Android Studio

CardView In Android:

CardView as the name implies cardview a type of widget introduce for  Lollipop (Android 5.0 API Level 21), CardView  seems like a card which allow us to incript the data on to it,
Example: A marriage Wedding card, is a card where we can see the incript data on to it.

 

CardView Example in Android:

File >> New >> Android Application
Enter Project name: CardViewExample
Package: cardviewexample.kdms.com.cardviewexample
Keep other default selections, click Next until you reach Finish

                                    

  Add Following jar in build.gradle display below in the
 dependencies {

    compile fileTree(dir: 'libs', include: ['*.jar'])
    compile 'com.android.support:appcompat-v7:23.1.0'
    compile 'com.android.support:design:23.1.0'
    compile 'com.android.support:cardview-v7:23.0.1' 
}

Copy and Past the following code in the MainActivity.java

package cardviewexample.kdms.com.cardviewexample;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.CardView;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {
    private CardView cardView;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        cardView = (CardView)findViewById(R.id.cardView);
        cardView.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Toast.makeText(MainActivity.this, "Yout Clicked On CardView", Toast.LENGTH_LONG).show();
            }
        });
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.menu_main, menu);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // Handle action bar item clicks here. The action bar will
        // automatically handle clicks on the Home/Up button, so long
        // as you specify a parent activity in AndroidManifest.xml.
        int id = item.getItemId();
        //noinspection SimplifiableIfStatement
        if (id == R.id.action_settings) {
            return true;
        }
        return super.onOptionsItemSelected(item);
    }
} Copy and Past the following code in the layout file called activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="160dp"
    android:id="@+id/cardView"
    card_view:contentPaddingTop="20dp"
    card_view:contentPaddingBottom="20dp"
    card_view:contentPaddingLeft="20dp"
    card_view:contentPaddingRight="20dp"
    card_view:cardBackgroundColor="#91B2DE"
    card_view:cardUseCompatPadding="true"
    card_view:cardCornerRadius="10dp"
    android:layout_margin="20dp"
    android:fitsSystemWindows="true"
    tools:context=".MainActivity">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <ImageView
            android:layout_width="120dp"
            android:layout_height="120dp"
            android:id="@+id/iv_cardView"
            android:layout_alignParentLeft="true"
            android:layout_marginLeft="10dp"
            android:layout_centerVertical="true"
            android:src="@mipmap/andi"/>

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="sunil@gmail.com"
            android:layout_marginLeft="10dp"
            android:id="@+id/tv_CardView"
            android:layout_centerVertical="true"
            android:layout_toRightOf="@+id/iv_cardView"
            android:textColor="#222"
            android:textSize="15sp"/>

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Sunil Kumar"
            android:layout_above="@+id/tv_CardView"
            android:layout_marginLeft="10sp"
            android:id="@+id/tvName"
            android:layout_toRightOf="@+id/iv_cardView"
            android:layout_centerVertical="true"
            android:textColor="#222"
            android:textSize="15sp" />
    </RelativeLayout>
</android.support.v7.widget.CardView>
 Copy and Past the following code in the Manifest.xml


<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="cardviewexample.kdms.com.cardviewexample" >

    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:supportsRtl="true"
        android:theme="@style/AppTheme" >
        <activity
            android:name=".MainActivity"
            android:label="@string/app_name"
            android:theme="@style/AppTheme.NoActionBar" >
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>
</manifest>

Run Your Project as the below by clicking on shift+10 or like the below-->Android Application and observe the output

      


OUTPUT:                     

Please Send Your Comments To ambilpura.sunil@gmail.com

 Stay Tune For Next Tutorial...CardView Example In Android: