In this tutorial, we will learn how to create a modern dashboard design in android studio. The dashboard is the main screen of our application that describes what is the functionality of an app. Hence we will create three different designs of recyclerview and cardview in our modern dashboard UI design in android studio of the City Guide app.
To get the complete project, click on the following button.
As you all know we are creating a city guide application that tracks all the locations of our city.
So for that, we have learned how to download and install an android studio, after that we will learn how to professionally set up android studio.
Furthermore, we have created a Splash Screen and then onboarding or walkthrough slider that appears for only one time.
Lastly, we are creating a Modern Dashboard UI design in android studio that has a menu icon and adding new location button on top.
After that, we have a search bar that will animate to the search page which we will create in the next tutorial.
As told we will use 3 designs of recyclerview and cardview for better understanding.
So lets get started with the code.
Subscribe us on Youtube
To create a modern dashboard UI design in the android studio we have to follow these points:
Step#1- Create an empty activity
If you are following our tutorials then go to app->java->first folder->user
Then right-click on the user, click on New and then click on Empty Activity.
As we are creating a dashboard thus give the name of the activity as UserDashboard.
In the meantime copy and paste all the images to your drawable folder, and gives color and string to your application.
If you don’t know how to do that just check our tutorial of how to setup an android studio.
Step#2- How to remove status bar
After creating a new activity open java file of name UserDashboard.
Write the below code, before setContentView and after super.onCreate.
getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN);
Step#3- Design the xml file
So then after removal of the status bar, design the XML file of userdashboard named “activity_user_dashboard”.
1- Design the top bar
In the first place, change the parent layout to a Linear Layout.
After that give the orientation of the linear layout as vertical and assign the background color or image to it as you want.
<LinearLayout 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:background="@color/home_background"
android:orientation="vertical">
</LinearLayout>
Now create a relative layout in between linear layout with the width of match parent and height of wrap content.
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="20dp">
</RelativeLayout>
In that relative layout add hamburger icon to right and “+” icon on the right side, to add a new location. To add these we have to create two imageView components as shown in the code.
<ImageView
android:layout_centerVertical="true"
android:layout_height="40dp"
android:layout_width="40dp"
android:src="@drawable/menu_icon" />
<ImageView
android:background="@color/banner_background"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_height="40dp"
android:layout_width="40dp"
android:padding="5dp"
android:src="@drawable/add_missing_place_icon" />
Thus the first section is ready. Now move to the second section having the search bar and Logo.
So first of all, create a Scroll bar for the page and after that create a linear layout between it.
Thus all the remaining code is created in that linear layout.
<ScrollView
android:layout_height="match_parent"
android:layout_width="match_parent">
<LinearLayout
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:orientation="vertical">
</LinearLayout>
</ScrollView>
Therefore, create a text view for logo. After that, we have to design a search bar.
Simply copy and paste the following code inside the linear layout we have created before.
<RelativeLayout
android:layout_height="wrap_content"
android:layout_width="match_parent">
<TextView
android:fontFamily="@font/brandon_grotesque_black"
android:id="@+id/app_name"
android:layout_centerHorizontal="true"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="@string/logo_name"
android:textColor="@color/colorAccent"
android:textSize="28sp" />
<RelativeLayout
android:background="@color/white"
android:elevation="8dp"
android:layout_below="@id/app_name"
android:layout_height="40dp"
android:layout_marginBottom="20dp"
android:layout_marginLeft="40dp"
android:layout_marginRight="40dp"
android:layout_marginTop="20dp"
android:layout_width="match_parent">
<TextView
android:layout_centerVertical="true"
android:layout_height="wrap_content"
android:layout_marginLeft="15dp"
android:layout_width="wrap_content"
android:text="@string/search_text" />
<ImageView
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_height="30dp"
android:layout_marginRight="15dp"
android:layout_width="30dp"
android:src="@drawable/search_icon" />
</RelativeLayout>
</RelativeLayout>
2- Design the General Category Section
Designing the general category section needs card view design. So to make a card we have to create a new layout file in drawable named “card1”.
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<corners android:radius="2dp" />
<solid android:color="@color/card1" />
</shape>
Then create a linear layout with the horizontal orientation and the gravity will be center.
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:orientation="horizontal">
</LinearLayout>
Now add another linear layout for a category card with orientation vertical.
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
</LinearLayout>
After that create a category using image view and text view and add that category to linear layout having a vertical orientation.
<RelativeLayout
android:background="@drawable/card_1"
android:elevation="8dp"
android:layout_height="60dp"
android:layout_margin="10dp"
android:layout_width="60dp">
<ImageView
android:layout_centerInParent="true"
android:layout_height="30dp"
android:layout_width="30dp"
android:src="@drawable/restaurant_icon" />
</RelativeLayout>
<TextView
android:gravity="center_horizontal"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:text="@string/restaurants"
android:textAlignment="center" />
Now create the three other categories the same as the first category by just copy and paste linear layout having a vertical orientation.
3- Create Recyclerview and Cardview of All-Featured-Location’s
Now we have to create a recycler view for our featured locations.
Before making the recycler view we have to create a card view.
a- Create an XML File for cardview
Thus to create a card view we have to make a new layout with a name of “featured_card_design.xml”
Now go the Split view of that XML file to design the card.
Change the first tag to CardView as shown in the following code.
<?xml version="1.0" encoding="utf-8"?>
<androidx.cardview.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="160dp"
android:layout_height="300dp"
android:layout_margin="10dp"
app:cardCornerRadius="2dp"
app:cardElevation="8dp">
</androidx.cardview.widget.CardView>
In between the card, view add the linear layout of vertical orientation.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:padding="15dp">
</LinearLayout>
As we have to create a card that has an image, text, and rating bar.
So for that add imageView, textView, and rating bar in between the linear layout we have already created.
For image:
<ImageView
android:id="@+id/featured_image"
android:layout_width="match_parent"
android:layout_height="140dp"
android:scaleType="centerCrop"
android:src="@drawable/mcdonald_img" />
for title
<TextView
android:id="@+id/featured_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="@font/baloo"
android:lineHeight="23dp"
android:text="McDonald's"
android:textColor="@color/colorAccent"
android:textSize="20sp" />
for rating bar
<RatingBar
style="@style/Widget.AppCompat.RatingBar.Small"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:rating="3.5" />
for Description
<TextView
android:id="@+id/featured_desc"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="asbkd asudhlasn saudnas jasdjasl hisajdl asjdlnas" />
b- Create the recycler view in activity_user_dashboard.xml
Now our card view is ready and to add that card view we have to create recycler view.
So to create that recycler view we have to go to again in activity_user_dashboard.
After the linear layout of categories, we have to use the relative layout first with a width of match parent and height of wrap content. Also, give the background-color to it.
<RelativeLayout android:background="@color/lightWhite"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_marginTop="20dp"
android:layout_width="match_parent">
</RelativeLayout>
In between the relative layout, we have to create a linear Layout for the banner. So create it, by using the following code:
<LinearLayout
android:background="@color/banner_background_light"
android:id="@+id/featured_background"
android:layout_height="300dp"
android:layout_marginBottom="10dp"
android:layout_marginEnd="10dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_marginStart="10dp"
android:layout_marginTop="10dp"
android:layout_width="170dp"
android:orientation="vertical">
<TextView
android:fontFamily="@font/brandon_grotesque_black"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginTop="50dp"
android:layout_width="wrap_content"
android:lineHeight="24sp"
android:text="@string/featured_locations"
android:textAllCaps="true"
android:textColor="@color/colorAccent"
android:textSize="25sp" />
<TextView
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:layout_width="wrap_content"
android:text="@string/featured_locations_description" />
</LinearLayout>
Lastly, we have to add the recycler view after banner.
<androidx.recyclerview.widget.RecyclerView
android:background="@color/home_background"
android:id="@+id/featured_recycler"
android:layout_height="wrap_content"
android:layout_toRightOf="@id/featured_background"
android:layout_width="match_parent" />
Finally, we have created our recycler view for all featured locations. So then we have to add the card view using code in java file.
But first, we have to make other two recycler views the same as above.
4- Create a RecyclerView and CardView of Most Viewed
As we have created the cardview and recyclerview of all-featured-locations now we will create a recycler view for most viewed.
To create a recycler view of the new design for most-viewed we have to only change the design of card view.
Thus we have to create a new layout named most_viewed_card_design.xml
Firstly change the main layout to cardview.
<?xml version="1.0" encoding="utf-8"?>
<androidx.cardview.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
xmlns:app="http://schemas.android.com/apk/res-auto"
app:cardCornerRadius="2dp"
app:cardElevation="8dp"
android:layout_margin="10dp">
</androidx.cardview.widget.CardView>
Then in between that card view tag, create a relative layout of width 300dp and height of 150dp.
<RelativeLayout
android:layout_width="300dp"
android:layout_height="150dp"
android:padding="10dp">
</RelativeLayout>
After that create the text view, rating bar and image view as shown in the code.
<ImageView
android:id="@+id/mv_image"
android:layout_width="100dp"
android:layout_height="150dp"
android:src="@drawable/mcdonald_img"
android:scaleType="centerCrop"/>
<TextView
android:id="@+id/mv_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Amjad General Store"
android:layout_toRightOf="@id/mv_image"
android:layout_marginLeft="10dp"
android:textSize="20sp"
android:textColor="@color/colorAccent"
android:lineHeight="20dp"
android:fontFamily="@font/baloo"
android:layout_marginStart="10dp"
android:layout_toEndOf="@id/mv_image" />
<RatingBar
android:id="@+id/mv_rating"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
style="@style/Widget.AppCompat.RatingBar.Small"
android:layout_below="@id/mv_title"
android:layout_toRightOf="@id/mv_image"
android:layout_marginLeft="10dp"
android:rating="4"/>
<TextView
android:id="@+id/mv_desc"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="asbkd asudhlasn saudnas jasdjasl hisajdl asjdlnas"
android:layout_below="@id/mv_rating"
android:layout_toRightOf="@id/mv_image"
android:padding="10dp"/>
Now our card is ready. Go back again to activity_user_dashboard.xml and add the following code below the featured recyclerview.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="30dp"
android:orientation="vertical"
android:paddingLeft="20dp"
android:paddingTop="20dp"
android:paddingBottom="20dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:fontFamily="@font/brandon_grotesque_black"
android:text="@string/most_viewed_locations"
android:textAllCaps="true"
android:textColor="@color/colorAccent"
android:textSize="20sp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="15dp"
android:text="@string/view_all" />
</RelativeLayout>
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/most_viewed_recycler"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
5- Create a RecyclerView and CardView of All Categories
As we have created the cardview and recyclerview of Most Viewed, now we will create a recycler view for all Categories.
Similarly, to create a recycler view of the new design for Categories we have to only change the design of the card view.
Thus we have to create a new layout named categories_card_design.xml and open that file.
Firstly change the main layout to card view.
<?xml version="1.0" encoding="utf-8"?>
<androidx.cardview.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="250dp"
android:layout_height="150dp"
android:layout_margin="12sp"
app:cardCornerRadius="0dp"
app:cardElevation="8dp">
</androidx.cardview.widget.CardView>
Then in between that card view tag, create a relative layout of width and height of matchparent.
<RelativeLayout
android:id="@+id/background_gradient"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/card_2"
android:padding="15dp">
</RelativeLayout>
After that create the text view, and image view as shown in the code.
<TextView
android:id="@+id/categories_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="@font/baloo"
android:text="Restaurant"
android:textAllCaps="true"
android:textColor="@color/colorAccent"
android:textSize="20sp" />
<ImageView
android:id="@+id/categories_image"
android:layout_width="110dp"
android:layout_height="110dp"
android:layout_alignParentRight="true"
android:layout_alignParentBottom="true"
android:src="@drawable/restaurant_image" />
Now our card is ready. Go back again to activity_user_dashboard.xml and add the following code below the Most VIewed recyclerview.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="30dp"
android:orientation="vertical"
android:padding="20dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:fontFamily="@font/brandon_grotesque_black"
android:text="@string/categories"
android:textAllCaps="true"
android:textColor="@color/colorAccent"
android:textSize="20sp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:text="@string/view_all" />
</RelativeLayout>
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/categories_recycler"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
Dashboard UI Design Complete Project with Source code
Step#4- Create Adapter Classes
Now create three adapter classes to assign the image, title, description, and ratings after getting from the firebase.
As we will do firebase setup in our next tutorials, therefore, we will give dummy values to our card views.
Here in the first place, we have to create a java class namely FeaturedAdapter.
FeaturedAdapter class extends
RecyclerView.Adapter<FeaturedAdapter.FeaturedViewHolder>
Here we have to create ArrayList and make constructor where we have to assign the array.
ArrayList<FeaturedHelperClass> featuredLocations;
public FeaturedAdapter(ArrayList<FeaturedHelperClass> featuredLocations) {
this.featuredLocations = featuredLocations;
}
Now create a static class in between FeaturedAdapter class.
public static class FeaturedViewHolder extends RecyclerView.ViewHolder {
ImageView image;
TextView title, desc;
public FeaturedViewHolder(@NonNull View itemView) {
super(itemView);
//Hooks
image = itemView.findViewById(R.id.featured_image);
title = itemView.findViewById(R.id.featured_title);
desc = itemView.findViewById(R.id.featured_desc);
}
}
Subsequently hover on the error and click on the red bulb icon and then click implement methods.
After that add the code as shown below.
@NonNull
@Override
public FeaturedViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.featured_card_design, parent, false);
FeaturedViewHolder featuredViewHolder = new FeaturedViewHolder(view);
return featuredViewHolder;
}
@Override
public void onBindViewHolder(@NonNull FeaturedViewHolder holder, int position) {
FeaturedHelperClass featuredHelperClass = featuredLocations.get(position);
holder.image.setImageResource(featuredHelperClass.getImage());
holder.title.setText(featuredHelperClass.getTitle());
holder.desc.setText(featuredHelperClass.getDescription());
}
@Override
public int getItemCount() {
return featuredLocations.size();
}
Now create two more adapter classes with names as CategoriesAdapter and MostViewedAdpater.
And make changes similar to FeaturedAdapter.
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.TextView;
import androidx.annotation.NonNull;
import androidx.recyclerview.widget.RecyclerView;
import com.taimoorsikander.userdashboarddesign.HomeAdaptersHelperClasses.MostViewedHelperClass;
import com.taimoorsikander.userdashboarddesign.R;
import java.util.ArrayList;
public class MostViewedAdpater extends RecyclerView.Adapter<MostViewedAdpater.MostViewedViewHolder> {
ArrayList<MostViewedHelperClass> mostViewedLocations;
public MostViewedAdpater(ArrayList<MostViewedHelperClass> mostViewedLocations) {
this.mostViewedLocations = mostViewedLocations;
}
@NonNull
@Override
public MostViewedViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.most_viewed_card_design, parent, false);
MostViewedViewHolder mostViewedViewHolder = new MostViewedViewHolder(view);
return mostViewedViewHolder;
}
@Override
public void onBindViewHolder(@NonNull MostViewedViewHolder holder, int position) {
MostViewedHelperClass helperClass = mostViewedLocations.get(position);
holder.imageView.setImageResource(helperClass.getImageView());
holder.textView.setText(helperClass.getTextView());
}
@Override
public int getItemCount() {
return mostViewedLocations.size();
}
public static class MostViewedViewHolder extends RecyclerView.ViewHolder {
ImageView imageView;
TextView textView;
public MostViewedViewHolder(@NonNull View itemView) {
super(itemView);
imageView = itemView.findViewById(R.id.mv_image);
textView = itemView.findViewById(R.id.mv_title);
}
}
}
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.RelativeLayout;
import android.widget.TextView;
import androidx.annotation.NonNull;
import androidx.recyclerview.widget.RecyclerView;
import com.taimoorsikander.userdashboarddesign.HomeAdaptersHelperClasses.CategoriesHelperClass;
import com.taimoorsikander.userdashboarddesign.R;
import java.util.ArrayList;
public class CategoriesAdapter extends RecyclerView.Adapter<CategoriesAdapter.AdapterAllCategoriesViewHolder> {
ArrayList<CategoriesHelperClass> mostViewedLocations;
public CategoriesAdapter(ArrayList<CategoriesHelperClass> mostViewedLocations) {
this.mostViewedLocations = mostViewedLocations;
}
@NonNull
@Override
public AdapterAllCategoriesViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.categories_card_design, parent, false);
AdapterAllCategoriesViewHolder lvh = new AdapterAllCategoriesViewHolder(view);
return lvh;
}
@Override
public void onBindViewHolder(@NonNull AdapterAllCategoriesViewHolder holder, int position) {
CategoriesHelperClass helperClass = mostViewedLocations.get(position);
holder.imageView.setImageResource(helperClass.getImage());
holder.textView.setText(helperClass.getTitile());
holder.relativeLayout.setBackground(helperClass.getGradient());
}
@Override
public int getItemCount() {
return mostViewedLocations.size();
}
public static class AdapterAllCategoriesViewHolder extends RecyclerView.ViewHolder {
RelativeLayout relativeLayout;
ImageView imageView;
TextView textView;
public AdapterAllCategoriesViewHolder(@NonNull View itemView) {
super(itemView);
relativeLayout = itemView.findViewById(R.id.background_gradient);
imageView = itemView.findViewById(R.id.categories_image);
textView = itemView.findViewById(R.id.categories_title);
}
}
}
Step#5- Assign Values to the card views
Go to java file of UserDashboard.
Copy and paste the following code.
package com.taimoorsikander.userdashboarddesign;
import android.graphics.drawable.GradientDrawable;
import android.os.Bundle;
import android.view.WindowManager;
import androidx.appcompat.app.AppCompatActivity;
import androidx.recyclerview.widget.LinearLayoutManager;
import androidx.recyclerview.widget.RecyclerView;
import com.taimoorsikander.userdashboarddesign.HomeAdapters.CategoriesAdapter;
import com.taimoorsikander.userdashboarddesign.HomeAdapters.FeaturedAdapter;
import com.taimoorsikander.userdashboarddesign.HomeAdapters.MostViewedAdpater;
import com.taimoorsikander.userdashboarddesign.HomeAdaptersHelperClasses.CategoriesHelperClass;
import com.taimoorsikander.userdashboarddesign.HomeAdaptersHelperClasses.FeaturedHelperClass;
import com.taimoorsikander.userdashboarddesign.HomeAdaptersHelperClasses.MostViewedHelperClass;
import java.util.ArrayList;
public class UserDashboard extends AppCompatActivity {
RecyclerView featuredRecycler, mostViewedRecycler, categoriesRecycler;
RecyclerView.Adapter adapter;
private GradientDrawable gradient1, gradient2, gradient3, gradient4;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN);
setContentView(R.layout.activity_user_dashboard);
//Hooks
featuredRecycler = findViewById(R.id.featured_recycler);
mostViewedRecycler = findViewById(R.id.most_viewed_recycler);
categoriesRecycler = findViewById(R.id.categories_recycler);
//Functions will be executed automatically when this activity will be created
featuredRecycler();
mostViewedRecycler();
categoriesRecycler();
}
private void categoriesRecycler() {
//All Gradients
gradient2 = new GradientDrawable(GradientDrawable.Orientation.LEFT_RIGHT, new int[]{0xffd4cbe5, 0xffd4cbe5});
gradient1 = new GradientDrawable(GradientDrawable.Orientation.LEFT_RIGHT, new int[]{0xff7adccf, 0xff7adccf});
gradient3 = new GradientDrawable(GradientDrawable.Orientation.LEFT_RIGHT, new int[]{0xfff7c59f, 0xFFf7c59f});
gradient4 = new GradientDrawable(GradientDrawable.Orientation.LEFT_RIGHT, new int[]{0xffb8d7f5, 0xffb8d7f5});
ArrayList<CategoriesHelperClass> categoriesHelperClasses = new ArrayList<>();
categoriesHelperClasses.add(new CategoriesHelperClass(gradient1, R.drawable.school_image, "Education"));
categoriesHelperClasses.add(new CategoriesHelperClass(gradient2, R.drawable.hospital_image, "HOSPITAL"));
categoriesHelperClasses.add(new CategoriesHelperClass(gradient3, R.drawable.restaurant_image, "Restaurant"));
categoriesHelperClasses.add(new CategoriesHelperClass(gradient4, R.drawable.shopping_image, "Shopping"));
categoriesHelperClasses.add(new CategoriesHelperClass(gradient1, R.drawable.transport_image, "Transport"));
categoriesRecycler.setHasFixedSize(true);
adapter = new CategoriesAdapter(categoriesHelperClasses);
categoriesRecycler.setLayoutManager(new LinearLayoutManager(this, LinearLayoutManager.HORIZONTAL, false));
categoriesRecycler.setAdapter(adapter);
}
private void mostViewedRecycler() {
mostViewedRecycler.setHasFixedSize(true);
mostViewedRecycler.setLayoutManager(new LinearLayoutManager(this, LinearLayoutManager.HORIZONTAL, false));
ArrayList<MostViewedHelperClass> mostViewedLocations = new ArrayList<>();
mostViewedLocations.add(new MostViewedHelperClass(R.drawable.mcdonald_img, "McDonald's"));
mostViewedLocations.add(new MostViewedHelperClass(R.drawable.city_2, "Edenrobe"));
mostViewedLocations.add(new MostViewedHelperClass(R.drawable.city_1, "J."));
mostViewedLocations.add(new MostViewedHelperClass(R.drawable.mcdonald_img, "Walmart"));
adapter = new MostViewedAdpater(mostViewedLocations);
mostViewedRecycler.setAdapter(adapter);
}
private void featuredRecycler() {
featuredRecycler.setHasFixedSize(true);
featuredRecycler.setLayoutManager(new LinearLayoutManager(this, LinearLayoutManager.HORIZONTAL, false));
ArrayList<FeaturedHelperClass> featuredLocations = new ArrayList<>();
featuredLocations.add(new FeaturedHelperClass(R.drawable.mcdonald_img, "Mcdonald's", "asbkd asudhlasn saudnas jasdjasl hisajdl asjdlnas"));
featuredLocations.add(new FeaturedHelperClass(R.drawable.city_1, "Edenrobe", "asbkd asudhlasn saudnas jasdjasl hisajdl asjdlnas"));
featuredLocations.add(new FeaturedHelperClass(R.drawable.city_2, "Walmart", "asbkd asudhlasn saudnas jasdjasl hisajdl asjdlnas"));
adapter = new FeaturedAdapter(featuredLocations);
featuredRecycler.setAdapter(adapter);
}
}
Dashboard UI Design Complete Project with Source code
To learn in detail just follow our Youtube tutorial..
Android Related Videos
- Design a Modern Dashboard
- Material Design Login Screen with Shared Animations
- Create a Navigation Drawer Material Design in 2020
- Design Responsive Android App to fit all screen sizes
Related Articles that you might want to check out.
- Create a new project in android studio for beginners?
- How to create an Account on Fiverr and start earning?
- Create a Gig on Fiverr and start selling specific services.
- How To Start Blogging and Make Money?
Our Projects Make Us Proud