Android Canvas Themes
♨ [ ᴀɴᴅʀᴏɪᴅ ʟɪʙʀᴀʀʏ ] ♨

ɪ ⁃ ᴀʙᴏᴜᴛ ᴀɴᴅʀᴏɪᴅ ʟɪʙʀᴀʀʏ

Android Canvas Themes is a Kotlin library that offers a range of Material Design inspired color themes for Android apps. It includes multiple ready to use themes and supports both light and dark modes, making it easy for developers to design visually appealing user interfaces.

⁃ ᴄᴏɴᴛᴇɴᴛꜱ ⁃

ɪɴꜱᴛᴀʟʟᴀᴛɪᴏɴ | ʟɪʙʀᴀʀʏ ᴜꜱᴀɢᴇ | ᴠɪꜱᴜᴀʟ ᴘʀᴇꜱᴇɴᴛᴀᴛɪᴏɴ | ᴘʀᴏᴊᴇᴄᴛ ʙʀᴀɴᴄʜᴇꜱ | ᴅᴇᴠ ꜰᴇᴀᴛᴜʀᴇꜱ | ᴘʀᴏᴊᴇᴄᴛ ɴᴏᴛᴇꜱ

ɪɪ ⁃ ɪɴꜱᴛᴀʟʟᴀᴛɪᴏɴ

Adding the Library to Your Project

⭓ Using Groovy DSL

1. Add the following to your settings.gradle file to enable JitPack:

dependencyResolutionManagement {
  repositoriesMode.set(RepositoriesMode.FAIL_ON_PROJECT_REPOS)
     repositories {
       mavenCentral()
       maven { url 'https://jitpack.io' }
  }
}

2. Then, add the dependency to your build.gradle file:

dependencies {
    implementation 'com.github.zyferlink:android-canvas-themes:1.0.0'
}

⭓ Using Kotlin DSL

1. Add the following to your settings.gradle.kts file to enable JitPack:

dependencyResolutionManagement {
    repositoriesMode.set(RepositoriesMode.FAIL_ON_PROJECT_REPOS)
    repositories {
        google()
        mavenCentral()
        maven { url = uri("https://jitpack.io") }
    }
}

2. Then, add the dependency to your build.gradle.kts file:

dependencies {
    implementation("com.github.zyferlink:android-canvas-themes:1.0.0")
}

ɪɪɪ ⁃ ʟɪʙʀᴀʀʏ ᴜꜱᴀɢᴇ

⭓ Accessing Themes

You can use the predefined themes available in the MaterialCanvas object. Each theme provides lightColors, darkColors, lightColorScheme, and darkColorScheme for customization.

val lightColorScheme = MaterialCanvas.amberBlazeTheme.lightColorScheme

val darkColorScheme = MaterialCanvas.greenBlazeTheme.darkColorScheme

Applying Light and Dark Mode | Theming with Material3

Example:

The library makes it easy to dynamically apply light and dark mode themes using MaterialTheme from Material3. Here’s an example:

@Composable
fun AppTheme(
  // Automatically detect system dark mode
    darkTheme: Boolean = isSystemInDarkTheme(), 
    content: @Composable () -> Unit
) {
  // ** Applying Green Blaze Theme > Light & Dark **
    val colorScheme = if (darkTheme) {
        MaterialCanvas.greenBlazeTheme.darkColorScheme
    } else {
        MaterialCanvas.greenBlazeTheme.lightColorScheme
    }

    // Edge-to-edge configuration
    val view = LocalView.current
    if (!view.isInEditMode) {
        SideEffect {
            setUpEdgeToEdge(view, darkTheme)
        }
    }

    // Apply Material Theme
    MaterialTheme(
        colorScheme = colorScheme,
        typography = Typography,
        shapes = Shapes,
        content = content
    )
}

Usage in Your App

@Composable
fun MyApp() {
    AppTheme { // Automatically adapts to system's light or dark mode
        Surface(
            modifier = Modifier.fillMaxSize(),
            color = MaterialTheme.colorScheme.background
        ) {
            Text(
                text = "Welcome to Android Canvas Themes!",
                color = MaterialTheme.colorScheme.onBackground
            )
        }
    }
}

Applying Colors

Example:

Use the colors directly in your components:

val primaryColor = MaterialCanvas.greenBlazeTheme.lightColors.primary

val darkBackground = MaterialCanvas.purpleBlazeTheme.darkColors.background

⭓ Supported Themes

The library includes the following themes:

1. Grayscale Theme

Here’s how you can access colors and color schemes for Grayscale theme:

// Access colors
val primaryColor = MaterialCanvas.grayscaleTheme.lightColors.primary
val onPrimaryColor = MaterialCanvas.grayscaleTheme.darkColors.onPrimary

// Access color schemes
val lightScheme = MaterialCanvas.grayscaleTheme.lightColorScheme
val darkScheme = MaterialCanvas.grayscaleTheme.darkColorScheme

2. Amber Blaze Theme

Here’s how you can access colors and color schemes for Amber theme:

// Access colors
val primaryColor = MaterialCanvas.amberBlazeTheme.lightColors.primary
val onPrimaryColor = MaterialCanvas.amberBlazeTheme.darkColors.onPrimary

