chore(example): update MultiValueControl
types (#4003)
This commit is contained in:
parent
39cf477ceb
commit
38bcfa2f6a
@ -1,5 +1,4 @@
|
||||
import React, {FunctionComponent} from 'react';
|
||||
|
||||
import React from 'react';
|
||||
import {
|
||||
StyleSheet,
|
||||
Text,
|
||||
@ -9,8 +8,6 @@ import {
|
||||
} from 'react-native';
|
||||
import {ResizeMode} from 'react-native-video';
|
||||
|
||||
export type MultiValueControlPropType = number | string | ResizeMode;
|
||||
|
||||
/*
|
||||
* MultiValueControl displays a list clickable text view
|
||||
*/
|
||||
@ -21,12 +18,14 @@ interface MultiValueControlType<T> {
|
||||
// The selected value in values
|
||||
selected?: T;
|
||||
// callback to press onPress
|
||||
onPress: (arg: MultiValueControlPropType) => void;
|
||||
onPress: (arg: T) => void;
|
||||
}
|
||||
|
||||
const MultiValueControl: FunctionComponent<
|
||||
MultiValueControlType<MultiValueControlPropType>
|
||||
> = ({values, selected, onPress}) => {
|
||||
const MultiValueControl = <T extends number | string | ResizeMode>({
|
||||
values,
|
||||
selected,
|
||||
onPress,
|
||||
}: MultiValueControlType<T>) => {
|
||||
const selectedStyle: TextStyle = StyleSheet.flatten([
|
||||
styles.option,
|
||||
{fontWeight: 'bold'},
|
||||
@ -39,7 +38,7 @@ const MultiValueControl: FunctionComponent<
|
||||
|
||||
return (
|
||||
<View style={styles.container}>
|
||||
{values.map((value: MultiValueControlPropType) => {
|
||||
{values.map(value => {
|
||||
const _style = value === selected ? selectedStyle : unselectedStyle;
|
||||
return (
|
||||
<TouchableOpacity
|
||||
|
@ -9,9 +9,7 @@ import {
|
||||
samplePoster,
|
||||
textTracksSelectionBy,
|
||||
} from '../constants';
|
||||
import MultiValueControl, {
|
||||
MultiValueControlPropType,
|
||||
} from '../MultiValueControl.tsx';
|
||||
import MultiValueControl from '../MultiValueControl.tsx';
|
||||
import {
|
||||
AudioTrack,
|
||||
EnumValues,
|
||||
@ -204,22 +202,16 @@ const _Overlay = forwardRef<VideoRef, Props>((props, ref) => {
|
||||
ref.current?.seek(position);
|
||||
};
|
||||
|
||||
const onRateSelected = (value: MultiValueControlPropType) => {
|
||||
if (typeof value === 'number') {
|
||||
setRate(value);
|
||||
}
|
||||
const onRateSelected = (value: number) => {
|
||||
setRate(value);
|
||||
};
|
||||
|
||||
const onVolumeSelected = (value: MultiValueControlPropType) => {
|
||||
if (typeof value === 'number') {
|
||||
setVolume(value);
|
||||
}
|
||||
const onVolumeSelected = (value: number) => {
|
||||
setVolume(value);
|
||||
};
|
||||
|
||||
const onResizeModeSelected = (value: MultiValueControlPropType) => {
|
||||
if (typeof value === 'string') {
|
||||
setResizeMode(value as EnumValues<ResizeMode>);
|
||||
}
|
||||
const onResizeModeSelected = (value: EnumValues<ResizeMode>) => {
|
||||
setResizeMode(value);
|
||||
};
|
||||
|
||||
const toggleCache = () => setUseCache(!useCache);
|
||||
|
Loading…
Reference in New Issue
Block a user