63 lines
1.7 KiB
TypeScript
63 lines
1.7 KiB
TypeScript
import {Picker} from '@react-native-picker/picker';
|
|
import {Text} from 'react-native';
|
|
import {
|
|
SelectedVideoTrackType,
|
|
type SelectedVideoTrack,
|
|
type VideoTrack,
|
|
} from 'react-native-video';
|
|
import styles from '../styles';
|
|
import React from 'react';
|
|
|
|
export interface VideoTrackSelectorType {
|
|
videoTracks: Array<VideoTrack>;
|
|
selectedVideoTrack: SelectedVideoTrack | undefined;
|
|
onValueChange: (arg0: string) => void;
|
|
}
|
|
|
|
export const VideoTrackSelector = ({
|
|
videoTracks,
|
|
selectedVideoTrack,
|
|
onValueChange,
|
|
}: VideoTrackSelectorType) => {
|
|
return (
|
|
<>
|
|
<Text style={styles.controlOption}>VideoTrack</Text>
|
|
<Picker
|
|
style={styles.picker}
|
|
itemStyle={styles.pickerItem}
|
|
selectedValue={
|
|
selectedVideoTrack === undefined ||
|
|
selectedVideoTrack?.type === SelectedVideoTrackType.AUTO
|
|
? 'auto'
|
|
: `${selectedVideoTrack?.value}`
|
|
}
|
|
onValueChange={itemValue => {
|
|
if (itemValue !== 'empty') {
|
|
onValueChange(itemValue);
|
|
}
|
|
}}>
|
|
<Picker.Item label={'auto'} value={'auto'} key={'auto'} />
|
|
{videoTracks?.length <= 0 || videoTracks?.length <= 0 ? (
|
|
<Picker.Item label={'empty'} value={'empty'} key={'empty'} />
|
|
) : (
|
|
<Picker.Item label={'none'} value={'none'} key={'none'} />
|
|
)}
|
|
{videoTracks?.map(track => {
|
|
if (!track) {
|
|
return;
|
|
}
|
|
return (
|
|
<Picker.Item
|
|
label={`${track.width}x${track.height} ${Math.floor(
|
|
(track.bitrate || 0) / 8 / 1024,
|
|
)} Kbps`}
|
|
value={`${track.index}`}
|
|
key={track.index}
|
|
/>
|
|
);
|
|
})}
|
|
</Picker>
|
|
</>
|
|
);
|
|
};
|