GraphLib:グラフ用のオープンソースAndroidライブラリ

グラフとデータプロットは、Androidアプリケーションの関係を示し、データの傾向を示し、目標を追跡するための優れたツールです。数年前、私の元学生がチャールストン防衛請負業者協会が主催する学生モバイルアプリコンテストで1位を獲得したとき、私はこれを自分で見ました。受賞アプリ「糖尿病と私」の重要な機能は、毎日の糖度をグラフ化する機能でした。

別の例として、目標体重に対して進捗状況をプロットする体重追跡アプリケーションについて考えてみます。図1は、そのようなアプリケーションがAndroidフォンでどのように見えるかを示しています。この図では、赤い折れ線グラフを使用して、2017年の月間平均体重を示しています。目標体重は、下部近くの緑色の直線で示されています。(折れ線グラフに示されているデータ値は架空のものですが、この記事の作成者に関しては現実的です。)

ジョンI.ムーア

この記事では、オープンソースライブラリのGraphLibを使用して、Androidでの数学関数のグラフ化の基本を示します。これは、私の学生がアプリケーションに使用したものと同じグラフライブラリではありません。実際、それははるかに簡単で使いやすいです。

ダウンロードGraphLibをダウンロードこの記事で紹介したオープンソースのAndroidグラフライブラリのソースコードを入手してください。ジョンI.ムーアによって作成されました。

GraphLibの概要

GraphLib1つのインターフェイスと8つのクラスで構成されます。これらのクラスのうち3つはライブラリの内部にあり、パッケージアクセスしかないため、GraphLibを使用するためにそれらを理解する必要はありません。残りの2つのクラスは非常に単純な機能を備えており、残りのクラスを理解するのは難しくありません。

以下では、GraphLibインターフェイスとその8つのクラスのそれぞれについて説明します。関数型インターフェースやラムダ式などのJava8機能を使用してライブラリーを開発およびテストしましたが、以前のバージョンのJava用にこれらの機能を変更するのは比較的簡単です。

GraphLibの機能インターフェイス

リスト1に示すように、インターフェースにFunctionは抽象メソッドが1つしかないため、機能インターフェースです。このインターフェースはDoubleUnaryOperator、パッケージにあるJava8とほぼ同等であることに注意してくださいjava.util.function。違いはFunction、アノテーション以外のJava8機能を使用しないことです@FunctionalInterface。このアノテーションを削除することは、Functionインターフェースを以前のバージョンのJavaと互換性を持たせるために必要な唯一の変更です。

リスト1.インターフェース関数

 package com.softmoore.android.graphlib; @FunctionalInterface public interface Function { public double apply(double x); } 

ラムダ式について学ぶ

クロージャ、関数リテラル、または単にラムダとも呼ばれるラムダ式は、Java Specification Request(JSR)335で定義された一連の機能を記述します。ラムダ式の正式ではない紹介は、Javaチュートリアルの最新バージョンのセクションで提供されます。JavaWorldの記事「ラムダ式を使用したJavaプログラミング」、およびBrian Goetzによるいくつかの記事、「ラムダの状態」と「ラムダの状態:ライブラリエディション」。

GraphLibクラス

クラスPointLabelは比較的単純です。x、y平面のPoint点を表すdouble値のペアをカプセル化し、double値と文字列をカプセル化します。double値は軸上の点を表し、文字列はそのラベル付けに使用されます。ポイント。図1の例では、ポイントを使用して、下部の軸の折れ線グラフとラベルを記述し、月の1文字の略語を示しています。これらのクラスの使用法を説明する例を、この記事の後半でさらに提供します。Label

クラスGraphFunctionGraphPointsScreenPointだけでなく、非常に単純です、彼らはまた、ライブラリの内部にあるとのアクセスのみをパッケージ化しています。ライブラリを使用するためにこれらのクラスを実際に理解する必要はないので、ここで簡単に説明します。

  • GraphFunction関数(つまり、インターフェイスを実装するクラスFunction)とその関数の描画に使用される色をカプセル化します。
  • GraphPointsポイントのリストを、それらをプロットするために使用される色とともにカプセル化します。このクラスは、点のプロットと折れ線グラフの描画の両方に内部的に使用されます。
  • ScreenPointAndroidデバイスの画面上のピクセル座標を表す整数値のペアをカプセル化します。このクラスはPoint、パッケージ内のAndroidクラスに似ていますが、より単純ですandroid.graphics

