Notes

In this section we'll learn how to build a custom task completion ring animation using:

• Custom Painters
• AnimationController
• AnimatedBuilder
• Gesture Detectors

To get started, grab the starter project: habit_tracker_flutter_chapter4.zip.

Gradle updates needed to run on Android

If you build the app on Android, you'll encounter this error:

┌─ Flutter Fix ────────────────────────────────────────────────────────────────────────────────────┐
│ [!] Your project requires a higher compileSdkVersion.                                            │
│ Fix this issue by bumping the compileSdkVersion in                                               │
│ /Users/andrea/work/codewithandrea/flutter-animations-course/recordings-code/flutter_animations_c │
│ ourse_materials/projects/habit_tracker_flutter/android/app/build.gradle:                         │
│ android {                                                                                        │
│   compileSdkVersion 31                                                                           │
│ }                                                                                                │
└──────────────────────────────────────────────────────────────────────────────────────────────────┘

This can be fixed by setting the compileSdkVersion to 31 as suggested above.

A similar error will also require to upgrade to a newer Kotlin version:

┌─ Flutter Fix ────────────────────────────────────────────────────────────────────────────────────┐
│ [!] Your project requires a newer version of the Kotlin Gradle plugin.                           │
│ Find the latest version on https://kotlinlang.org/docs/gradle.html#plugin-and-versions, then     │
│ update                                                                                           │
│ /Users/andrea/work/codewithandrea/flutter-animations-course/recordings-code/flutter_animations_c │
│ ourse_materials/projects/habit_tracker_flutter/android/build.gradle:                             │
│ ext.kotlin_version = '<latest-version>'                                                          │
└──────────────────────────────────────────────────────────────────────────────────────────────────┘

To fix this, update the android/build.gradle file:

buildscript {
    ext.kotlin_version = '1.6.10'
    repositories {
        google()
        mavenCentral()
    }

    dependencies {
        classpath 'com.android.tools.build:gradle:7.1.2'
        classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlin_version"
    }
}

allprojects {
    repositories {
        google()
        mavenCentral()
    }
}

rootProject.buildDir = '../build'
subprojects {
    project.buildDir = "${rootProject.buildDir}/${project.name}"
}
subprojects {
    project.evaluationDependsOn(':app')
}

task clean(type: Delete) {
    delete rootProject.buildDir
}

In order for this to work, also update the following inside android/gradle/wrapper/gradle-wrapper.properties:

distributionUrl=https\://services.gradle.org/distributions/gradle-7.4-all.zip