Creepso/NuvioStreaming
1
0
Fork 0
mirror of https://github.com/tapframe/NuvioStreaming.git synced 2026-04-26 19:12:54 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Add immersive mode support to AndroidVideoPlayer component

Browse source 
(cherry picked from commit b6eaf25e8905bdf66d4396a78bf6485a46f3162a)
This commit is contained in:
Aayush Rautela 2025-11-16 21:30:33 +01:00
parent 1a1fdb6fdf
commit a4725c24bc
2 changed files with 23 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

23
components/AndroidVideoPlayer.tsx
View file

@ -1,6 +1,7 @@
import React, { useEffect, useRef, useState, useCallback } from 'react'; import React, { useEffect, useRef, useState, useCallback } from 'react';
import { Platform, Animated, TouchableWithoutFeedback, View } from 'react-native'; import { Platform, Animated, TouchableWithoutFeedback, View } from 'react-native';
import Video, { VideoRef, SelectedTrack, BufferingStrategyType, ResizeMode } from 'react-native-video'; import Video, { VideoRef, SelectedTrack, BufferingStrategyType, ResizeMode } from 'react-native-video';
import RNImmersiveMode from 'react-native-immersive-mode';
interface VideoPlayerProps { interface VideoPlayerProps {
src: string; src: string;
@ -40,6 +41,28 @@ export const AndroidVideoPlayer: React.FC<VideoPlayerProps> = ({
const [isSeeking, setIsSeeking] = useState(false); const [isSeeking, setIsSeeking] = useState(false);
const [lastSeekTime, setLastSeekTime] = useState<number>(0); const [lastSeekTime, setLastSeekTime] = useState<number>(0);
// Enable immersive mode when video player mounts, disable when it unmounts
useEffect(() => {
if (Platform.OS === 'android') {
try {
RNImmersiveMode.setBarMode('Bottom');
RNImmersiveMode.fullLayout(true);
} catch (error) {
console.log('Immersive mode error:', error);
}
return () => {
// Restore navigation bar when video player unmounts
try {
RNImmersiveMode.setBarMode('Normal');
RNImmersiveMode.fullLayout(false);
} catch (error) {
console.log('Immersive mode cleanup error:', error);
}
};
}
}, []);
// Only render on Android // Only render on Android
if (Platform.OS !== 'android') { if (Platform.OS !== 'android') {
return null; return null;

9
src/navigation/AppNavigator.tsx
View file

@ -3,7 +3,6 @@ import { NavigationContainer, DefaultTheme as NavigationDefaultTheme, DarkTheme
import { createNativeStackNavigator, NativeStackNavigationOptions, NativeStackNavigationProp } from '@react-navigation/native-stack'; import { createNativeStackNavigator, NativeStackNavigationOptions, NativeStackNavigationProp } from '@react-navigation/native-stack';
import { createBottomTabNavigator, BottomTabNavigationProp } from '@react-navigation/bottom-tabs'; import { createBottomTabNavigator, BottomTabNavigationProp } from '@react-navigation/bottom-tabs';
import { useColorScheme, Platform, Animated, StatusBar, TouchableOpacity, View, Text, AppState, Easing, Dimensions } from 'react-native'; import { useColorScheme, Platform, Animated, StatusBar, TouchableOpacity, View, Text, AppState, Easing, Dimensions } from 'react-native';
import RNImmersiveMode from 'react-native-immersive-mode';
import { mmkvStorage } from '../services/mmkvStorage'; import { mmkvStorage } from '../services/mmkvStorage';
import { PaperProvider, MD3DarkTheme, MD3LightTheme, adaptNavigationTheme } from 'react-native-paper'; import { PaperProvider, MD3DarkTheme, MD3LightTheme, adaptNavigationTheme } from 'react-native-paper';
import type { MD3Theme } from 'react-native-paper'; import type { MD3Theme } from 'react-native-paper';
@ -1063,14 +1062,6 @@ const InnerNavigator = ({ initialRouteName }: { initialRouteName?: keyof RootSta
// Handle Android-specific optimizations // Handle Android-specific optimizations
useEffect(() => { useEffect(() => {
if (Platform.OS === 'android') { if (Platform.OS === 'android') {
// Hide system navigation bar
try {
RNImmersiveMode.setBarMode('Bottom');
RNImmersiveMode.fullLayout(true);
} catch (error) {
console.log('Immersive mode error:', error);
}
// Ensure consistent background color for Android // Ensure consistent background color for Android
StatusBar.setBackgroundColor('transparent', true); StatusBar.setBackgroundColor('transparent', true);
StatusBar.setTranslucent(true); StatusBar.setTranslucent(true);