composer require s2br/nativephp-mobile-splashscreen

php artisan vendor:publish --tag=mobile-splashscreen-config

# Publish the NativeServiceProvider if you haven't already
php artisan vendor:publish --tag=nativephp-plugins-provider
 
# Register this plugin (pass the Composer package name)
php artisan native:plugin:register s2br/nativephp-mobile-splashscreen

php artisan native:plugin:list

MOBILE_SPLASHSCREEN_ANIMATION_PATH="resources/animations/splash.lottie"
MOBILE_SPLASHSCREEN_BG_TYPE=gradient
MOBILE_SPLASHSCREEN_GRADIENT_COLORS="#079F3D,#046B28"
MOBILE_SPLASHSCREEN_SIZE=0.8
MOBILE_SPLASHSCREEN_LOOP=false

MOBILE_SPLASHSCREEN_ENABLED=false

php artisan vendor:publish --tag=mobile-splashscreen-examples

MOBILE_SPLASHSCREEN_ANIMATION_PATH="resources/animations/animation4.lottie"

MOBILE_SPLASHSCREEN_CONTENT=animation   # animation | text

MOBILE_SPLASHSCREEN_LAUNCH_COLOR="#18181B"

MOBILE_SPLASHSCREEN_LOOP=false
MOBILE_SPLASHSCREEN_PROGRESS_BAR=false
MOBILE_SPLASHSCREEN_PROGRESS_BAR_COLOR="#FFFFFF"
MOBILE_SPLASHSCREEN_PROGRESS_BAR_DIRECTION=ltr

MOBILE_SPLASHSCREEN_LOOP=false
MOBILE_SPLASHSCREEN_TRANSITION_OUT=circle_expand
MOBILE_SPLASHSCREEN_TRANSITION_DURATION=500
MOBILE_SPLASHSCREEN_TRANSITION_ORIGIN=center

MOBILE_SPLASHSCREEN_LOOP=true
MOBILE_SPLASHSCREEN_TRANSITION_OUT=circle_expand
MOBILE_SPLASHSCREEN_TRANSITION_DURATION=600
MOBILE_SPLASHSCREEN_TRANSITION_ORIGIN=center_left

MOBILE_SPLASHSCREEN_THEME=auto
MOBILE_SPLASHSCREEN_DARK_BG_TYPE=gradient
MOBILE_SPLASHSCREEN_DARK_GRADIENT_COLORS="#0D0D0D,#1A1A1A"
MOBILE_SPLASHSCREEN_DARK_ANIMATION_PATH="resources/animations/splash_dark.lottie"

MOBILE_SPLASHSCREEN_SCHEDULE="resources/splash-schedule.json"

{
  "schedule": [
    {
      "name": "christmas",
      "from": "12-24",
      "to": "12-26",
      "animation": "resources/animations/christmas.lottie",
      "background": {
        "type": "gradient",
        "colors": ["#1B4F72", "#154360"],
        "direction": "vertical"
      }
    },
    {
      "name": "new_year",
      "from": "12-31",
      "to": "01-02",
      "animation": "resources/animations/fireworks.lottie"
    },
    {
      "name": "christmas_2026_special",
      "from": "2026-12-24",
      "to": "2026-12-26",
      "animation": "resources/animations/christmas_anniversary.lottie"
    }
  ]
}

{
  "schedule": [
    {
      "name": "christmas",
      "date": { "from": "2026-12-24", "to": "2026-12-26" },
      "url": "https://your-cdn.com/animations/christmas.lottie",
      "background": {
        "type": "gradient",
        "colors": ["#1B4F72", "#154360"]
      }
    },
    {
      "name": "new_year",
      "date": { "from": "2026-12-31", "to": "2027-01-02" },
      "url": "https://your-cdn.com/animations/new_year.lottie",
      "background": {
        "type": "color",
        "color": "#0D0D0D"
      }
    }
  ]
}

{
  "schedule": [
    {
      "name": "christmas",
      "date": { "from": "2026-12-24", "to": "2026-12-26" },
      "url": "https://your-cdn.com/animations/christmas.lottie",
      "background": {
        "type": "gradient",
        "colors": ["#1B4F72", "#154360"]
      },
      "loop": true,
      "size": 0.9,
      "position": "center",
      "transition_out": "circle_expand",
      "transition_duration": 600,
      "transition_origin": "center",
      "delay_before": 0,
      "fade_in": 800,
      "delay_after": 0,
      "on_complete": false,
      "on_loop": true,
      "show_icon": true,
      "icon_size": 0.15,
      "icon_position": "bottom",
      "icon_radius": 0.22,
      "progress_bar": true,
      "progress_bar_color": "#FFFFFF",
      "progress_bar_direction": "ltr"
    }
  ]
}

# Fetch schedule + pre-download animations active within the next 30 days (default)
php artisan nativephp:mobile-splashscreen:sync --url=https://your-cdn.com/animations.json
 
# Extend the lookahead window (e.g. 60 days, useful before a long offline period)
php artisan nativephp:mobile-splashscreen:sync --url=https://your-cdn.com/animations.json --days=60
 
# Re-resolve from an already-downloaded animations.json (no re-fetch)
php artisan nativephp:mobile-splashscreen:sync

// routes/console.php
Schedule::command('nativephp:mobile-splashscreen:sync --url=https://your-cdn.com/animations.json')
    ->daily();

use S2BR\MobileSplashscreen\Facades\MobileSplashscreen;
 
MobileSplashscreen::syncFromUrl('https://your-cdn.com/animations.json')
                 ->resolveActive(daysAhead: 30);

MobileSplashscreen::hasActive();   // true if schedule-local.json exists
MobileSplashscreen::clearActive(); // remove schedule-local.json (reverts to default)