詳細に興味がある場合に備えて、これらのクラスのソースコードを提供しました。

GraphLibライブラリ内の残りの3つのクラスがありGraphGraph.BuilderGraphView。Androidアプリケーションでそれぞれが果たす役割を理解することが重要です。

クラスにGraphは、描画される色、ポイント、ラベル、グラフなどに関する情報が含まれていますが、基本的にAndroidグラフィックの詳細とは無関係です。一方でGraphフィールドをたくさん持っている、彼らはすべてのデフォルト値を持っているので、それは、このクラスのインスタンスを作成するために、Builderパターンを使用することに意味があります。クラスにGraphは、オブジェクトのBuilder作成に使用される、という名前のネストされた静的サブクラスが含まれていGraphます。

二つのクラスGraphとは、Graph.Builder開発者の視点から、一緒に行く、そして一つとして、基本的に、理解されるべきです。実際には、ネストされたクラスBuilderを使用してGraphオブジェクトを作成する方法を理解するだけで済みます。開発者は、Graphオブジェクトを作成した後、オブジェクトに渡す以外に、オブジェクトを直接操作することはGraphViewありません。オブジェクトは、Androidデバイスにすべてを表示する作業を行います。

リスト2は、クラスで使用可能なメソッドをまとめたものですGraph.Builder。後の例では、Builderパターンを使用してGraphオブジェクトを作成する方法を説明します。今のところ、デフォルトのコンストラクター(リスト2の最初の行)とbuild()メソッド(リスト2の最後の行)を除いて、他のすべてのメソッドがBuilderオブジェクトを返すことに注意してください。これにより、ビルダーメソッドへの呼び出しを連鎖させることができます。

リスト2.クラスのメソッドの要約 Graph.Builder

 public Builder() public Builder addFunction(Function function, int graphColor) public Builder addFunction(Function function) public Builder addPoints(Point[] points, int pointColor) public Builder addPoints(List points, int pointColor) public Builder addPoints(Point[] points) public Builder addPoints(List points) public Builder addLineGraph(Point[] points, int lineGraphColor) public Builder addLineGraph(List points, int lineGraphColor) public Builder addLineGraph(Point[] points) public Builder addLineGraph(List points) public Builder setBackgroundColor(int bgColor) public Builder setAxesColor(int axesColor) public Builder setFunctionColor(int functColor) public Builder setPointColor(int pointColor) public Builder setWorldCoordinates(double xMin, double xMax, double yMin, double yMax) public Builder setAxes(double axisX, double axisY) public Builder setXTicks(double[] xTicks) public Builder setXTicks(List xTicks) public Builder setYTicks(double[] yTicks) public Builder setYTicks(List yTicks) public Builder setXLabels(Label[] xLabels) public Builder setXLabels(List xLabels) public Builder setYLabels(Label[] yLabels) public Builder setYLabels(List yLabels) public Graph build() 

リスト2で、オブジェクトの配列またはオブジェクトのリストのいずれかを受け入れるために、メソッドの多くがオーバーロードされていることに注意してください。この記事の例では、配列の初期化がはるかに簡単であるという理由だけで、リストよりも配列を優先しますがGraphLib、両方をサポートしています。ただし、Java 9にはコレクション用の便利なファクトリメソッドが含まれているため、配列のこの小さな利点はなくなります。この記事の時点でJava9が広く使用されていたとしたら、両方のGraphLib例とそれ以降の例では、配列よりもリストを優先していました。

Builderパターン

Builderパターンの詳細については、JoshuaBlochによるEffectiveJavaの第2版、またはDustin MarxによるJavaWorldの記事「Javaメソッドのパラメーターが多すぎる、パート3:Builderパターン」を参照してください。

Androidのユーザーインターフェイスクラスはビューと呼ばViewれ、パッケージ内のクラスはandroid.viewユーザーインターフェイスコンポーネントの基本的な構成要素です。ビューは画面上の長方形の領域を占め、描画とイベント処理を担当します。継承の観点から見ると、クラスViewは、ユーザーインターフェイスコントロール(ボタン、テキストフィールドなど)だけでなく、子コンポーネントの配置を主に担当する非表示のビューグループであるレイアウトの祖先クラスです。

