From 4ca75058252bfb7091ac4fc364499065df38408f Mon Sep 17 00:00:00 2001 From: Nishant Mishra Date: Thu, 20 Nov 2025 16:01:29 +0530 Subject: [PATCH] feat(graphs): use updated fonts in graphs --- .../ui/statsScreen/ProductivityGraph.kt | 19 ++++++++-- .../pomodoro/ui/statsScreen/StatsScreen.kt | 36 ++++++++++++------- .../ui/statsScreen/TimeColumnChart.kt | 28 +++++++++------ .../pomodoro/ui/statsScreen/TimeLineChart.kt | 27 ++++++++------ 4 files changed, 75 insertions(+), 35 deletions(-) diff --git a/app/src/main/java/org/nsh07/pomodoro/ui/statsScreen/ProductivityGraph.kt b/app/src/main/java/org/nsh07/pomodoro/ui/statsScreen/ProductivityGraph.kt index 37cecba..70c928d 100644 --- a/app/src/main/java/org/nsh07/pomodoro/ui/statsScreen/ProductivityGraph.kt +++ b/app/src/main/java/org/nsh07/pomodoro/ui/statsScreen/ProductivityGraph.kt @@ -1,12 +1,23 @@ /* * Copyright (c) 2025 Nishant Mishra * - * You should have received a copy of the GNU General Public License - * along with this program. If not, see . + * This file is part of Tomato - a minimalist pomodoro timer for Android. + * + * Tomato is free software: you can redistribute it and/or modify it under the terms of the GNU + * General Public License as published by the Free Software Foundation, either version 3 of the + * License, or (at your option) any later version. + * + * Tomato is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even + * the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU General + * Public License for more details. + * + * You should have received a copy of the GNU General Public License along with Tomato. + * If not, see . */ package org.nsh07.pomodoro.ui.statsScreen +import android.graphics.Typeface import androidx.compose.animation.AnimatedVisibility import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.ColumnScope @@ -28,6 +39,8 @@ fun ColumnScope.ProductivityGraph( expanded: Boolean, modelProducer: CartesianChartModelProducer, modifier: Modifier = Modifier, + axisTypeface: Typeface = Typeface.DEFAULT, + markerTypeface: Typeface = Typeface.DEFAULT, label: String = stringResource(R.string.productivity_analysis) ) { AnimatedVisibility(expanded) { @@ -40,6 +53,8 @@ fun ColumnScope.ProductivityGraph( Spacer(Modifier.height(8.dp)) TimeColumnChart( modelProducer, + axisTypeface = axisTypeface, + markerTypeface = markerTypeface, xValueFormatter = CartesianValueFormatter { _, value, _ -> when (value) { 0.0 -> "0 - 6" diff --git a/app/src/main/java/org/nsh07/pomodoro/ui/statsScreen/StatsScreen.kt b/app/src/main/java/org/nsh07/pomodoro/ui/statsScreen/StatsScreen.kt index 113c0a7..66c3957 100644 --- a/app/src/main/java/org/nsh07/pomodoro/ui/statsScreen/StatsScreen.kt +++ b/app/src/main/java/org/nsh07/pomodoro/ui/statsScreen/StatsScreen.kt @@ -17,6 +17,7 @@ package org.nsh07.pomodoro.ui.statsScreen +import android.graphics.Typeface import androidx.compose.animation.core.animateFloatAsState import androidx.compose.foundation.background import androidx.compose.foundation.layout.Arrangement @@ -59,6 +60,7 @@ import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.draw.rotate import androidx.compose.ui.input.nestedscroll.nestedScroll +import androidx.compose.ui.platform.LocalFontFamilyResolver import androidx.compose.ui.res.painterResource import androidx.compose.ui.res.stringResource import androidx.compose.ui.tooling.preview.Preview @@ -75,7 +77,8 @@ import org.nsh07.pomodoro.BuildConfig import org.nsh07.pomodoro.R import org.nsh07.pomodoro.data.Stat import org.nsh07.pomodoro.ui.statsScreen.viewModel.StatsViewModel -import org.nsh07.pomodoro.ui.theme.AppFonts.interClock +import org.nsh07.pomodoro.ui.theme.AppFonts.googleFlex400 +import org.nsh07.pomodoro.ui.theme.AppFonts.googleFlex600 import org.nsh07.pomodoro.ui.theme.AppFonts.robotoFlexTopBar import org.nsh07.pomodoro.ui.theme.TomatoTheme import org.nsh07.pomodoro.utils.millisecondsToHoursMinutes @@ -149,6 +152,10 @@ fun StatsScreen( } } + val resolver = LocalFontFamilyResolver.current + val axisTypeface = remember { resolver.resolve(googleFlex400).value as Typeface } + val markerTypeface = remember { resolver.resolve(googleFlex600).value as Typeface } + Column( horizontalAlignment = Alignment.CenterHorizontally, modifier = modifier.nestedScroll(scrollBehavior.nestedScrollConnection) @@ -219,7 +226,6 @@ fun StatsScreen( millisecondsToHoursMinutes(todayStat?.totalFocusTime() ?: 0) }, style = typography.displaySmall, - fontFamily = interClock, color = colorScheme.onPrimaryContainer, maxLines = 1, autoSize = TextAutoSize.StepBased(maxFontSize = typography.displaySmall.fontSize) @@ -246,7 +252,6 @@ fun StatsScreen( millisecondsToHoursMinutes(todayStat?.breakTime ?: 0) }, style = typography.displaySmall, - fontFamily = interClock, color = colorScheme.onTertiaryContainer, maxLines = 1, autoSize = TextAutoSize.StepBased(maxFontSize = typography.displaySmall.fontSize) @@ -279,13 +284,12 @@ fun StatsScreen( lastWeekAverageFocusTimes.sum().toLong() } ), - style = typography.displaySmall, - fontFamily = interClock + style = typography.displaySmall ) Text( stringResource(R.string.focus_per_day_avg), style = typography.titleSmall, - modifier = Modifier.padding(bottom = 4.dp) + modifier = Modifier.padding(bottom = 5.2.dp) ) } } @@ -293,6 +297,8 @@ fun StatsScreen( TimeColumnChart( lastWeekSummaryChartData.first, modifier = Modifier.padding(start = 16.dp), + axisTypeface = axisTypeface, + markerTypeface = markerTypeface, xValueFormatter = CartesianValueFormatter { context, x, _ -> context.model.extraStore[lastWeekSummaryChartData.second][x.toInt()] } @@ -326,6 +332,8 @@ fun StatsScreen( ProductivityGraph( lastWeekStatExpanded, lastWeekSummaryAnalysisModelProducer, + axisTypeface = axisTypeface, + markerTypeface = markerTypeface, label = stringResource(R.string.weekly_productivity_analysis), modifier = Modifier.padding(horizontal = 32.dp) ) @@ -355,13 +363,12 @@ fun StatsScreen( lastMonthAverageFocusTimes.sum().toLong() } ), - style = typography.displaySmall, - fontFamily = interClock + style = typography.displaySmall ) Text( text = stringResource(R.string.focus_per_day_avg), style = typography.titleSmall, - modifier = Modifier.padding(bottom = 4.dp) + modifier = Modifier.padding(bottom = 5.2.dp) ) } } @@ -369,6 +376,8 @@ fun StatsScreen( TimeColumnChart( lastMonthSummaryChartData.first, modifier = Modifier.padding(start = 16.dp), + axisTypeface = axisTypeface, + markerTypeface = markerTypeface, thickness = 8.dp, xValueFormatter = CartesianValueFormatter { context, x, _ -> context.model.extraStore[lastMonthSummaryChartData.second][x.toInt()] @@ -403,6 +412,8 @@ fun StatsScreen( ProductivityGraph( lastMonthStatExpanded, lastMonthSummaryAnalysisModelProducer, + axisTypeface = axisTypeface, + markerTypeface = markerTypeface, label = stringResource(R.string.monthly_productivity_analysis), modifier = Modifier.padding(horizontal = 32.dp) ) @@ -432,13 +443,12 @@ fun StatsScreen( lastYearAverageFocusTimes.sum().toLong() } ), - style = typography.displaySmall, - fontFamily = interClock + style = typography.displaySmall ) Text( text = stringResource(R.string.focus_per_day_avg), style = typography.titleSmall, - modifier = Modifier.padding(bottom = 4.dp) + modifier = Modifier.padding(bottom = 5.2.dp) ) } } @@ -446,6 +456,8 @@ fun StatsScreen( TimeLineChart( lastYearSummaryChartData.first, modifier = Modifier.padding(start = 16.dp), + axisTypeface = axisTypeface, + markerTypeface = markerTypeface, xValueFormatter = CartesianValueFormatter { context, x, _ -> context.model.extraStore[lastYearSummaryChartData.second][x.toInt()] } diff --git a/app/src/main/java/org/nsh07/pomodoro/ui/statsScreen/TimeColumnChart.kt b/app/src/main/java/org/nsh07/pomodoro/ui/statsScreen/TimeColumnChart.kt index 4fab155..d5a0146 100644 --- a/app/src/main/java/org/nsh07/pomodoro/ui/statsScreen/TimeColumnChart.kt +++ b/app/src/main/java/org/nsh07/pomodoro/ui/statsScreen/TimeColumnChart.kt @@ -17,6 +17,7 @@ package org.nsh07.pomodoro.ui.statsScreen +import android.graphics.Typeface import androidx.compose.animation.core.AnimationSpec import androidx.compose.foundation.layout.height import androidx.compose.material3.ExperimentalMaterial3ExpressiveApi @@ -27,7 +28,6 @@ import androidx.compose.runtime.Composable import androidx.compose.runtime.LaunchedEffect import androidx.compose.runtime.remember import androidx.compose.ui.Modifier -import androidx.compose.ui.graphics.toArgb import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.unit.Dp import androidx.compose.ui.unit.dp @@ -35,14 +35,17 @@ import com.patrykandpatrick.vico.compose.cartesian.CartesianChartHost import com.patrykandpatrick.vico.compose.cartesian.axis.rememberBottom import com.patrykandpatrick.vico.compose.cartesian.axis.rememberStart import com.patrykandpatrick.vico.compose.cartesian.layer.rememberColumnCartesianLayer +import com.patrykandpatrick.vico.compose.cartesian.marker.rememberDefaultCartesianMarker import com.patrykandpatrick.vico.compose.cartesian.rememberCartesianChart +import com.patrykandpatrick.vico.compose.cartesian.rememberFadingEdges import com.patrykandpatrick.vico.compose.cartesian.rememberVicoZoomState import com.patrykandpatrick.vico.compose.common.ProvideVicoTheme import com.patrykandpatrick.vico.compose.common.component.rememberLineComponent +import com.patrykandpatrick.vico.compose.common.component.rememberShapeComponent +import com.patrykandpatrick.vico.compose.common.component.rememberTextComponent import com.patrykandpatrick.vico.compose.common.fill import com.patrykandpatrick.vico.compose.common.vicoTheme import com.patrykandpatrick.vico.compose.m3.common.rememberM3VicoTheme -import com.patrykandpatrick.vico.core.cartesian.FadingEdges import com.patrykandpatrick.vico.core.cartesian.Zoom import com.patrykandpatrick.vico.core.cartesian.axis.HorizontalAxis import com.patrykandpatrick.vico.core.cartesian.axis.VerticalAxis @@ -54,8 +57,6 @@ import com.patrykandpatrick.vico.core.cartesian.marker.ColumnCartesianLayerMarke import com.patrykandpatrick.vico.core.cartesian.marker.DefaultCartesianMarker import com.patrykandpatrick.vico.core.common.Fill import com.patrykandpatrick.vico.core.common.Insets -import com.patrykandpatrick.vico.core.common.component.ShapeComponent -import com.patrykandpatrick.vico.core.common.component.TextComponent import com.patrykandpatrick.vico.core.common.shape.CorneredShape import org.nsh07.pomodoro.ui.theme.TomatoTheme import org.nsh07.pomodoro.utils.millisecondsToHours @@ -67,6 +68,8 @@ import org.nsh07.pomodoro.utils.millisecondsToMinutes fun TimeColumnChart( modelProducer: CartesianChartModelProducer, modifier: Modifier = Modifier, + axisTypeface: Typeface = Typeface.DEFAULT, + markerTypeface: Typeface = Typeface.DEFAULT, thickness: Dp = 40.dp, columnCollectionSpacing: Dp = 4.dp, xValueFormatter: CartesianValueFormatter = CartesianValueFormatter.Default, @@ -109,31 +112,34 @@ fun TimeColumnChart( ), startAxis = VerticalAxis.rememberStart( line = rememberLineComponent(Fill.Transparent), + label = rememberTextComponent(typeface = axisTypeface), tick = rememberLineComponent(Fill.Transparent), guideline = rememberLineComponent(Fill.Transparent), valueFormatter = yValueFormatter ), bottomAxis = HorizontalAxis.rememberBottom( line = rememberLineComponent(Fill.Transparent), + label = rememberTextComponent(typeface = axisTypeface), tick = rememberLineComponent(Fill.Transparent), guideline = rememberLineComponent(Fill.Transparent), valueFormatter = xValueFormatter ), - marker = DefaultCartesianMarker( - TextComponent( - color = colorScheme.inverseOnSurface.toArgb(), - background = ShapeComponent( + marker = rememberDefaultCartesianMarker( + rememberTextComponent( + color = colorScheme.inverseOnSurface, + typeface = markerTypeface, + background = rememberShapeComponent( fill = fill(colorScheme.inverseSurface), shape = CorneredShape.rounded(8f) ), - textSizeSp = typography.bodySmall.fontSize.value, - lineHeightSp = typography.bodySmall.lineHeight.value, + textSize = typography.bodySmall.fontSize, + lineHeight = typography.bodySmall.lineHeight, padding = Insets(verticalDp = 4f, horizontalDp = 8f), margins = Insets(bottomDp = 2f) ), valueFormatter = markerValueFormatter ), - fadingEdges = FadingEdges() + fadingEdges = rememberFadingEdges() ), modelProducer = modelProducer, zoomState = rememberVicoZoomState( diff --git a/app/src/main/java/org/nsh07/pomodoro/ui/statsScreen/TimeLineChart.kt b/app/src/main/java/org/nsh07/pomodoro/ui/statsScreen/TimeLineChart.kt index 057c713..e4ba638 100644 --- a/app/src/main/java/org/nsh07/pomodoro/ui/statsScreen/TimeLineChart.kt +++ b/app/src/main/java/org/nsh07/pomodoro/ui/statsScreen/TimeLineChart.kt @@ -17,6 +17,7 @@ package org.nsh07.pomodoro.ui.statsScreen +import android.graphics.Typeface import androidx.compose.animation.core.AnimationSpec import androidx.compose.foundation.layout.height import androidx.compose.material3.ExperimentalMaterial3ExpressiveApi @@ -37,14 +38,17 @@ import com.patrykandpatrick.vico.compose.cartesian.axis.rememberBottom import com.patrykandpatrick.vico.compose.cartesian.axis.rememberStart import com.patrykandpatrick.vico.compose.cartesian.layer.rememberLine import com.patrykandpatrick.vico.compose.cartesian.layer.rememberLineCartesianLayer +import com.patrykandpatrick.vico.compose.cartesian.marker.rememberDefaultCartesianMarker import com.patrykandpatrick.vico.compose.cartesian.rememberCartesianChart +import com.patrykandpatrick.vico.compose.cartesian.rememberFadingEdges import com.patrykandpatrick.vico.compose.cartesian.rememberVicoZoomState import com.patrykandpatrick.vico.compose.common.ProvideVicoTheme import com.patrykandpatrick.vico.compose.common.component.rememberLineComponent +import com.patrykandpatrick.vico.compose.common.component.rememberShapeComponent +import com.patrykandpatrick.vico.compose.common.component.rememberTextComponent import com.patrykandpatrick.vico.compose.common.fill import com.patrykandpatrick.vico.compose.common.vicoTheme import com.patrykandpatrick.vico.compose.m3.common.rememberM3VicoTheme -import com.patrykandpatrick.vico.core.cartesian.FadingEdges import com.patrykandpatrick.vico.core.cartesian.Zoom import com.patrykandpatrick.vico.core.cartesian.axis.HorizontalAxis import com.patrykandpatrick.vico.core.cartesian.axis.VerticalAxis @@ -57,8 +61,6 @@ import com.patrykandpatrick.vico.core.cartesian.marker.DefaultCartesianMarker import com.patrykandpatrick.vico.core.cartesian.marker.LineCartesianLayerMarkerTarget import com.patrykandpatrick.vico.core.common.Fill import com.patrykandpatrick.vico.core.common.Insets -import com.patrykandpatrick.vico.core.common.component.ShapeComponent -import com.patrykandpatrick.vico.core.common.component.TextComponent import com.patrykandpatrick.vico.core.common.shader.ShaderProvider import com.patrykandpatrick.vico.core.common.shape.CorneredShape import org.nsh07.pomodoro.ui.theme.TomatoTheme @@ -71,6 +73,8 @@ import org.nsh07.pomodoro.utils.millisecondsToMinutes fun TimeLineChart( modelProducer: CartesianChartModelProducer, modifier: Modifier = Modifier, + axisTypeface: Typeface = Typeface.DEFAULT, + markerTypeface: Typeface = Typeface.DEFAULT, thickness: Float = 2f, pointSpacing: Dp = 12.dp, xValueFormatter: CartesianValueFormatter = CartesianValueFormatter.Default, @@ -123,31 +127,34 @@ fun TimeLineChart( ), startAxis = VerticalAxis.rememberStart( line = rememberLineComponent(Fill.Transparent), + label = rememberTextComponent(typeface = axisTypeface), tick = rememberLineComponent(Fill.Transparent), guideline = rememberLineComponent(Fill.Transparent), valueFormatter = yValueFormatter ), bottomAxis = HorizontalAxis.rememberBottom( line = rememberLineComponent(Fill.Transparent), + label = rememberTextComponent(typeface = axisTypeface), tick = rememberLineComponent(Fill.Transparent), guideline = rememberLineComponent(Fill.Transparent), valueFormatter = xValueFormatter ), - marker = DefaultCartesianMarker( - TextComponent( - color = colorScheme.inverseOnSurface.toArgb(), - background = ShapeComponent( + marker = rememberDefaultCartesianMarker( + rememberTextComponent( + color = colorScheme.inverseOnSurface, + typeface = markerTypeface, + background = rememberShapeComponent( fill = fill(colorScheme.inverseSurface), shape = CorneredShape.rounded(8f) ), - textSizeSp = typography.bodySmall.fontSize.value, - lineHeightSp = typography.bodySmall.lineHeight.value, + textSize = typography.bodySmall.fontSize, + lineHeight = typography.bodySmall.lineHeight, padding = Insets(verticalDp = 4f, horizontalDp = 8f), margins = Insets(bottomDp = 2f) ), valueFormatter = markerValueFormatter ), - fadingEdges = FadingEdges() + fadingEdges = rememberFadingEdges() ), modelProducer = modelProducer, zoomState = rememberVicoZoomState(