This article explains how to prepare a Line Chart in Android using Android Studio.
In this application, you will prepare a chart of income and expenses. You will see the graph showing the rise and fall of both income and expenses.
First, you will download the Android Plot Library. In your XML file you will create the Android plot and use the id of this in the Android XY plot variable. Then you will create three arrays, one of String type and another of number type with the values you want to show on the chart.
Second, you will get the object of XYplot returned by the SimpleXYSeries(). Now set the color for the line by the LineandPointFormatter class.
Step 1
Create an XML file and write this:
- <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"
- android:paddingLeft="@dimen/activity_horizontal_margin"
- android:paddingRight="@dimen/activity_horizontal_margin"
- android:paddingTop="@dimen/activity_vertical_margin"
- android:paddingBottom="@dimen/activity_vertical_margin"
- tools:context=".MainActivity">
-
- <com.androidplot.xy.XYPlot
- android:id="@+id/plotxy"
- android:layout_width="fill_parent"
- android:layout_height="fill_parent"
- title="Income / Expenditure Chart [ Year 2012 ]"/>
-
-
- </RelativeLayout>
Step 2
- package com.myapplication;
- import android.graphics.Color;
- import android.os.Bundle;
- import android.app.Activity;
- import android.view.Menu;
- import com.androidplot.series.XYSeries;
- import com.androidplot.xy.LineAndPointFormatter;
- import com.androidplot.xy.SimpleXYSeries;
- import com.androidplot.xy.XYPlot;
- import java.lang.reflect.Array;
- import java.util.Arrays;
- public class MainActivity extends Activity
- {
- String[] months = new String[]
- {
- "A",
- "B",
- "C",
- "D",
- "E",
- "F",
- "G",
- "H"
- };
- Number[] incomes =
- {
- 2000,
- 2500,
- 2700,
- 3000,
- 2800,
- 3500,
- 3700,
- 3800
- };
- Number[] expences =
- {
- 2200,
- 2700,
- 2900,
- 2800,
- 2600,
- 3000,
- 3300,
- 3400
- };
- XYPlot xyplot;
- @Override
- protected void onCreate(Bundle savedInstanceState)
- {
- super.onCreate(savedInstanceState);
- setContentView(R.layout.activity_main);
- xyplot = (XYPlot) findViewById(R.id.plotxy);
- XYSeries incomePlot = new SimpleXYSeries(Arrays.asList(incomes), SimpleXYSeries.ArrayFormat.Y_VALS_ONLY, "Income");
- XYSeries expence = new SimpleXYSeries(Arrays.asList(expences), SimpleXYSeries.ArrayFormat.Y_VALS_ONLY, "Expence");
- LineAndPointFormatter IncomeFormatter = new LineAndPointFormatter(Color.#ff0000, Color.#00ff00,null);LineAndPointFormatter ExpenceFormatter= new LineAndPointFormatter(Color.#ff0000, Color.#00ff00,null);
-
- }
- @Override
- public boolean onCreateOptionsMenu(Menu menu)
- {
- getMenuInflater().inflate(R.menu.main,menu);
- return true;
- }
- }
Step 3
Android Menifest.xml file
- <?xml version="1.0" encoding="utf-8"?>
- <manifest xmlns:android="http://schemas.android.com/apk/res/android"
- package="com.myapplication"
- android:versionCode="1"
- android:versionName="1.0" >
-
- <uses-sdk
- android:minSdkVersion="7"
- android:targetSdkVersion="16" />
-
- <application
- android:allowBackup="true"
- android:icon="@drawable/ic_launcher"
- android:label="@string/app_name"
- android:theme="@style/AppTheme" >
- <activity
- android:name="com.myapplication.MainActivity"
- android:label="@string/app_name" >
- <intent-filter>
- <action android:name="android.intent.action.MAIN" />
-
- <category android:name="android.intent.category.LAUNCHER" />
- </intent-filter>
- </activity>
- </application> </manifest>
Step 4