martin/databag
1
0
Fork 0
mirror of https://github.com/balzack/databag.git synced 2025-02-14 20:49:16 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

fixing media carousel scroll in android

Browse Source
This commit is contained in:
Roland Osborne 2023-05-05 14:49:17 -07:00
parent 532c7fac9e
commit 72a502204e
1 changed files with 24 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
app/mobile/src/session/conversation/topicItem/TopicItem.jsx
View File

@ -13,7 +13,7 @@ import { ImageAsset } from './imageAsset/ImageAsset';
import { AudioAsset } from './audioAsset/AudioAsset'; import { AudioAsset } from './audioAsset/AudioAsset';
import { VideoAsset } from './videoAsset/VideoAsset'; import { VideoAsset } from './videoAsset/VideoAsset';
import Carousel from 'react-native-reanimated-carousel'; import Carousel from 'react-native-reanimated-carousel';
import { GestureHandlerRootView } from 'react-native-gesture-handler';
export function TopicItem({ item, focused, focus, hosting, remove, update, block, report, contentKey }) { export function TopicItem({ item, focused, focus, hosting, remove, update, block, report, contentKey }) {
const { state, actions } = useTopicItem(item, hosting, remove, contentKey); const { state, actions } = useTopicItem(item, hosting, remove, contentKey);
@ -212,27 +212,29 @@ export function TopicItem({ item, focused, focus, hosting, remove, update, block
onRequestClose={actions.hideCarousel} onRequestClose={actions.hideCarousel}
> >
<View style={styles.modal}> <View style={styles.modal}>
<Carousel <GestureHandlerRootView>
loop <Carousel
width={state.width} loop
autoPlay={false} width={state.width}
data={state.assets} autoPlay={false}
defaultIndex={state.carouselIndex} data={state.assets}
scrollAnimationDuration={1000} defaultIndex={state.carouselIndex}
onSnapToItem={(index) => console.log('current index:', index)} scrollAnimationDuration={1000}
renderItem={({ index }) => ( onSnapToItem={(index) => console.log('current index:', index)}
<View style={styles.frame}> renderItem={({ index }) => (
{ state.assets[index].type === 'image' && ( <View style={styles.frame}>
<ImageAsset asset={state.assets[index]} dismiss={actions.hideCarousel} /> { state.assets[index].type === 'image' && (
)} <ImageAsset asset={state.assets[index]} dismiss={actions.hideCarousel} />
{ state.assets[index].type === 'video' && ( )}
<VideoAsset asset={state.assets[index]} dismiss={actions.hideCarousel} /> { state.assets[index].type === 'video' && (
)} <VideoAsset asset={state.assets[index]} dismiss={actions.hideCarousel} />
{ state.assets[index].type === 'audio' && ( )}
<AudioAsset asset={state.assets[index]} dismiss={actions.hideCarousel} /> { state.assets[index].type === 'audio' && (
)} <AudioAsset asset={state.assets[index]} dismiss={actions.hideCarousel} />
</View> )}
)} /> </View>
)} />
</GestureHandlerRootView>
</View> </View>
</Modal> </Modal>
</View> </View>