mirror of
https://github.com/tapframe/NuvioStreaming.git
synced 2026-04-20 16:22:04 +00:00
update aspect ratio indicator ios
This commit is contained in:
parent
154d568aa3
commit
a042cf5ca6
3 changed files with 38 additions and 1 deletions
|
|
@ -802,6 +802,7 @@ const KSPlayerCore: React.FC = () => {
|
||||||
volume={volume}
|
volume={volume}
|
||||||
brightness={brightness}
|
brightness={brightness}
|
||||||
controlsTimeout={controlsTimeout}
|
controlsTimeout={controlsTimeout}
|
||||||
|
resizeMode={resizeMode}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
{/* UI Controls */}
|
{/* UI Controls */}
|
||||||
|
|
@ -829,7 +830,21 @@ const KSPlayerCore: React.FC = () => {
|
||||||
togglePlayback={controls.togglePlayback}
|
togglePlayback={controls.togglePlayback}
|
||||||
skip={controls.skip}
|
skip={controls.skip}
|
||||||
handleClose={handleClose}
|
handleClose={handleClose}
|
||||||
cycleAspectRatio={() => setResizeMode(prev => prev === 'cover' ? 'contain' : 'cover')}
|
cycleAspectRatio={() => {
|
||||||
|
gestureControls.showResizeModeOverlayFn(() => {
|
||||||
|
setResizeMode(prev => {
|
||||||
|
switch (prev) {
|
||||||
|
case 'contain':
|
||||||
|
return 'cover';
|
||||||
|
case 'cover':
|
||||||
|
return 'stretch';
|
||||||
|
case 'stretch':
|
||||||
|
default:
|
||||||
|
return 'contain';
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}}
|
||||||
cyclePlaybackSpeed={() => speedControl.setPlaybackSpeed(speedControl.playbackSpeed >= 2 ? 1 : speedControl.playbackSpeed + 0.25)}
|
cyclePlaybackSpeed={() => speedControl.setPlaybackSpeed(speedControl.playbackSpeed >= 2 ? 1 : speedControl.playbackSpeed + 0.25)}
|
||||||
currentPlaybackSpeed={speedControl.playbackSpeed}
|
currentPlaybackSpeed={speedControl.playbackSpeed}
|
||||||
setShowAudioModal={modals.setShowAudioModal}
|
setShowAudioModal={modals.setShowAudioModal}
|
||||||
|
|
|
||||||
|
|
@ -10,6 +10,7 @@ export interface MpvPlayerRef {
|
||||||
seek: (positionSeconds: number) => void;
|
seek: (positionSeconds: number) => void;
|
||||||
setAudioTrack: (trackId: number) => void;
|
setAudioTrack: (trackId: number) => void;
|
||||||
setSubtitleTrack: (trackId: number) => void;
|
setSubtitleTrack: (trackId: number) => void;
|
||||||
|
setResizeMode: (mode: 'contain' | 'cover' | 'stretch') => void;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface MpvPlayerProps {
|
export interface MpvPlayerProps {
|
||||||
|
|
@ -65,6 +66,9 @@ const MpvPlayer = forwardRef<MpvPlayerRef, MpvPlayerProps>((props, ref) => {
|
||||||
setSubtitleTrack: (trackId: number) => {
|
setSubtitleTrack: (trackId: number) => {
|
||||||
dispatchCommand('setSubtitleTrack', [trackId]);
|
dispatchCommand('setSubtitleTrack', [trackId]);
|
||||||
},
|
},
|
||||||
|
setResizeMode: (mode: 'contain' | 'cover' | 'stretch') => {
|
||||||
|
dispatchCommand('setResizeMode', [mode]);
|
||||||
|
},
|
||||||
}), [dispatchCommand]);
|
}), [dispatchCommand]);
|
||||||
|
|
||||||
if (Platform.OS !== 'android' || !MpvPlayerNative) {
|
if (Platform.OS !== 'android' || !MpvPlayerNative) {
|
||||||
|
|
|
||||||
|
|
@ -183,6 +183,12 @@ export const VideoSurface: React.FC<VideoSurfaceProps> = ({
|
||||||
console.log('[VideoSurface] Headers:', exoRequestHeaders);
|
console.log('[VideoSurface] Headers:', exoRequestHeaders);
|
||||||
}, [streamUrl, useExoPlayer, exoRequestHeaders]);
|
}, [streamUrl, useExoPlayer, exoRequestHeaders]);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (mpvPlayerRef?.current && !useExoPlayer) {
|
||||||
|
mpvPlayerRef.current.setResizeMode(getMpvResizeMode());
|
||||||
|
}
|
||||||
|
}, [resizeMode, useExoPlayer, mpvPlayerRef]);
|
||||||
|
|
||||||
const handleMpvLoad = (data: { duration: number; width: number; height: number }) => {
|
const handleMpvLoad = (data: { duration: number; width: number; height: number }) => {
|
||||||
console.log('[VideoSurface] MPV onLoad received:', data);
|
console.log('[VideoSurface] MPV onLoad received:', data);
|
||||||
onLoad({
|
onLoad({
|
||||||
|
|
@ -300,6 +306,18 @@ export const VideoSurface: React.FC<VideoSurfaceProps> = ({
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const getMpvResizeMode = (): 'contain' | 'cover' | 'stretch' => {
|
||||||
|
switch (resizeMode) {
|
||||||
|
case 'cover':
|
||||||
|
return 'cover';
|
||||||
|
case 'stretch':
|
||||||
|
return 'stretch';
|
||||||
|
case 'contain':
|
||||||
|
default:
|
||||||
|
return 'contain';
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
const alphaHex = (opacity01: number) => {
|
const alphaHex = (opacity01: number) => {
|
||||||
const a = Math.max(0, Math.min(1, opacity01));
|
const a = Math.max(0, Math.min(1, opacity01));
|
||||||
return Math.round(a * 255).toString(16).padStart(2, '0').toUpperCase();
|
return Math.round(a * 255).toString(16).padStart(2, '0').toUpperCase();
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue