How to Create a BarChart in Android?

Last Updated : 31 Jan, 2021

If you are looking for a UI component to represent a huge form of data in easily readable formats then you can think of displaying this huge data in the form of bar charts or bar graphs. It makes it easy to analyze and read the data with the help of bar graphs. In this article, we will take a look at the implementation of bar graphs in Android.

What we are going to build in this article?

We will be building a simple application in which we will be displaying a bar chart with some sample data in it. A sample GIF is given below to get an idea about what we are going to do in this article. Note that we are going to implement this project using the Java language.

Create a BarChart in Android Sample GIF

Important Attributes of BarChart

Attributes	Description
setData	to set bar data in our bar chart.
setColors	to set colors to our bar chart.
setValueTextColor	to set the color for our text in the bar graph.
setValueTextSize	to set text size for our value
getDescription	to get the description of our bar chart.

Step by Step Implementation

Step 1: Create a New Project

To create a new project in Android Studio please refer to How to Create/Start a New Project in Android Studio. Note that select Java as the programming language.

Step 2: Add dependency and JitPack Repository

Navigate to the Gradle Scripts > build.gradle(Module:app) and add the below dependency in the dependencies section.

implementation ‘com.github.PhilJay:MPAndroidChart:v3.1.0’

Add the JitPack repository to your build file. Add it to your root build.gradle at the end of repositories inside the allprojects{ } section.

allprojects {

repositories {

…

maven { url “https://jitpack.io” }

}

}

After adding this dependency sync your project and now we will move towards its implementation.

Step 3: Working with the activity_main.xml file

Navigate to the app > res > layout > activity_main.xml and add the below code to that file. Below is the code for the activity_main.xml file.

XML

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout 
    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"
    tools:context=".MainActivity"> 
  
    <!--Ui component for our bar chart-->
    <com.github.mikephil.charting.charts.BarChart
        android:id="@+id/idBarChart"
        android:layout_width="match_parent"
        android:layout_height="match_parent" /> 
  
</RelativeLayout>

Step 4: Working with the MainActivity.java file

Go to the MainActivity.java file and refer to the following code. Below is the code for the MainActivity.java file. Comments are added inside the code to understand the code in more detail.

Java

import android.graphics.Color; 
import android.os.Bundle; 
  
import androidx.appcompat.app.AppCompatActivity; 
  
import com.github.mikephil.charting.charts.BarChart; 
import com.github.mikephil.charting.data.BarData; 
import com.github.mikephil.charting.data.BarDataSet; 
import com.github.mikephil.charting.data.BarEntry; 
import com.github.mikephil.charting.utils.ColorTemplate; 
  
import java.util.ArrayList; 
  
public class MainActivity extends AppCompatActivity { 
      
    // variable for our bar chart 
    BarChart barChart; 
      
    // variable for our bar data. 
    BarData barData; 
      
    // variable for our bar data set. 
    BarDataSet barDataSet; 
      
    // array list for storing entries. 
    ArrayList barEntriesArrayList; 
  
    @Override
    protected void onCreate(Bundle savedInstanceState) { 
        super.onCreate(savedInstanceState); 
        setContentView(R.layout.activity_main); 
          
        // initializing variable for bar chart. 
        barChart = findViewById(R.id.idBarChart); 
          
        // calling method to get bar entries. 
        getBarEntries(); 
          
        // creating a new bar data set. 
        barDataSet = new BarDataSet(barEntriesArrayList, "Geeks for Geeks"); 
         
        // creating a new bar data and  
        // passing our bar data set. 
        barData = new BarData(barDataSet); 
          
        // below line is to set data  
        // to our bar chart. 
        barChart.setData(barData); 
          
        // adding color to our bar data set. 
        barDataSet.setColors(ColorTemplate.MATERIAL_COLORS); 
          
        // setting text color. 
        barDataSet.setValueTextColor(Color.BLACK); 
          
        // setting text size 
        barDataSet.setValueTextSize(16f); 
        barChart.getDescription().setEnabled(false); 
    } 
  
    private void getBarEntries() { 
        // creating a new array list 
        barEntriesArrayList = new ArrayList<>(); 
          
        // adding new entry to our array list with bar  
        // entry and passing x and y axis value to it. 
        barEntriesArrayList.add(new BarEntry(1f, 4)); 
        barEntriesArrayList.add(new BarEntry(2f, 6)); 
        barEntriesArrayList.add(new BarEntry(3f, 8)); 
        barEntriesArrayList.add(new BarEntry(4f, 2)); 
        barEntriesArrayList.add(new BarEntry(5f, 4)); 
        barEntriesArrayList.add(new BarEntry(6f, 1)); 
    } 
}

Now run your app and see the output of the app.

Output:

Suggest improvement

How to Create Group BarChart in Android?

Line Graph View in Android with Example

Share your thoughts in the comments

Basics

Software Setup and Configuration

File Structure & Components

Core Topics

Layout & View

Button

Intent and Intent Filters

Toast & RecyclerView

Fragments & Adapters

UI Component & Image Loading Libraries

Date and Time

Material Design & Bars

Working with Google Maps

Chart & Animation

Database

Advance Android

Jetpack & Architecture

App Publish & App Monetization

Projects