octo/tooot
octo
/
tooot
mirror of https://github.com/tooot-app/app
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Fix some zoomed image not shown correctly

This commit is contained in:
xmflsct 2023-03-14 21:14:09 +01:00
parent 4977e91b66
commit b5ddebe123
2 changed files with 21 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/components/GracefullyImage.tsx
View File

@ -1,7 +1,7 @@
import { useAccessibility } from '@utils/accessibility/AccessibilityManager'
import { connectMedia } from '@utils/api/helpers/connect'
import { useTheme } from '@utils/styles/ThemeManager'
import { Image, ImageSource, ImageStyle } from 'expo-image'
import { Image, ImageContentFit, ImageSource, ImageStyle } from 'expo-image'
import React, { useState } from 'react'
import { AccessibilityProps, Pressable, StyleProp, View, ViewStyle } from 'react-native'
@ -21,6 +21,7 @@ export interface Props {
onPress?: () => void
style?: StyleProp<ViewStyle>
imageStyle?: ImageStyle
contentFit?: ImageContentFit
dim?: boolean
withoutTransition?: boolean
@ -36,6 +37,7 @@ const GracefullyImage = ({
onPress,
style,
imageStyle,
contentFit,
dim,
withoutTransition = false,
enableLiveTextInteraction = false
@ -63,6 +65,7 @@ const GracefullyImage = ({
source={hidden ? sources.blurhash : connectMedia(source)}
{...(!withoutTransition && !reduceMotionEnabled && { transition: { duration: 120 } })}
style={{ flex: 1, ...imageStyle }}
contentFit={contentFit}
onError={() => {
if (
sources.default?.uri &&

29
src/screens/ImageViewer/index.tsx
View File

@ -159,8 +159,8 @@ const ScreenImagesViewer = ({
}) => {
const screenRatio = WINDOW_WIDTH / WINDOW_HEIGHT
const imageRatio = item.width && item.height ? item.width / item.height : 1
const imageWidth = item.width || 100
const imageHeight = item.height || 100
const imageWidth = item.width
const imageHeight = item.height
const maxWidthScale = item.width
? (item.width / WINDOW_WIDTH / PixelRatio.get()) * 4
@ -198,16 +198,21 @@ const ScreenImagesViewer = ({
default: { uri: item.url },
remote: { uri: item.remote_url }
}}
dimension={{
width:
screenRatio > imageRatio
? (WINDOW_HEIGHT / imageHeight) * imageWidth
: WINDOW_WIDTH,
height:
screenRatio > imageRatio
? WINDOW_HEIGHT
: (WINDOW_WIDTH / imageWidth) * imageHeight
}}
style={{ flex: 1 }}
contentFit='contain'
{...(imageWidth &&
imageHeight && {
dimension: {
width:
screenRatio > imageRatio
? (WINDOW_HEIGHT / imageHeight) * imageWidth
: WINDOW_WIDTH,
height:
screenRatio > imageRatio
? WINDOW_HEIGHT
: (WINDOW_WIDTH / imageWidth) * imageHeight
}
})}
enableLiveTextInteraction
/>
</View>