martin/databag
1
0
Fork 0
mirror of https://github.com/balzack/databag.git synced 2025-04-23 10:05:19 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

clear thumb so not visible on far pan

Browse Source
This commit is contained in:
balzack 2025-01-06 10:13:58 -08:00
parent 970057351b
commit c46c927324
1 changed files with 11 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
app/client/mobile/src/message/imageAsset/ImageAsset.tsx
View File

@ -12,6 +12,7 @@ export function ImageAsset({ topicId, asset, loaded, show }: { topicId: string,
const [modal, setModal] = useState(false);
const opacity = useAnimatedValue(0);
const [alert, setAlert] = useState('');
const [cleared, setCleared] = useState(false);
useEffect(() => {
if (state.loaded && show) {
@ -28,6 +29,7 @@ export function ImageAsset({ topicId, asset, loaded, show }: { topicId: string,
const showImage = () => {
setModal(true);
setCleared(false);
actions.loadImage();
};
@ -63,12 +65,14 @@ export function ImageAsset({ topicId, asset, loaded, show }: { topicId: string,
<Modal animationType="fade" transparent={true} supportedOrientations={['portrait', 'landscape']} visible={modal} onRequestClose={hideImage}>
<View style={styles.modal}>
<BlurView style={styles.blur} blurType="dark" blurAmount={16} reducedTransparencyFallbackColor="dark" />
<Image
style={styles.full}
resizeMode="contain"
source={{ uri: state.thumbUrl }}
onLayout={actions.fullscreen}
/>
{ !cleared && (
<Image
style={styles.full}
resizeMode="contain"
source={{ uri: state.thumbUrl }}
onLayout={actions.fullscreen}
/>
)}
{ state.dataUrl && (
<ReactNativeZoomableView width={state.width} height={state.height} minZoom={1} maxZoom={30}>
<Image
@ -77,6 +81,7 @@ export function ImageAsset({ topicId, asset, loaded, show }: { topicId: string,
resizeMode="contain"
onError={(err)=>console.log(err)}
source={{ uri: state.dataUrl }}
onLoad={()=>setCleared(true)}
/>
</ReactNativeZoomableView>
)}