Open In App

How to Implement Candle Stick Chart in Android?

Last Updated : 17 Apr, 2024
Improve
Improve
Like Article
Like
Save
Share
Report

Candle Stick charts are widely used in stock market apps and websites to display price movements such as stocks, and currencies, in a more detailed and visually appealing manner. They provide valuable information about the price action and can help traders and investors make informed decisions and it becomes sometimes difficult to implement that in an Android app. So in this article, we are going to implement that only in an informative and easy way. A sample video is given below to get an idea about what we are going to do in this article.

Step-by-Step Implementation

Step 1: Create a New Project in Android Studio

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: Set up Gradle To Use Candle Stick Graph

Add this URL in settings.gradle and sync it.

repositories {
maven { url 'https://jitpack.io' }
}
dependencies {
implementation 'com.github.PhilJay:MPAndroidChart:v3.1.0'
}

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. We have created one basic layout file for the candle stick graph and given an id to it.

XML
<?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"
    android:background="@color/white"
    tools:context=".GeeksForGeeks">

    <com.github.mikephil.charting.charts.CandleStickChart
        android:id="@+id/candleStick"
        android:layout_width="match_parent"
        android:layout_height="615dp" />

</RelativeLayout>

If your project is properly synced by adding dependency then only you can use that in your project.

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. We have added Candle Stick Chart using the CandleStickChart Library library to display the financial data visually also added some up and down values that are been shown in green and red color we can also change the color of these things, and we can use thread to show the data continuously in the graph.

Java
package com.example.gfgapp;

import androidx.appcompat.app.AppCompatActivity;

import android.graphics.Color;
import android.graphics.Paint;
import android.os.Bundle;

import com.github.mikephil.charting.charts.CandleStickChart;
import com.github.mikephil.charting.data.CandleData;
import com.github.mikephil.charting.data.CandleDataSet;
import com.github.mikephil.charting.data.CandleEntry;

import java.util.ArrayList;
import java.util.List;

public class GeeksForGeeks extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main5);

        // Initializing CandleStickChart make Sure to
        // replace it with your id only that
        // you created
        CandleStickChart candleStickChart = findViewById(R.id.candleStick);
    
        // This Description is visible at Bottom Right side
        candleStickChart.getDescription().setText("GFG");

        // Creating a list to store CandleEntry objects
        List<CandleEntry> entries = new ArrayList<>();

        // Added candlestick dummy data entries here
        // Format will be like entries.add(new CandleEntry(index, high, low, open, close));
        // here f is denoting floating-point number
        entries.add(new CandleEntry(0, 80f, 90f, 70f, 85f)); // Up (green)
        entries.add(new CandleEntry(1, 85f, 95f, 75f, 88f)); // Up (green)
        entries.add(new CandleEntry(2, 88f, 75f, 82f, 85f)); // Down (red)
        entries.add(new CandleEntry(3, 85f, 70f, 78f, 72f)); // Down (red)
        entries.add(new CandleEntry(4, 72f, 68f, 70f, 70f)); // Down (red)
        entries.add(new CandleEntry(5, 70f, 85f, 68f, 82f)); // Up (green)
        entries.add(new CandleEntry(6, 82f, 78f, 80f, 75f)); // Down (red)
        entries.add(new CandleEntry(7, 75f, 70f, 73f, 72f)); // Down (red)
        entries.add(new CandleEntry(8, 72f, 82f, 70f, 80f)); // Up (green)
        entries.add(new CandleEntry(9, 80f, 88f, 75f, 85f)); // Up (green)
        entries.add(new CandleEntry(10, 85f, 92f, 82f, 90f)); // Up (green)
        entries.add(new CandleEntry(11, 90f, 98f, 88f, 95f)); // Up (green)
        entries.add(new CandleEntry(12, 95f, 88f, 90f, 85f)); // Down (red)
        entries.add(new CandleEntry(13, 85f, 78f, 82f, 72f)); // Down (red)
        entries.add(new CandleEntry(14, 72f, 70f, 70f, 68f)); // Down (red)

        // Created a CandleDataSet from the entries
        CandleDataSet dataSet = new CandleDataSet(entries, "Data");
    
        dataSet.setDrawIcons(false);
        dataSet.setIncreasingColor(Color.GREEN); // Color for up (green) candlesticks
        dataSet.setIncreasingPaintStyle(Paint.Style.FILL); // Set the paint style to Fill for green candlesticks
        dataSet.setDecreasingColor(Color.RED); // Color for down (red) candlesticks
        dataSet.setShadowColorSameAsCandle(true); // Using the same color for shadows as the candlesticks
        dataSet.setDrawValues(false);             // Hiding the values on the chart if not needed

        // Created a CandleData object from the CandleDataSet
        CandleData data = new CandleData(dataSet);

        // Seinft the CandleData to the CandleStickChart 
        candleStickChart.setData(data);
        candleStickChart.invalidate();
    }
}

Output:



Like Article
Suggest improvement
Share your thoughts in the comments

Similar Reads