Dashboard ui design in android studio

modern dashboard ui design in android studio using cardview tutorial or example


dependencies install (build.gradle):  implementation 'androidx.cardview:cardview:1.0.0'

XML UI Design : activity_main

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <ScrollView
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_alignParentTop="true"
        android:layout_alignParentLeft="true"
        >

        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:orientation="vertical"
            >

            <RelativeLayout
                android:background="#E6E6E6"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent">

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="230dp"
                    android:orientation="vertical"
                    android:gravity="center"
                    android:background="@color/colorAccent"
                    >

                    <ImageView
                        android:layout_width="90dp"
                        android:layout_height="90dp"
                        android:layout_gravity="center"
                        android:src="@drawable/onlinestore" />

                    <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text="MY DASHBOARD DESIGN"
                        android:textColor="#fff"
                        android:textSize="18sp"
                        android:textStyle="bold"
                        android:layout_marginTop="10dp"
                        />
                </LinearLayout>

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:orientation="vertical"
                    android:layout_marginTop="251dp"
                    android:layout_marginLeft="10dp"
                    android:layout_marginRight="10dp"
                    >
                    <LinearLayout
                        android:layout_width="match_parent"
                        android:layout_height="135dp"
                        android:orientation="horizontal"
                        android:layout_marginBottom="10dp"
                        >
                        <androidx.cardview.widget.CardView
                            android:layout_width="0dp"
                            android:layout_height="match_parent"
                            android:layout_weight="1"
                            android:layout_marginRight="5dp"
                            android:orientation="vertical"
                            >

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

                                <ImageView
                                    android:id="@+id/profile"
                                    android:layout_width="50dp"
                                    android:layout_height="50dp"
                                    android:layout_centerInParent="true"
                                    android:src="@drawable/man"
                                    />
                                <TextView
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:layout_centerHorizontal="true"
                                    android:text="Profile"
                                    android:textSize="18sp"
                                    android:layout_below="@+id/profile"
                                    android:layout_marginTop="10dp"
                                    />
                                <Button
                                    android:id="@+id/profileBtn"
                                    android:layout_width="match_parent"
                                    android:layout_height="match_parent"
                                    android:background="@android:color/transparent" />
                            </RelativeLayout>


                        </androidx.cardview.widget.CardView>
                        <androidx.cardview.widget.CardView
                            android:layout_width="0dp"
                            android:layout_height="match_parent"
                            android:layout_weight="1"
                            android:layout_marginLeft="5dp"
                            android:orientation="vertical"
                            >

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

                                <ImageView
                                    android:id="@+id/imageView1"
                                    android:layout_width="50dp"
                                    android:layout_height="50dp"
                                    android:layout_centerInParent="true"
                                    android:src="@drawable/placeholder"
                                    />

                                <TextView
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:layout_centerHorizontal="true"
                                    android:text="Location"
                                    android:textSize="18sp"
                                    android:layout_below="@+id/imageView1"
                                    android:layout_marginTop="10dp"
                                    />

                                <Button
                                    android:id="@+id/locationBtn"
                                    android:layout_width="match_parent"
                                    android:layout_height="match_parent"
                                    android:background="@android:color/transparent"
                                    />
                            </RelativeLayout>

                        </androidx.cardview.widget.CardView>
                    </LinearLayout>

                    <LinearLayout
                        android:layout_width="match_parent"
                        android:layout_height="135dp"
                        android:orientation="horizontal"
                        android:layout_marginBottom="10dp"
                        >
                        <androidx.cardview.widget.CardView
                            android:layout_width="0dp"
                            android:layout_height="match_parent"
                            android:layout_weight="1"
                            android:layout_marginRight="5dp"
                            android:orientation="vertical"
                            >

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

                                <ImageView
                                    android:id="@+id/profileimg"
                                    android:layout_width="50dp"
                                    android:layout_height="50dp"
                                    android:layout_centerInParent="true"
                                    android:src="@drawable/googleplus"
                                    />
                                <TextView
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:layout_centerHorizontal="true"
                                    android:text="Google Plus"
                                    android:textSize="18sp"
                                    android:layout_below="@+id/profileimg"
                                    android:layout_marginTop="10dp"
                                    />
                                <Button
                                    android:id="@+id/googleplusbtn"
                                    android:layout_width="match_parent"
                                    android:layout_height="match_parent"
                                    android:background="@android:color/transparent" />
                            </RelativeLayout>


                        </androidx.cardview.widget.CardView>
                        <androidx.cardview.widget.CardView
                            android:layout_width="0dp"
                            android:layout_height="match_parent"
                            android:layout_weight="1"
                            android:layout_marginLeft="5dp"
                            android:orientation="vertical"
                            >
                            <RelativeLayout
                                android:layout_width="match_parent"
                                android:layout_height="match_parent">
                                <ImageView
                                    android:id="@+id/youtubeview"
                                    android:layout_width="50dp"
                                    android:layout_height="50dp"
                                    android:layout_centerInParent="true"
                                    android:src="@drawable/youtube"
                                    />
                                <TextView
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:layout_centerHorizontal="true"
                                    android:text="Youtube"
                                    android:textSize="18sp"
                                    android:layout_below="@+id/youtubeview"
                                    android:layout_marginTop="10dp"
                                    />
                                <Button
                                    android:id="@+id/youtubebtn"
                                    android:layout_width="match_parent"
                                    android:layout_height="match_parent"
                                    android:background="@android:color/transparent"
                                    />
                            </RelativeLayout>
                        </androidx.cardview.widget.CardView>


                    </LinearLayout>
                    <LinearLayout
                        android:layout_width="match_parent"
                        android:layout_height="135dp"
                        android:orientation="horizontal"
                        android:layout_marginBottom="10dp"
                        >
                        <androidx.cardview.widget.CardView
                            android:layout_width="0dp"
                            android:layout_height="match_parent"
                            android:layout_weight="1"
                            android:layout_marginRight="5dp"
                            android:orientation="vertical"
                            >
                            <RelativeLayout
                                android:layout_width="match_parent"
                                android:layout_height="match_parent">
                                <ImageView
                                    android:id="@+id/facebookimg"
                                    android:layout_width="50dp"
                                    android:layout_height="50dp"
                                    android:layout_centerInParent="true"
                                    android:src="@drawable/facebook"
                                    />
                                <TextView
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:layout_centerHorizontal="true"
                                    android:text="Facebook"
                                    android:textSize="18sp"
                                    android:layout_below="@+id/facebookimg"
                                    android:layout_marginTop="10dp"
                                    />

                                <Button
                                    android:id="@+id/facebookBtn"
                                    android:layout_width="match_parent"
                                    android:layout_height="match_parent"
                                    android:background="@android:color/transparent" />
                            </RelativeLayout>

                        </androidx.cardview.widget.CardView>
                        <androidx.cardview.widget.CardView
                            android:layout_width="0dp"
                            android:layout_height="match_parent"
                            android:layout_weight="1"
                            android:layout_marginLeft="5dp"
                            android:orientation="vertical"
                            >
                            <RelativeLayout
                                android:layout_width="match_parent"
                                android:layout_height="match_parent">

                                <ImageView
                                    android:id="@+id/twitterView"
                                    android:layout_width="50dp"
                                    android:layout_height="50dp"
                                    android:layout_centerInParent="true"
                                    android:src="@drawable/twitter"
                                    />
                                <TextView
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:layout_centerHorizontal="true"
                                    android:text="Twitter"
                                    android:textSize="18sp"
                                    android:layout_below="@+id/twitterView"
                                    android:layout_marginTop="10dp"
                                    />
                                <Button
                                    android:id="@+id/twitterBtn"
                                    android:layout_width="match_parent"
                                    android:layout_height="match_parent"
                                    android:background="@android:color/transparent"
                                    />

                            </RelativeLayout>
                        </androidx.cardview.widget.CardView>
                    </LinearLayout>
                </LinearLayout>
            </RelativeLayout>
        </LinearLayout>
    </ScrollView>

</RelativeLayout>


cardview dashboard android
Preview 


You may like these posts