use Livewire\Attributes\On;
use S2BR\MobileSplashscreen\Events\SplashscreenCompleted;
use S2BR\MobileSplashscreen\Events\SplashscreenLoopCompleted;
 
#[On('native:'.SplashscreenCompleted::class)]
public function onSplashDone(string $animationName, float $duration): void
{
    // Dispatched after the splash exits (including any transition_out animation)
}
 
#[On('native:'.SplashscreenLoopCompleted::class)]
public function onSplashLoop(int $iteration, string $animationName): void
{
    if ($iteration >= 3) {
        // After 3 loops, do something in your app
    }
}

import { useEffect } from 'react';
import { SplashscreenCompleted } from '@/nativephp/events';
 
useEffect(() => {
    const handler = (event) => {
        const { animationName, duration } = event.detail;
        console.log('Splash done', animationName);
    };
 
    window.addEventListener('native:S2BR\\MobileSplashscreen\\Events\\SplashscreenCompleted', handler);
 
    return () => {
        window.removeEventListener('native:S2BR\\MobileSplashscreen\\Events\\SplashscreenCompleted', handler);
    };
}, []);

import { onMounted, onUnmounted } from 'vue';
 
function onSplashDone(event) {
    const { animationName } = event.detail;
    console.log('Splash done', animationName);
}
 
onMounted(() => {
    window.addEventListener('native:S2BR\\MobileSplashscreen\\Events\\SplashscreenCompleted', onSplashDone);
});
 
onUnmounted(() => {
    window.removeEventListener('native:S2BR\\MobileSplashscreen\\Events\\SplashscreenCompleted', onSplashDone);
});

MOBILE_SPLASHSCREEN_ANIMATION_PATH="resources/animations/splash.lottie"
MOBILE_SPLASHSCREEN_BG_TYPE=gradient
MOBILE_SPLASHSCREEN_GRADIENT_COLORS="#079F3D,#046B28"
MOBILE_SPLASHSCREEN_SIZE=0.8

MOBILE_SPLASHSCREEN_ANIMATION_PATH="resources/animations/intro.lottie"
MOBILE_SPLASHSCREEN_LOOP=false
MOBILE_SPLASHSCREEN_PROGRESS_BAR=true
MOBILE_SPLASHSCREEN_PROGRESS_BAR_COLOR="#FFFFFF"
MOBILE_SPLASHSCREEN_TRANSITION_OUT=circle_expand
MOBILE_SPLASHSCREEN_TRANSITION_ORIGIN=center_left

MOBILE_SPLASHSCREEN_ANIMATION_PATH="resources/animations/intro.lottie"
MOBILE_SPLASHSCREEN_LOOP=false
MOBILE_SPLASHSCREEN_TRANSITION_OUT=fade
MOBILE_SPLASHSCREEN_TRANSITION_DURATION=400
MOBILE_SPLASHSCREEN_EVENT_COMPLETE=true

MOBILE_SPLASHSCREEN_ANIMATION_PATH="resources/animations/splash.lottie"
MOBILE_SPLASHSCREEN_LOOP=true
MOBILE_SPLASHSCREEN_TRANSITION_OUT=circle_expand
MOBILE_SPLASHSCREEN_TRANSITION_DURATION=500
MOBILE_SPLASHSCREEN_TRANSITION_ORIGIN=center

MOBILE_SPLASHSCREEN_THEME=auto
MOBILE_SPLASHSCREEN_BG_TYPE=gradient
MOBILE_SPLASHSCREEN_GRADIENT_COLORS="#079F3D,#046B28"
MOBILE_SPLASHSCREEN_DARK_BG_TYPE=gradient
MOBILE_SPLASHSCREEN_DARK_GRADIENT_COLORS="#0D0D0D,#1A1A1A"

MOBILE_SPLASHSCREEN_SCHEDULE="resources/splash-schedule.json"

MOBILE_SPLASHSCREEN_CONTENT=text
MOBILE_SPLASHSCREEN_TEXT="Loading..."
MOBILE_SPLASHSCREEN_TEXT_COLOR="#FFFFFF"
MOBILE_SPLASHSCREEN_TEXT_WEIGHT=light
MOBILE_SPLASHSCREEN_BG_COLOR="#1A1A2E"

MOBILE_SPLASHSCREEN_ANIMATION_PATH="resources/animations/splash.lottie"
MOBILE_SPLASHSCREEN_BG_TYPE=gradient
MOBILE_SPLASHSCREEN_GRADIENT_COLORS="#079F3D,#046B28"
MOBILE_SPLASHSCREEN_SHOW_ICON=true
MOBILE_SPLASHSCREEN_ICON_POSITION=bottom
MOBILE_SPLASHSCREEN_ICON_RADIUS=0.22

unzip -l your-animation.lottie
# v1: shows animations/main.json
# v2: shows a/Main Scene.json

use S2BR\MobileSplashscreen\Facades\MobileSplashscreen;
 
$size = MobileSplashscreen::config('animation.size');
$bgType = MobileSplashscreen::config('background.type');
 
$errors = MobileSplashscreen::validate();

Detected dotLottie v2 — converting to v1 for lottie-spm...

# Correct
MOBILE_SPLASHSCREEN_GRADIENT_COLORS="#079F3D,#046B28"
 
# Wrong
MOBILE_SPLASHSCREEN_GRADIENT_COLORS="#079F3D, #046B28"

php artisan native:plugin:register s2br/nativephp-mobile-splashscreen

public function plugins(): array
{
    return [
        \S2BR\MobileSplashscreen\MobileSplashscreenServiceProvider::class,
    ];
}