fixed loading on android

This commit is contained in:
balzack 2022-10-18 22:58:48 -07:00
parent 55957aeacb
commit de5325e83d
4 changed files with 17 additions and 11 deletions

View File

@ -310,7 +310,7 @@
ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon; ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
ASSETCATALOG_COMPILER_INCLUDE_ALL_APPICON_ASSETS = YES; ASSETCATALOG_COMPILER_INCLUDE_ALL_APPICON_ASSETS = YES;
CLANG_ENABLE_MODULES = YES; CLANG_ENABLE_MODULES = YES;
CURRENT_PROJECT_VERSION = 8; CURRENT_PROJECT_VERSION = 9;
DEVELOPMENT_TEAM = 3P65PQ7SUR; DEVELOPMENT_TEAM = 3P65PQ7SUR;
ENABLE_BITCODE = NO; ENABLE_BITCODE = NO;
GCC_PREPROCESSOR_DEFINITIONS = ( GCC_PREPROCESSOR_DEFINITIONS = (
@ -348,7 +348,7 @@
ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon; ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
ASSETCATALOG_COMPILER_INCLUDE_ALL_APPICON_ASSETS = YES; ASSETCATALOG_COMPILER_INCLUDE_ALL_APPICON_ASSETS = YES;
CLANG_ENABLE_MODULES = YES; CLANG_ENABLE_MODULES = YES;
CURRENT_PROJECT_VERSION = 8; CURRENT_PROJECT_VERSION = 9;
DEVELOPMENT_TEAM = 3P65PQ7SUR; DEVELOPMENT_TEAM = 3P65PQ7SUR;
INFOPLIST_FILE = Databag/Info.plist; INFOPLIST_FILE = Databag/Info.plist;
INFOPLIST_KEY_CFBundleDisplayName = Databag; INFOPLIST_KEY_CFBundleDisplayName = Databag;

View File

@ -11,15 +11,10 @@ export function VideoAsset({ topicId, asset, dismiss }) {
return ( return (
<View style={styles.container}> <View style={styles.container}>
{ !state.loaded && ( <TouchableOpacity activeOpacity={1} style={styles.container} onPress={actions.showControls}>
<TouchableOpacity onPress={dismiss}>
<ActivityIndicator color={Colors.white} size="large" />
</TouchableOpacity>
)}
<TouchableOpacity activeOpacity={1} style={{...styles.container, ...state.display}} onPress={actions.showControls}>
<Video source={{ uri: state.url }} style={{ width: state.width, height: state.height }} resizeMode={'cover'} <Video source={{ uri: state.url }} style={{ width: state.width, height: state.height }} resizeMode={'cover'}
onReadyForDisplay={(e) => actions.setResolution(e.naturalSize.width, e.naturalSize.height)} onReadyForDisplay={(e) => actions.setResolution(e.naturalSize.width, e.naturalSize.height)}
isLooping={true} shouldPlay={state.playing} resizeMode="contain" /> onLoad={actions.loaded} isLooping={true} shouldPlay={state.playing} resizeMode="contain" />
{ (!state.playing || state.controls) && ( { (!state.playing || state.controls) && (
<View style={{ ...styles.overlay, width: state.width, height: state.height }} /> <View style={{ ...styles.overlay, width: state.width, height: state.height }} />
)} )}
@ -33,12 +28,17 @@ export function VideoAsset({ topicId, asset, dismiss }) {
<Icons name="pause-circle-outline" size={92} color={Colors.white} /> <Icons name="pause-circle-outline" size={92} color={Colors.white} />
</TouchableOpacity> </TouchableOpacity>
)} )}
{ (state.controls || !state.playing) && ( { (state.controls || !state.playing) && state.loaded && (
<TouchableOpacity style={styles.close} onPress={dismiss}> <TouchableOpacity style={styles.close} onPress={dismiss}>
<Icons name="window-close" size={32} color={Colors.white} /> <Icons name="window-close" size={32} color={Colors.white} />
</TouchableOpacity> </TouchableOpacity>
)} )}
</TouchableOpacity> </TouchableOpacity>
{ !state.loaded && (
<TouchableOpacity style={styles.loading} onPress={dismiss}>
<ActivityIndicator color={Colors.white} size="large" />
</TouchableOpacity>
)}
</View> </View>
); );
} }

View File

@ -25,5 +25,8 @@ export const styles = StyleSheet.create({
paddingLeft: 8, paddingLeft: 8,
paddingRight: 8, paddingRight: 8,
}, },
loading: {
position: 'absolute',
},
}) })

View File

@ -52,7 +52,10 @@ export function useVideoAsset(topicId, asset) {
const actions = { const actions = {
setResolution: (width, height) => { setResolution: (width, height) => {
updateState({ loaded: true, display: {}, videoRatio: width / height }); updateState({ display: {}, videoRatio: width / height });
},
loaded: () => {
updateState({ loaded: true });
}, },
play: () => { play: () => {
actions.showControls(); actions.showControls();