クラスGraphViewはクラスViewを拡張しGraph、Androidデバイスの画面ににカプセル化された情報を表示する役割を果たします。したがって、クラスGraphViewはすべての描画が行われる場所です。

GraphLibの使用

Androidのユーザーインターフェイスを作成するには、2つのアプローチがあります。手続き型アプローチ(Javaソースコード内)または宣言型アプローチ(XMLファイル内)です。どちらも有効ですが、コンセンサスは可能な限り宣言型アプローチを使用することです。私の例では、宣言型のアプローチを使用しました。

GraphLibライブラリを使用するには、5つの基本的な手順があります。始める前に、GraphLibライブラリ用にコンパイルされたJavaソースコードをダウンロードしてください。 

ダウンロードGraphLib.jarをダウンロードGraphLib用にコンパイルされたJavaソースコードを入手します。ジョンI.ムーアによって作成されました。

手順1.Androidプロジェクトでgraphlib.jarを利用できるようにします

Android Studioを使用して新しいプロジェクトを作成し、JARファイルgraphlib.jarlibsプロジェクトのディレクトリのサブディレクトリにコピーしますapp。Android Studioで、フォルダー構造をAndroidからProjectに切り替えます。次に、libsフォルダー(フォルダー内にネストされているapp)で、JARファイルを右クリックし、[ライブラリーとして追加]をクリックします。この最後のアクションは、アプリのbuild.gradleファイルの依存関係セクションにJARファイルを追加します。この手順についてサポートが必要な場合は、「AndroidStudioの外部ライブラリにjarを追加する方法」を参照してください。

ステップ2.GraphLibを使用するAndroidアクティビティを作成します

In Android applications, an activity represents a single screen with a user interface. Activities are defined primarily in two files: an XML file that declares the UI layout and components, and a Java file that defines runtime functionality such as event handling. When a new project is created, Android Studio usually creates a default activity named MainActivity. Use this activity or create a new one for your application.

Step 3. Add a GraphView to the layout for the activity

In the XML file for the activity's layout, you will declare a GraphView object in much the same way that you declare a button or a text view, except that you need to provide the full package name for the GraphView. Listing 3 shows an excerpt from a layout file that declares a GraphView followed by a TextView as part of a vertical linear layout. Following recommended practice, the actual values for the width and height of the GraphView are defined in separate dimen resource files, where different resource files provide values for different screen sizes/densities. (Note: I used 325 for both values in the examples below.)

Listing 3. Declaring a GraphView and a TextView in a layout XML file

Step 4. Import the library classes into the activity

Listing 4 shows the list of import statements for an application if the library classes are imported individually. The list of imports can be abbreviated to a single line as import com.softmoore.android.graphlib.* if desired. Personally, I prefer to see the expanded list as shown in Listing 4.

Listing 4. Import the library classes

 import com.softmoore.android.graphlib.Function; import com.softmoore.android.graphlib.Graph; import com.softmoore.android.graphlib.GraphView; import com.softmoore.android.graphlib.Label; import com.softmoore.android.graphlib.Point; 

Step 5. Create a Graph object and add it to the GraphView

Listing 5 shows the creation of a simple graph object--in this case a graph object that uses all of the default values. It essentially contains only a set of x- and y-axes, where the values on both axes range from 0 to 10. The listing also sets a title for the screen and text for the text view below the graph.

Listing 5. Create a Graph object and add it to the GraphView

 Graph graph = new Graph.Builder() .build(); GraphView graphView = findViewById(R.id.graph_view); graphView.setGraph(graph); setTitle("Empty Graph"); TextView textView = findViewById(R.id.graph_view_label); textView.setText("Graph of Axes"); 

図2は、Androidデバイスでこのアプリケーションを実行した結果を示しています。

ジョンI.ムーア

AndroidアプリケーションでのGraphLibの使用

この記事の残りの部分では、Androidアプリケーション開発におけるGraphLibライブラリの実際の使用法に焦点を当てます。簡単な説明とソースコードの抜粋を含む7つの例を紹介します。これらの例のJavaコードリストはGraph.Builder、適切なGraphオブジェクトを作成するために使用することに焦点を合わせていることに注意してください。通話findViewById()setGraph()setTitle()、などは、リスト5に示したものと同様であろうと、コード・リストに含まれていません。