Improve charts UI

feature/top10
Aurelien Hubert 7 years ago
parent c7d9d22a28
commit 7fce966159
  1. 2
      app/src/main/java/net/pokeranalytics/android/calculus/Stat.kt
  2. 10
      app/src/main/java/net/pokeranalytics/android/ui/fragment/GraphFragment.kt
  3. 9
      app/src/main/java/net/pokeranalytics/android/ui/graph/GraphExtensions.kt
  4. 19
      app/src/main/java/net/pokeranalytics/android/ui/view/LegendView.kt
  5. 38
      app/src/main/res/layout/fragment_evograph.xml
  6. 45
      app/src/main/res/layout/layout_legend_default.xml
  7. 44
      app/src/main/res/values/styles.xml

@ -172,7 +172,7 @@ enum class Stat(var underlyingClass: Class<out Timed>? = null) : RowRepresentabl
fun cumulativeLabelResId(context: Context) : String {
val resId = when (this) {
AVERAGE, AVERAGE_DURATION, NETRESULT, NET_BB_PER_100_HANDS,
AVERAGE, AVERAGE_DURATION, NET_BB_PER_100_HANDS,
HOURLY_RATE_BB, AVERAGE_NET_BB, ROI, WIN_RATIO, HOURLY_RATE -> R.string.average
NETRESULT, DURATION -> R.string.total
STANDARD_DEVIATION -> R.string.net_result

@ -75,12 +75,12 @@ class GraphFragment : PokerAnalyticsFragment(), OnChartValueSelectedListener {
parentActivity.supportActionBar?.setDisplayHomeAsUpEnabled(true)
setHasOptionsMenu(true)
//TODO: Set correct title
toolbar.title = "Stats"
toolbar.title = stat.localizedTitle(requireContext())
val dataSet = LineDataSet(this.entries, this.stat.name)
val colors = arrayOf(R.color.green_light).toIntArray()
dataSet.setColors(colors, context)
dataSet.setDrawCircles(false)
val lineData = LineData(listOf(dataSet))
this.chartView = when (stat.graphType) {
@ -100,13 +100,12 @@ class GraphFragment : PokerAnalyticsFragment(), OnChartValueSelectedListener {
this.chartView.setStyle(requireContext())
this.chartView.setOnChartValueSelectedListener(this)
this.stat.aggregationTypes.forEachIndexed { index, type ->
this.stat.aggregationTypes.forEach { type ->
val chip = Chip(requireContext())
chip.id = type.ordinal
chip.text = requireContext().getString(type.resId)
chip.chipStartPadding = 8f.px
chip.chipEndPadding = 8f.px
chip.isChecked = index == 0
this.chipGroup.addView(chip)
}
@ -114,6 +113,7 @@ class GraphFragment : PokerAnalyticsFragment(), OnChartValueSelectedListener {
}
this.chipGroup.check(this.stat.aggregationTypes.first().ordinal)
}
// OnChartValueSelectedListener

@ -3,7 +3,9 @@ package net.pokeranalytics.android.ui.graph
import android.content.Context
import androidx.core.content.ContextCompat
import com.github.mikephil.charting.charts.BarLineChartBase
import com.github.mikephil.charting.components.XAxis
import net.pokeranalytics.android.R
import net.pokeranalytics.android.util.extensions.px
//fun BarChart.setStyle(context: Context) {
// GraphHelper.setStyle(this, context)
@ -20,6 +22,13 @@ class GraphHelper {
fun setStyle(chart: BarLineChartBase<*>, context: Context) {
chart.xAxis.axisLineColor = ContextCompat.getColor(context, R.color.chart_default)
chart.xAxis.enableGridDashedLine(3.0f.px, 5.0f.px, 1.0f.px)
chart.xAxis.textColor = ContextCompat.getColor(context, R.color.chart_default)
chart.xAxis.labelCount = 4
chart.xAxis.position = XAxis.XAxisPosition.BOTTOM
chart.axisLeft.enableGridDashedLine(3.0f.px, 5.0f.px, 1.0f.px)
// this.xAxis.axisLineWidth = ChartAppearance.lineWidth
// this.xAxis.enableGridDashedLine(3.0f, 5.0f, 1.0f)
//

@ -43,24 +43,27 @@ class LegendView : FrameLayout {
addView(legendLayout, layoutParams)
}
/**
* Set the stat data to the view
*/
fun prepareWithStat(stat: Stat) {
this.stat1Name.text = stat.name
this.stat1Name.text = stat.localizedTitle(context)
this.stat2Name.text = stat.cumulativeLabelResId(context)
//TODO: Set real data
this.title.text = "11/04/2019"
this.stat1Value.text = "$521"
this.stat2Value.text = "$15,051"
this.counter.text = "21 Sessions"
}
/**
* Set the session data to the view
*
*/
fun setData(session: Session) {
this.title.text = ""
this.title.text = ""
this.title.text = ""
this.title.text = ""
this.title.text = ""
}
}

@ -12,7 +12,7 @@
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:title="@string/app_name" />
tools:title="@string/app_name" />
<FrameLayout
android:id="@+id/legendContainer"
@ -20,38 +20,40 @@
android:layout_height="wrap_content"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/toolbar">
<!--<include layout="@layout/layout_legend_default"/>-->
</FrameLayout>
app:layout_constraintTop_toBottomOf="@+id/toolbar" />
<FrameLayout
android:id="@+id/chartContainer"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toTopOf="@id/chipGroup"
android:layout_marginTop="8dp"
android:layout_marginBottom="8dp"
app:layout_constraintBottom_toTopOf="@id/chips"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/legendContainer"></FrameLayout>
app:layout_constraintTop_toBottomOf="@+id/legendContainer" />
<com.google.android.material.chip.ChipGroup
android:id="@+id/chipGroup"
<FrameLayout
android:id="@+id/chips"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:paddingTop="8dp"
android:paddingBottom="8dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:singleSelection="true"
tools:layout_height="60dp">
</com.google.android.material.chip.ChipGroup>
<com.google.android.material.chip.ChipGroup
android:id="@+id/chipGroup"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:orientation="horizontal"
app:chipSpacingHorizontal="8dp"
app:singleSelection="true"
tools:layout_height="60dp" />
<!--<com.github.mikephil.charting.charts.LineChart-->
<!--android:id="@+id/chart"-->
<!--android:layout_width="50dp"-->
<!--android:layout_height="50dp" app:layout_constraintTop_toBottomOf="@+id/toolbar" android:layout_marginBottom="8dp"-->
<!--app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" android:layout_marginEnd="8dp"-->
<!--app:layout_constraintStart_toStartOf="parent" android:layout_marginStart="8dp"/>-->
</FrameLayout>
</androidx.constraintlayout.widget.ConstraintLayout>

@ -6,24 +6,36 @@
android:layout_height="wrap_content"
android:orientation="vertical">
<View
android:id="@+id/background"
android:background="@color/green_header"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toTopOf="@+id/counter"
android:layout_marginBottom="4dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<androidx.appcompat.widget.AppCompatTextView
android:id="@+id/title"
style="@style/PokerAnalyticsTheme.TextView.LegendStatsValue"
style="@style/PokerAnalyticsTheme.TextView.LegendTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="16dp"
android:layout_marginEnd="16dp"
android:layout_marginTop="4dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:text="test" />
tools:text="11/04/2019" />
<androidx.appcompat.widget.AppCompatTextView
android:id="@+id/stat1Name"
style="@style/PokerAnalyticsTheme.TextView.LegendStatsTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginStart="16dp"
android:layout_marginTop="4dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/title"
@ -32,9 +44,10 @@
<androidx.appcompat.widget.AppCompatTextView
android:id="@+id/stat1Value"
style="@style/PokerAnalyticsTheme.TextView.LegendStatsValue"
android:layout_width="wrap_content"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginStart="16dp"
app:layout_constraintEnd_toStartOf="@+id/stat2Value"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/stat1Name"
tools:text="$2000" />
@ -43,9 +56,9 @@
android:id="@+id/stat2Name"
style="@style/PokerAnalyticsTheme.TextView.LegendStatsTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="8dp"
android:layout_height="0dp"
android:layout_marginTop="4dp"
android:layout_marginEnd="16dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintStart_toEndOf="@+id/stat1Name"
@ -57,23 +70,25 @@
style="@style/PokerAnalyticsTheme.TextView.LegendStatsValue"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="8dp"
android:layout_marginEnd="16dp"
android:layout_marginStart="8dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintStart_toEndOf="@+id/stat1Value"
app:layout_constraintTop_toBottomOf="@id/stat2Name"
tools:text="$2000000000000000" />
tools:text="$2000000000" />
<androidx.appcompat.widget.AppCompatTextView
android:id="@+id/counter"
style="@style/PokerAnalyticsTheme.TextView.LegendStatsTitle"
style="@style/PokerAnalyticsTheme.TextView.LegendSubtitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="8dp"
android:layout_marginEnd="16dp"
android:layout_marginTop="8dp"
android:layout_marginBottom="8dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toBottomOf="@id/stat2Value"
app:layout_constraintBottom_toBottomOf="parent"
tools:text="152 sessions" />
</androidx.constraintlayout.widget.ConstraintLayout>

@ -1,7 +1,7 @@
<resources>
<!-- PokerAnalytics application theme -->
<style name="PokerAnalyticsTheme" parent="Theme.MaterialComponents.Light.NoActionBar">
<style name="PokerAnalyticsTheme" parent="Theme.MaterialComponents.NoActionBar">
<item name="colorPrimary">@color/colorPrimary</item>
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
@ -10,6 +10,7 @@
<item name="android:windowBackground">@color/gray_dark</item>
<item name="android:navigationBarColor">@color/colorPrimary</item>
<item name="android:actionMenuTextColor">@color/white</item>
<item name="colorControlNormal">@color/white</item>
<item name="bottomNavigationStyle">@style/PokerAnalyticsTheme.BottomNavigationView</item>
<item name="toolbarStyle">@style/PokerAnalyticsTheme.Toolbar</item>
@ -23,14 +24,18 @@
<!-- Defaults -->
<!-- Bottom Bar -->
<style name="PokerAnalyticsTheme.BottomNavigationView">
<item name="itemIconTint">@color/bottom_navigation_item</item>
<item name="itemTextColor">@color/bottom_navigation_item</item>
<item name="android:background">@color/gray_darker</item>
</style>
<!-- Toolbar -->
<style name="PokerAnalyticsTheme.Toolbar" parent="Widget.MaterialComponents.Toolbar">
<item name="android:background">@color/gray_darker</item>
<item name="titleTextColor">@color/white</item>
@ -40,6 +45,7 @@
<style name="PokerAnalyticsTheme.Toolbar.TitleAppearance">
<item name="android:textSize">20sp</item>
<item name="android:fontFamily">@font/roboto</item>
<item name="titleTextColor">@color/white</item>
</style>
<style name="PokerAnalyticsTheme.Toolbar.ExpandedTitleAppearance">
@ -54,9 +60,11 @@
<style name="PokerAnalyticsTheme.Toolbar.Session" parent="ThemeOverlay.AppCompat.Dark.ActionBar">
<item name="android:actionMenuTextColor">@color/green</item>
<item name="titleTextAppearance">@style/PokerAnalyticsTheme.Toolbar.TitleAppearance</item>
</style>
<!-- Bottom App Bar -->
<style name="PokerAnalyticsTheme.BottomAppBar" parent="Widget.MaterialComponents.BottomAppBar">
<item name="backgroundTint">@color/gray_darker</item>
<item name="android:colorPrimary">@color/white</item>
@ -64,7 +72,9 @@
<item name="popupTheme">@style/ThemeOverlay.AppCompat.Dark.ActionBar</item>
</style>
<!-- TextView -->
<style name="PokerAnalyticsTheme.TextView">
<item name="android:textColor">@color/white</item>
<item name="android:fontFamily">@font/roboto</item>
@ -124,12 +134,29 @@
<item name="android:ellipsize">end</item>
</style>
<!-- Graph legend -->
<style name="PokerAnalyticsTheme.TextView.LegendStatsTitle">
<style name="PokerAnalyticsTheme.TextView.LegendTitle">
<item name="android:textSize">24sp</item>
<item name="android:textColor">@color/white</item>
<item name="android:fontFamily">@font/roboto</item>
<item name="android:maxLines">1</item>
<item name="android:ellipsize">end</item>
</style>
<style name="PokerAnalyticsTheme.TextView.LegendSubtitle">
<item name="android:textSize">12sp</item>
<item name="android:textColor">@color/kaki_light</item>
<item name="android:fontFamily">@font/roboto</item>
<item name="android:maxLines">1</item>
<item name="android:ellipsize">end</item>
</style>
<style name="PokerAnalyticsTheme.TextView.LegendStatsTitle">
<item name="android:textSize">14sp</item>
<item name="android:textColor">@color/white</item>
<item name="android:fontFamily">@font/roboto_light</item>
<item name="android:fontFamily">@font/roboto_bold</item>
<item name="android:textAllCaps">true</item>
<item name="android:maxLines">1</item>
<item name="android:ellipsize">end</item>
@ -143,13 +170,16 @@
<item name="android:ellipsize">end</item>
</style>
<!-- Bottom Sheet -->
<style name="PokerAnalyticsTheme.TextView.BottomSheetValue">
<item name="android:textSize">22sp</item>
<item name="android:textColor">@color/white</item>
<item name="android:fontFamily">@font/roboto</item>
</style>
<!-- Session Row -->
<style name="PokerAnalyticsTheme.TextView.SessionRow">
@ -187,7 +217,9 @@
<item name="android:textColor">@color/green</item>
</style>
<!-- Button Row -->
<style name="PokerAnalyticsTheme.TextView.ButtonRow">
<item name="android:textColor">@color/colorAccent</item>
<item name="android:maxLines">1</item>
@ -199,6 +231,7 @@
<!-- Alert Dialog -->
<style name="PokerAnalyticsTheme.AlertDialog" parent="Theme.MaterialComponents.Dialog">
<item name="colorAccent">@color/green</item>
<item name="android:textColorPrimary">@color/white</item>
@ -207,6 +240,7 @@
<!-- EditText -->
<style name="PokerAnalyticsTheme.EditText" parent="Widget.AppCompat.EditText">
<item name="android:textColor">@color/white</item>
<item name="android:fontFamily">@font/roboto</item>
@ -215,7 +249,9 @@
<item name="android:paddingBottom">16dp</item>
</style>
<!-- Button -->
<style name="PokerAnalyticsTheme.Button" parent="Widget.MaterialComponents.Button">
<item name="iconPadding">0dp</item>
<item name="android:height">48dp</item>
@ -234,7 +270,9 @@
<item name="android:fontFamily">@font/roboto_bold</item>
</style>
<!-- Chip -->
<style name="PokerAnalyticsTheme.Chip" parent="Widget.MaterialComponents.Chip.Choice">
<item name="chipBackgroundColor">@color/chips_background_states</item>
<item name="android:textColor">@color/white</item>

Loading…
Cancel
Save