Quickstart


simplexyscreen

Overview

This tutorial will walk you through Adding Androidplot as a dependency and displaying an XYPlot with two data series.  You can view this sample on your own device or emulator by installing the DemoApp on your device and clicking on the Simple XY Plot Example. Full source available here.

This tutorial is also available in video form on youtube.

Add the Dependency

To use the library in your gradle project add the following to your build.gradle:

If you’re using Proguard obfuscation (Projects created by Android Studio do by default) you’ll also want add this to your proguard-rules.pro file:

Add a Plot to the XML Layout

Once you’ve got the project skeleton created, it’s time to edit res/layout/simple_xy_plot_example.xml and add an XYPlot view.  By default this file is usually named main.xml.  If it is, go ahead and rename it.

res/layout/simple_xy_plot_example.xml

This example uses a default style to decorate the plot.  The full list of styleable attributes is available here.   While new attributes are added regularly, not all configurable properties are yet available.  If something you need is missing, use the Configurator.

Create the Activity

Let’s look at an example Activity that displays the XYPlot graphic shown above.  The basic steps to follow are:

  1. Create an instance of Series and populate it with data to be displayed.
  2. Register the series with the Plot along with a Formatter to describing how the data should be styled.
  3. Draw the Plot

In our case, since we are working with XY data, we’ll be using an XYPlot, a SimpleXYSeries (which is an implementation of the XYSeries interface) and a LineAndPointFormatter.

SimpleXYPlotActivity.java

res/xml/line_point_formatter_with_labels.xml

 res/xml/line_point_formatter_with_labels_2.xml

One potentially confusing section of the code above is LineAndPointFormatter and the usage of configure(…).  This is actually more Configurator magic.  While it’s possible to programmatically create and configure Formatter instances (such as LineAndPointFormatter) doing so leads to a brittle visual experience.  Never the less for the sake of brevity, one could replace the code:

with:

For more details on how to programmatically configure Formatters etc. consult the latest Javadocs.

What’s Next?

Now that you know the basics you’re ready to start plotting dynamic data.