// Access color schemes
val lightScheme = MaterialCanvas.amberBlazeTheme.lightColorScheme
val darkScheme = MaterialCanvas.amberBlazeTheme.darkColorScheme

3. Orange Blaze Theme

Here’s how you can access colors and color schemes for Orange theme:

// Access colors
val primaryColor = MaterialCanvas.orangeBlazeTheme.lightColors.primary
val onPrimaryColor = MaterialCanvas.orangeBlazeTheme.darkColors.onPrimary

// Access color schemes
val lightScheme = MaterialCanvas.orangeBlazeTheme.lightColorScheme
val darkScheme = MaterialCanvas.orangeBlazeTheme.darkColorScheme

4. Blue Blaze Theme

Here’s how you can access colors and color schemes for Blue theme:

// Access colors
val primaryColor = MaterialCanvas.blueBlazeTheme.lightColors.primary
val onPrimaryColor = MaterialCanvas.blueBlazeTheme.darkColors.onPrimary

// Access color schemes
val lightScheme = MaterialCanvas.blueBlazeTheme.lightColorScheme
val darkScheme = MaterialCanvas.blueBlazeTheme.darkColorScheme

5. Green Blaze Theme

Here’s how you can access colors and color schemes for Green theme:

// Access colors
val primaryColor = MaterialCanvas.greenBlazeTheme.lightColors.primary
val onPrimaryColor = MaterialCanvas.greenBlazeTheme.darkColors.onPrimary

// Access color schemes
val lightScheme = MaterialCanvas.greenBlazeTheme.lightColorScheme
val darkScheme = MaterialCanvas.greenBlazeTheme.darkColorScheme

6. Purple Blaze Theme

Here’s how you can access colors and color schemes for Purple theme:

// Access colors
val primaryColor = MaterialCanvas.purpleBlazeTheme.lightColors.primary
val onPrimaryColor = MaterialCanvas.purpleBlazeTheme.darkColors.onPrimary

// Access color schemes
val lightScheme = MaterialCanvas.purpleBlazeTheme.lightColorScheme
val darkScheme = MaterialCanvas.purpleBlazeTheme.darkColorScheme

7. Red Blaze Theme

Here’s how you can access colors and color schemes for Red theme:

// Access colors
val primaryColor = MaterialCanvas.redBlazeTheme.lightColors.primary
val onPrimaryColor = MaterialCanvas.redBlazeTheme.darkColors.onPrimary

// Access color schemes
val lightScheme = MaterialCanvas.redBlazeTheme.lightColorScheme
val darkScheme = MaterialCanvas.redBlazeTheme.darkColorScheme

8. Teal Blaze Theme

Here’s how you can access colors and color schemes for Teal theme:

// Access colors
val primaryColor = MaterialCanvas.tealBlazeTheme.lightColors.primary
val onPrimaryColor = MaterialCanvas.tealBlazeTheme.darkColors.onPrimary

// Access color schemes
val lightScheme = MaterialCanvas.tealBlazeTheme.lightColorScheme
val darkScheme = MaterialCanvas.tealBlazeTheme.darkColorScheme

⭓ Library Features

• Material Design Color Themes: Includes a range of themes inspired by Material Design principles.

• Predefined Themes: Ready to use themes such as Grayscale, Amber Blaze, Orange Blaze, Blue Blaze, Green Blaze, Purple Blaze, Red Blaze, and Teal Blaze

• Light and Dark Mode Support: All themes provide lightColors and darkColors for seamless transitions between modes.

• Easy Integration: Simple API for accessing color schemes and palettes.

• JitPack Compatibility: Easily add the library to your project using JitPack.

⭓ Requirements

• Minimum SDK Version: 24

---

ɪᴠ ⁃ ᴠɪꜱᴜᴀʟ ᴛᴏᴜʀ ᴏꜰ ᴛʜᴇ ʟɪʙʀᴀʀʏ ᴜꜱᴀɢᴇ

  ⮝   BACK TO TOP    

ᴠ ⁃ ᴘʀᴏᴊᴇᴄᴛ ʙʀᴀɴᴄʜᴇꜱ

PRODUCTION BRANCH :
Stable code for deployment
➲ main

STAGING BRANCH :
FLOW | Staging → Production
For pre-release testing, which ensures that the code is stable, bug-free, and ready for deployment.

DEVELOPMENT BRANCH :
FLOW | Development → Release → Staging → Production
Active codebase for ongoing development efforts (New features, bug fixes, and improvements..)
➲ development

FEATURE BRANCHES : N/A
FLOW | Feature → Development → Release → Staging → Production

RELEASE BRANCHES : N/A
FLOW | Release → Staging → Production

HOTFIX BRANCHES : N/A
FLOW | Hotfix → Staging → Production

BUGFIX BRANCHES : N/A
FLOW | Bugfix → Development → Release → Staging → Production

ᴠɪ ⁃ ʙᴇʜɪɴᴅ ᴛʜᴇ ᴄᴏᴅᴇ: ᴅᴇᴠ ꜰᴇᴀᴛᴜʀᴇꜱ

⭓ Project Documents

⭓ App Dependencies/Libraries Overview

⭓ Features

1. Project Resources  | 

ᴠɪɪ ⁃ ᴘʀᴏᴊᴇᴄᴛ ɴᴏᴛᴇꜱ