OpenGL ShaderKit

A powerful Android library combining OpenGL ES, AGSL (Android Graphics Shading Language), and ARCore to create stunning visual effects and augmented reality experiences in Jetpack Compose.

See It In Action

AR Experiences

<div align="center"> <table> <tr> <td width="50%" align="center"> <h4>AR Model Viewer & GPU Showcase</h4> <img src=".github/media/sample_ar.gif" width="100%" alt="AR Model Viewer with fluid simulations"/> <p><em>Place 3D models on real surfaces with fluid simulations and plane detection</em></p> </td> <td width="50%" align="center"> <h4>Depth Parallax Effect</h4> <img src=".github/media/paralax.gif" width="100%" alt="Depth Parallax Effect"/> <p><em>Stunning depth-based parallax scrolling with shader effects</em></p> </td> </tr> </table> </div>

Interactive Shader Components

<div align="center"> <table> <tr> <td width="33%" align="center"> <h4>Photo Magnifier</h4> <img src=".github/media/magnifier.gif" width="100%" alt="Photo Magnifier"/> <p><em>Real-time magnification with GPU-powered distortion</em></p> </td> <td width="33%" align="center"> <h4>Liquid Glass Effect</h4> <img src=".github/media/liquidglass.gif" width="100%" alt="Liquid Glass Effect"/> <p><em>Fluid morphing animations with glassmorphism</em></p> </td> <td width="33%" align="center"> <h4>3D Object Widget</h4> <img src=".github/media/obj3d.png" width="100%" alt="3D Object Widget"/> <p><em>Interactive 3D models in Compose with touch controls</em></p> </td> </tr> <tr> <td colspan="3" align="center"> <h4>Shader Progress Indicator</h4> <img src=".github/media/progressindicator.gif" width="33%" alt="Shader Progress Indicator"/> <p><em>Custom progress animations with AGSL shaders</em></p> </td> </tr> </table> </div>

Features

AGSL Shader System

• Fragment shader support for Compose UI
• Built-in effects: Force Field, Heatmap, Progress animations
• Real-time uniform controls
• Touch-interactive shaders

OpenGL ES Engine

• Modern EGL context management
• Self-contained scene rendering
• 3D graphics: cubes, particles, fluid simulations
• Post-processing effects
• Audio-reactive visualizations

ARCore Integration

• AR Model Viewer: Place & manipulate 3D primitives on real surfaces
• AR GPU Showcase: Fluid simulations on detected planes
• AR Portal View: Windows to dynamic 3D scenes
• AR Measurement: Real-world distance tracking with GPU lines
• AR Post-FX Camera: Live camera feed with AGSL effects
• Plane detection and anchor management
• Graceful degradation for unsupported devices

Composable Components

• ShaderButton, ShaderCard, ShaderBottomSheet
• ParticleButton, ForceFieldMap, AudioReactiveBackground
• Object3DWidget, WaterRippleDivider, PhotoMagnifier
• All integrate seamlessly with Jetpack Compose

Installation

Step 1: Add JitPack repository

Add JitPack to your root build.gradle.kts or settings.gradle.kts:

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

Or in older projects using build.gradle.kts:

// build.gradle.kts (project level)
allprojects {
    repositories {
        google()
        mavenCentral()
        maven { url = uri("https://jitpack.io") }
    }
}

Step 2: Add the dependency

// app/build.gradle.kts
dependencies {
    implementation("com.github.ayush016:OpenGLShaderKit:1.0.0")
}

Step 3: (Optional) Add ARCore support

If you want to use AR features, add this to your AndroidManifest.xml:

<uses-permission android:name="android.permission.CAMERA" />
<uses-feature android:name="android.hardware.camera.ar" android:required="false" />

<application>
    <meta-data
        android:name="com.google.ar.core"
        android:value="optional" />
</application>

Quick Start

AGSL Shader Example

import com.shaderkit.agsl.ShaderLayer
import com.shaderkit.agsl.effects.ForceFieldEffect

@Composable
fun ShaderDemo() {
    var time by remember { mutableFloatStateOf(0f) }
    
    LaunchedEffect(Unit) {
        while (true) {
            withFrameMillis { time = it / 1000f }
        }
    }
    
    ShaderLayer(
        shaderEffectSpec = ForceFieldEffect,
        uniforms = mapOf(
            "iTime" to time,
            "strength" to 2.5f
        ),
        modifier = Modifier.fillMaxSize()
    )
}

OpenGL Scene Example

import com.shaderkit.opengl.GlViewport
import com.shaderkit.opengl.scenes.GlRotatingCubeScene

@Composable
fun OpenGLDemo() {
    val scene = remember { GlRotatingCubeScene() }
    
    GlViewport(
        scene = scene,
        modifier = Modifier.size(400.dp)
    )
}

AR Model Viewer Example

import com.shaderkit.ar.components.ArModelViewer
import com.shaderkit.ar.ModelPrimitive

@Composable
fun ARDemo() {
    ArModelViewer(
        primitive = ModelPrimitive.Cube,
        enableAgslEffects = true,
        modifier = Modifier.fillMaxSize()
    )
}

Documentation

• Library Documentation - Complete API reference
• AR Integration Guide - ARCore implementation details
• Demo App - Explore the demo module for 20+ working examples

Demo App Features

The included demo app showcases:

1. AGSL Gallery - Fragment shader effects library
2. OpenGL Scenes - 3D rendering demos
3. Interactive Components - Touch-responsive effects
4. Hybrid Demos - AGSL + OpenGL combinations
5. AR Lab - 5 ARCore experiences with real-time controls

Requirements

• Minimum SDK: 26 (Android 8.0)
• Compile SDK: 35 (Android 15)
• Kotlin: 2.1.0+
• Jetpack Compose: BOM 2024.12.01
• ARCore: 1.45.0 (optional, for AR features)

Architecture

┌─────────────────────────────────────┐
│     Jetpack Compose UI Layer        │
├─────────────────────────────────────┤
│  AGSL Shaders  │  OpenGL Scenes     │
│  (Screen FX)   │  (3D Graphics)     │
├─────────────────────────────────────┤
│         ARCore Integration          │
│  (World Tracking & Plane Detection) │
├─────────────────────────────────────┤
│      OpenGL ES 3.0 + EGL           │
└─────────────────────────────────────┘

Layer Responsibilities:

• AGSL: Screen-space post-processing and UI effects
• OpenGL ES: 3D rendering, simulations, and compute-like tasks
• ARCore: World tracking, camera feed, and spatial anchors
• Compose: UI overlays, controls, and reactive state

Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

License

Copyright 2025 Ayush Shrivastava

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.

Acknowledgments

• Built with Jetpack Compose
• ARCore by Google
• Published via JitPack

Contact

• GitHub: @ayush016
• Email: ayush.shrivastava016@gmail.com

---

Made with ❤️ for the Android community