Android

Kotlin MPAndroidChartライブラリを使い移動平均線を描画してみる。

投稿日:2019年3月11日 更新日:

はじめに

こんにちは、suzukiです。前回の記事に続きKotlinでMPAndroidChartライブラリを使い移動平均線を描画します。
Kolinはまだまだ勉強中なので練習として作成しました。

MPAndroidChartライブラリについて

今回KotlinでMPAndroidChartを利用してチャートを書きます。
Androidのサンプルはストアからダウンロードが可能です。

ライブラリの導入

Androidは追加方法がシンプルでいいですね。
build.gradle(Project)

build.gradle(Module)

上記を追加してgradleのSyncを行えばライブラリの準備が整います。

描画の準備

次にXMLでレイアウトを作成します。
今回はSwift同様に画面いっぱいに3つのチャートを配置していきます。
こちらの記事を参考に作成しました。

  • LineChart CandleStickChart CombinedChartを追加
  • 上下左右に制約を追加
  • 三つのChartの高さを等しく

折れ線グラフを描画する

シンプルな折れ線グラフを描画しようと思います。
完成予定

LineChartの設定

LineChartに設定できる内容はたくさんあります。
今回は画像のようなシンプルな線グラフを表示します。
数値などの文字にフォントが設定する内容を先に記述します(ご指摘いただきありがとうございます。)

apply便利ですね。

チャートのタップ時のリスナーを受け取るために下記を記述します。

LineChart用のデータ作成

グラフ用のデータはサンプルを参考に + Swiftと同じ様に作っています。

LineChartに描画

先ほどの二つの関数を使い折れ線を描画します。

折れ線グラフの描画が完了しました。
sampleがKotlinではないので置き換えるの苦労しました。
getterとsetterがあるとSwiftのプロパティのように記述できます。
setDrawCircles(false)と記述しているのは、DrawCirclesのgetterがisDrawCirclesEnabledと定義されており、制約に合わないためです。

ローソク足を描画する

次にローソク足の描画を行います。
完成予定

CandleStickChartの設定

CandleStickChartでは下記のような設定を行います。
LineChertとほとんど一緒です。Kotlin使っているのでXMLのIDでインスタンスが取得できるの便利ですね。

CandleStickChart用のデータ作成

CandleStickChartに描画

先ほど同様にonCreateにローソク足用のデータを追加しました。

Combined-Chartにローソク足と移動平均線を描画

それでは最後に複合グラフを描画します。
Swiftと違いバグなく実装できました。
完成予定

CombinedChartの設定

下記の設定を行います。
表示領域を少し調整する必要がありました。
キャンドル用のデータを何も考えずに描画すると最初と最後が見切れてしまいます。
今回は最大を20fと最小を0fと設定しています。入力されるデータ数を参照して調整できるように変更したほうがいいかもしれません。

CombinedChart用のデータ作成

移動平均線用の計算ロジックを組み込みます。
private var endPoints = mutableListOf()を宣言します。
宣言したendPointsにキャンドルデータの作成のロジック部分で終値を保存します。

移動平均線は5つのデータ分の終値の平均でデータをもとに折れ線グラフを描画作成します。

CombinedChartに描画

最後にonCreateでデータの値をセットします。

最後に

最後までありがとうございます。SwiftとKotlin両方で同じようなコードを書きました。
Kotlinの良さを最大限は引き出せていないかと思いますし、AndroidStudioに慣れてもおりません。
少しずつ慣れていこうと思いますので、またAndroidの記事もあげていきたいと思っております。

おすすめ書籍

Kotlinスタートブック -新しいAndroidプログラミング Kotlinイン・アクション 速習 Kotlin: Javaより簡単!新Android開発言語を今すぐマスター 速習シリーズ

blog-page_footer_336




blog-page_footer_336




-Android
-

執筆者:


  1. 匿名 より:

    mTypeface がエラーになります

    • suzuki より:

      ご指摘ありがとうございます。
      宣言部分の表記もれでした。LineChartの設定の箇所に下記を追記させていただいております。
      private var mTypeface = Typeface.create(Typeface.SANS_SERIF, Typeface.NORMAL)

comment

メールアドレスが公開されることはありません。

CAPTCHA


関連記事

Kotlin ChartsライブラリとCryptowatchAPIでローソク足を描画してみる。

1 はじめに2 CryptoWatchについて2.1 OHLC3 リクエスト方法3.1 CryptoWatchのAPI4 Androidでの実装4.1 実装前の準備4.2 データクラスの作成4.3 リ ...

【Androidマテリアル】Ripple Effect

1 はじめに2 Ripple Effectとは3 設定方法4 カスタマイズ5 さいごに はじめに こんにちは、ソニーから新Aiboが発表されましたね。個人的には欲しいと思っているのですが、最近Goog ...

【Kotlin】FirebaseAuthenticationでGoogle・Facebook連携する

1 はじめに2 Firebaseプロジェクトの設定3 build.gradleに追記4 Googleログイン5 Facebookログイン6 さいごに7 参考8 おすすめ書籍 はじめに はじめまして。m ...

Kotlinのスコープ関数を調べて見た

1 はじめに2 スコープ関数とは3 スコープ関数の種類について4 with関数4.1 使い方4.1.1 withを使わない場合4.1.2 withを使う場合4.2 所感5 apply関数5.1 使い方 ...

[Androidアニメーション]Shared Elements遷移

1 はじめに2 Shared Elements遷移とは3 layout xml4 Activity遷移5 その他6 さいごに はじめに 最近、雨が多いですね。そんな時は家にこもって、プログラミングをす ...

フォロー

follow us in feedly

blog-page_side_responsive

2019年3月
 12
3456789
10111213141516
17181920212223
24252627282930
31 

アプリ情報

私たちは無料アプリもリリースしています、ぜひご覧ください。 下記のアイコンから無料でダウンロードできます。