#要約
過去にシンプルな棒グラフを作ったものをKotlin化。
applyを使うことで、少し分かりやすくなった気がする。
Javaで書いたものは以前の記事を参照
MPAndroidChartでシンプルな棒グラフの作成
拡大縮小もハイライトもスクロールもしない表示するだけのグラフを作りたかった。
#やったこと
基本的にJavaの時と同じ。
・ project level build.gradle
build.gradle
allprojects {
repositories {
maven { url "https://jitpack.io" }
}
}
・your app build.gradle
build.gradle
dependencies {
implementation 'com.github.PhilJay:MPAndroidChart:v3.0.3'
}
・リソースファイルにBarChartを追加
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<com.github.mikephil.charting.charts.BarChart
android:id="@+id/bar_chart"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</android.support.constraint.ConstraintLayout>
・グラフの色をcolors.xmlに追加
colors.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="colorPrimary">#3F51B5</color>
<color name="colorPrimaryDark">#303F9F</color>
<color name="colorAccent">#FF4081</color>
<color name="material_blue">#64b5f6</color>
<color name="material_green">#81c784</color>
<color name="material_yellow">#fff176</color>
</resources>
・グラフの表示を設定
mainActivity.kt
class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
val chart = bar_chart
//表示データ取得
chart.data = BarData(getBarData())
//Y軸(左)の設定
chart.axisLeft.apply {
axisMinimum = 0f
axisMaximum = 100f
labelCount = 5
setDrawTopYLabelEntry(true)
setValueFormatter { value, axis -> "" + value.toInt()}
}
//Y軸(右)の設定
chart.axisRight.apply {
setDrawLabels(false)
setDrawGridLines(false)
setDrawZeroLine(false)
setDrawTopYLabelEntry(true)
}
//X軸の設定
val labels = arrayOf("","国語","数学","英語") //最初の””は原点の値
chart.xAxis.apply {
valueFormatter = IndexAxisValueFormatter(labels)
labelCount = 3 //表示させるラベル数
position = XAxis.XAxisPosition.BOTTOM
setDrawLabels(true)
setDrawGridLines(false)
setDrawAxisLine(true)
}
//グラフ上の表示
chart.apply {
setDrawValueAboveBar(true)
description.isEnabled = false
isClickable = false
legend.isEnabled = false //凡例
setScaleEnabled(false)
animateY(1200, Easing.EasingOption.Linear)
}
}
private fun getBarData(): ArrayList<IBarDataSet> {
//表示させるデータ
val entries = ArrayList<BarEntry>().apply {
add(BarEntry(1f, 60f))
add(BarEntry(2f, 80f))
add(BarEntry(3f, 70f))
}
val dataSet = BarDataSet(entries, "bar").apply {
//整数で表示
valueFormatter = IValueFormatter { value, _, _, _ -> "" + value.toInt() }
//ハイライトさせない
isHighlightEnabled = false
//Barの色をセット
setColors(intArrayOf(R.color.material_blue, R.color.material_green, R.color.material_yellow), this@MainActivity)
}
val bars = ArrayList<IBarDataSet>()
bars.add(dataSet)
return bars
}
}