martin/databag
1
0
Fork 0
mirror of https://github.com/balzack/databag.git synced 2025-02-14 12:39:17 +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 { VideoAsset } from './videoAsset/VideoAsset';
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 }) {
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}
>
<View style={styles.modal}>
<Carousel
loop
width={state.width}
autoPlay={false}
data={state.assets}
defaultIndex={state.carouselIndex}
scrollAnimationDuration={1000}
onSnapToItem={(index) => console.log('current index:', index)}
renderItem={({ index }) => (
<View style={styles.frame}>
{ 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 === 'audio' && (
<AudioAsset asset={state.assets[index]} dismiss={actions.hideCarousel} />
)}
</View>
)} />
<GestureHandlerRootView>
<Carousel
loop
width={state.width}
autoPlay={false}
data={state.assets}
defaultIndex={state.carouselIndex}
scrollAnimationDuration={1000}
onSnapToItem={(index) => console.log('current index:', index)}
renderItem={({ index }) => (
<View style={styles.frame}>
{ 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 === 'audio' && (
<AudioAsset asset={state.assets[index]} dismiss={actions.hideCarousel} />
)}
</View>
)} />
</GestureHandlerRootView>
</View>
</Modal>
</View>