In this tutorial we explain how to create a basic chart. In the previous Tutorial we explained how to add SciChart libraries as dependencies to an Android project.
The SciChartSurface Type
The root 2D chart Android control is called the SciChartSurface. This is the UI control you add to applications wherever you need a chart. You can add more than one SciChartSurface, can configure them independently, and link them together.
Creating SciChartSurface
Once SciChart libraries have been added as dependencies, you can access and use SciChart classes in your Android projects. SciChartSurface can be added to the activity layout either in the Android Studio designer or in code.
In this tutorial, we are going to show how to do this in code.
SciChartBuilder Helper Classes
In order to simplify the chart creation process and make code easier-to-read and concise, SciChart has helper classes. These follow the XXXBuilder naming convention. They let the developer create and initialize objects with a set of methods. The topmost builder class is called SciChartBuilder.
Create a Chart
First create a LinearLayout by replacing the contents of activity_main.xml with.
Example Title |
Copy Code |
---|---|
<?xml version="1.0" encoding="utf-8"?> <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:id="@+id/chart_layout" tools:context="com.scichart.gettingstarted.MainActivity" android:orientation="vertical"> </LinearLayout> |
Then paste the code below into MainActivity.java.
This will create a chart with two axes and the Hello World annotation. You can pinch-zoom and pan this chart:
Example Title |
Copy Code |
---|---|
Create SciChartSurface using Builders @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); // Create a SciChartSurface SciChartSurface surface = new SciChartSurface(this); // Get a layout declared in "activity_main.xml" by id LinearLayout chartLayout = (LinearLayout) findViewById(R.id.chart_layout); // Add the SciChartSurface to the layout chartLayout.addView(surface); // Initialize the SciChartBuilder SciChartBuilder.init(this); // Obtain the SciChartBuilder instance final SciChartBuilder sciChartBuilder = SciChartBuilder.instance(); // Create a numeric X axis final IAxis xAxis = sciChartBuilder.newNumericAxis() .withAxisTitle("X Axis Title") .withVisibleRange(-5, 15) .build(); // Create a numeric Y axis final IAxis yAxis = sciChartBuilder.newNumericAxis() .withAxisTitle("Y Axis Title").withVisibleRange(0, 100).build(); // Create a TextAnnotation and specify the inscription and position for it TextAnnotation textAnnotation = sciChartBuilder.newTextAnnotation() .withX1(5.0) .withY1(55.0) .withText("Hello World!") .withHorizontalAnchorPoint(HorizontalAnchorPoint.Center) .withVerticalAnchorPoint(VerticalAnchorPoint.Center) .withFontStyle(20, ColorUtil.White) .build(); // Create interactivity modifiers ModifierGroup chartModifiers = sciChartBuilder.newModifierGroup() .withPinchZoomModifier().withReceiveHandledEvents(true).build() .withZoomPanModifier().withReceiveHandledEvents(true).build() .build(); // Add the Y axis to the YAxes collection of the surface Collections.addAll(surface.getYAxes(), yAxis); // Add the X axis to the XAxes collection of the surface Collections.addAll(surface.getXAxes(), xAxis); // Add the annotation to the Annotations collection of the surface Collections.addAll(surface.getAnnotations(), textAnnotation); // Add the interactions to the ChartModifiers collection of the surface Collections.addAll(surface.getChartModifiers(), chartModifiers); } |
Congratulations! You have just created your first SciChartSurface!
A Note on Licensing SciChart.
The SciChart Android control comes with an inbuilt fully-functional 30-day trial. You will need to apply a trial license to the applications that you build, including the tutorial.
A license key can be applied following the instructions at www.scichart.com/licensing-scichart-android.