ScreenNameViewer-For-Compose

한국어 README

Overview

ScreenNameViewer is a debugging tool that overlays the class name of the currently displayed screen.
It allows you to intuitively check which screen is active, and in a Compose environment, it can also display the screen route.

This allows you to quickly find and navigate to the code for the desired screen, improving both debugging and development efficiency.

Features

• Real-time class name display: Shows Activity and Fragment class names on screen in real-time
• Automatic lifecycle management: Automatically tracks all Activities and Fragments at the Application level
• Debug-only: Automatically disabled in release builds for safety
• UI customization: Freely configure text size, color, position, etc.
• Memory safe: Prevents memory leaks using WeakReference
• Touch interaction: Touch overlay to show full class name in toast

Installation

Step 1: Add Jitpack repository

Add the Jitpack repository to your project's settings.gradle.kts:

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

Step 2: Add dependency

Add the library to your module's build.gradle.kts:

dependencies {
    implementation 'com.github.DongLab-DevTools:ScreenNameViewer-For-Compose:latestVersion'
}

Requirements

• Android API 21 (Android 5.0) or higher

Usage

Initialize in Application class

Set up once and all Activities and Fragments will be automatically tracked:

class MyApplication : Application() {

    override fun onCreate() {
        super.onCreate()

        initScreenNameViewer(this) {
            settings {
                debugModeCondition = BuildConfig.DEBUG
                enableCondition = PreferenceManager.getDefaultSharedPreferences(this@MyApplication)
                        .getBoolean("debug_overlay_enabled", true)
            }

            config {
                textStyle {
                    size = 12f
                    color = Color.WHITE
                }
                background {
                    color = Color.argb(128, 0, 0, 0)
                    padding = 16
                }
                position {
                    topMargin = 64
                    activity = Gravity.TOP or Gravity.START
                    fragment = Gravity.TOP or Gravity.END
                    composeRoute = Gravity.TOP or Gravity.END
                }
            }
        }
    }
}

Initialize in NavHost class (For Compose Integration)

    ScreenNameTracker(navController) {
        NavHost() { /*...*/ }
    }

Configuration

DSL Configuration

You can configure the library using a simple DSL (Domain Specific Language):

initScreenNameViewer(this) {
    settings {
        debugModeCondition = BuildConfig.DEBUG
        enableCondition = PreferenceManager
            .getDefaultSharedPreferences(this@MyApplication)
            .getBoolean("debug_overlay_enabled", true)
    }

    config {
        textStyle {
            size = 12f                    // Text size
            color = Color.WHITE           // Text color
        }
        background {
            color = Color.argb(128, 0, 0, 0)  // Background color
            padding = 16                      // Padding
        }
        position {
            topMargin = 64                                    // Top margin
            activity = Gravity.TOP or Gravity.START          // Activity display position
            fragment = Gravity.TOP or Gravity.END            // Fragment display position
            composeRoute = Gravity.TOP or Gravity.END        // Compose Route display position
        }
    }
}

Configuration Options

• settings: Configure activation conditions

  • debugModeCondition: Debug mode condition
  • enableCondition: Overlay feature activation condition

• config: Customize overlay appearance

  • textStyle: Text size and color
  • background: Background color and padding
  • position: Margin and display positions for different components

Contributors

Donghyeon Kim

JUNWON LEE