Skip to content

oxyroid/touchbar

Repository files navigation

Compose TouchBar

TouchBar is a Video Clipper component made by Jetpack Compose.

(control the clipper handles and display video thumbnails only)

API

Installation

Add the JitPack repository to your build file, add it in your root build.gradle at the end of repositories:

allprojects {
    repositories {
        ...
        maven { url 'https://jitpack.io' }
    }
}    

Add the dependency

dependencies {
    implementation 'com.github.realOxy:touchbar:(insert latest version)'
}

Quick Start

var duration: Long by remember { mutableStateOf(-1L) }
val touchbarState = rememberTouchbarState(
    enabled = duration >= 0L
)
TouchBar(
    state = touchbarState,
    // enableZHandle = true,
    modifier = Modifier.fillMathWidth()
)
// MediaUtils is available in the project app module.
// It is an android platform utils.
LaunchEffect(uri) {
    // loadThumbs is a flow-returned method actually but not list.
    // if you wanna a correct way to use it, just see app module demo.
    val newBitmaps: List<Bitmap?> = MediaUtils.loadThumbs(uri)
    duration = if (uri == null) -1
    else MediaUtils.getDuration(context, uri)
    MediaUtils.recycleNullableUseless(bitmaps, newBitmaps)
    bitmaps = newBitmaps
    if (bitmaps.size == thumbCount) {
        touchbarState.background?.asAndroidBitmap()?.recycle()
        touchbarState.notifyBackground(
            MediaUtils.merge(bitmaps, Orientation.Horizontal)?.asImageBitmap()
        )
    }
}
// recycle all bitmaps
DisposableEffect(Unit) {
    onDispose {
        bitmaps.forEach {
            it?.recycle()
        }
    }
}

TouchBarState

  • enabled: Boolean handles is enabled.
  • x: Float left handle percentage(0f ~ 1f allowed).
  • y: Float right handle percentage(0f ~ 1f allowed).
  • z: Float mid handle percentage(0f ~ 1f allowed).
  • isXFocus: Boolean is left handle is pressing.
  • isYFocus: Boolean is right handle is pressing.
  • isZFocus: Boolean is mid handle is pressing.
  • notify() change x, y, z, isXFocus, isYFocus or isZFocus.
  • notifyBackground() change background bitmap.

Demo

Video Editor

2023-07-22.23.22.35.mov

Versions

  • Kotlin 1.9.0
  • Jetpack Compose 1.4.3
  • Jetpack Compose Material3 1.1.1
  • Compose Kotlin Compiler Extension 1.5.0