update aspect ratio indicator ios

This commit is contained in:
tapframe 2026-01-21 17:51:17 +05:30
parent 154d568aa3
commit a042cf5ca6
3 changed files with 38 additions and 1 deletions

View file

@ -802,6 +802,7 @@ const KSPlayerCore: React.FC = () => {
volume={volume}
brightness={brightness}
controlsTimeout={controlsTimeout}
resizeMode={resizeMode}
/>
{/* UI Controls */}
@ -829,7 +830,21 @@ const KSPlayerCore: React.FC = () => {
togglePlayback={controls.togglePlayback}
skip={controls.skip}
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)}
currentPlaybackSpeed={speedControl.playbackSpeed}
setShowAudioModal={modals.setShowAudioModal}

View file

@ -10,6 +10,7 @@ export interface MpvPlayerRef {
seek: (positionSeconds: number) => void;
setAudioTrack: (trackId: number) => void;
setSubtitleTrack: (trackId: number) => void;
setResizeMode: (mode: 'contain' | 'cover' | 'stretch') => void;
}
export interface MpvPlayerProps {
@ -65,6 +66,9 @@ const MpvPlayer = forwardRef<MpvPlayerRef, MpvPlayerProps>((props, ref) => {
setSubtitleTrack: (trackId: number) => {
dispatchCommand('setSubtitleTrack', [trackId]);
},
setResizeMode: (mode: 'contain' | 'cover' | 'stretch') => {
dispatchCommand('setResizeMode', [mode]);
},
}), [dispatchCommand]);
if (Platform.OS !== 'android' || !MpvPlayerNative) {

View file

@ -183,6 +183,12 @@ export const VideoSurface: React.FC<VideoSurfaceProps> = ({
console.log('[VideoSurface] Headers:', 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 }) => {
console.log('[VideoSurface] MPV onLoad received:', data);
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 a = Math.max(0, Math.min(1, opacity01));
return Math.round(a * 255).toString(16).padStart(2, '0').toUpperCase();