ecency/ecency-mobile
1
1
Fork 0
mirror of https://github.com/ecency/ecency-mobile.git synced 2024-12-12 13:05:41 +03:00
Code Issues Actions Packages Projects Releases Wiki Activity

improve post thumbnails

Browse Source
This commit is contained in:
feruz 2021-01-16 19:01:38 +02:00
parent c170cf6203
commit 14dc37671f
3 changed files with 20 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/components/postCard/view/postCardView.js
View File

@ -21,7 +21,7 @@ import styles from './postCardStyles';
import DEFAULT_IMAGE from '../../../assets/no_image.png'; import DEFAULT_IMAGE from '../../../assets/no_image.png';
import NSFW_IMAGE from '../../../assets/nsfw.png'; import NSFW_IMAGE from '../../../assets/nsfw.png';
const { width } = Dimensions.get('window'); const { width, height } = Dimensions.get('window');
const PostCardView = ({ const PostCardView = ({
handleOnUserPress, handleOnUserPress,
@ -106,7 +106,10 @@ const PostCardView = ({
<TouchableOpacity style={styles.hiddenImages} onPress={_handleOnContentPress}> <TouchableOpacity style={styles.hiddenImages} onPress={_handleOnContentPress}>
{!isHideImage && ( {!isHideImage && (
<FastImage <FastImage
style={[styles.thumbnail, { width: width - 16, height: calcImgHeight }]} style={[
styles.thumbnail,
{ width: width - 16, height: Math.min(calcImgHeight, height) },
]}
source={_image} source={_image}
resizeMode={FastImage.resizeMode.cover} resizeMode={FastImage.resizeMode.cover}
defaultSource={DEFAULT_IMAGE} defaultSource={DEFAULT_IMAGE}

4
src/components/postListItem/view/postListItemStyles.js
View File

@ -18,8 +18,8 @@ export default EStyleSheet.create({
margin: 0, margin: 0,
alignItems: 'center', alignItems: 'center',
alignSelf: 'center', alignSelf: 'center',
height: 200, //height: 200,
width: '$deviceWidth - 16', //width: '$deviceWidth - 16',
borderRadius: 8, borderRadius: 8,
backgroundColor: '$primaryLightGray', backgroundColor: '$primaryLightGray',
// paddingVertical: 10, // paddingVertical: 10,

17
src/components/postListItem/view/postListItemView.js
View File

@ -1,6 +1,6 @@
import React, { useRef, Fragment } from 'react'; import React, { useRef, useState, Fragment } from 'react';
import ActionSheet from 'react-native-actionsheet'; import ActionSheet from 'react-native-actionsheet';
import { View, Text, TouchableOpacity } from 'react-native'; import { View, Text, TouchableOpacity, Dimensions } from 'react-native';
import { injectIntl } from 'react-intl'; import { injectIntl } from 'react-intl';
import FastImage from 'react-native-fast-image'; import FastImage from 'react-native-fast-image';
@ -17,6 +17,8 @@ import DEFAULT_IMAGE from '../../../assets/no_image.png';
// Styles // Styles
import styles from './postListItemStyles'; import styles from './postListItemStyles';
const { width, height } = Dimensions.get('window');
const PostListItemView = ({ const PostListItemView = ({
title, title,
summary, summary,
@ -32,7 +34,7 @@ const PostListItemView = ({
isFormatedDate, isFormatedDate,
}) => { }) => {
const actionSheet = useRef(null); const actionSheet = useRef(null);
const [calcImgHeight, setCalcImgHeight] = useState(0);
// Component Life Cycles // Component Life Cycles
// Component Functions // Component Functions
@ -60,7 +62,14 @@ const PostListItemView = ({
</View> </View>
<View style={styles.body}> <View style={styles.body}>
<TouchableOpacity onPress={() => handleOnPressItem(id)}> <TouchableOpacity onPress={() => handleOnPressItem(id)}>
<FastImage source={image} style={styles.image} defaultSource={DEFAULT_IMAGE} /> <FastImage
source={image}
style={[styles.image, { width: width - 16, height: Math.min(calcImgHeight, height) }]}
defaultSource={DEFAULT_IMAGE}
onLoad={(evt) =>
setCalcImgHeight((evt.nativeEvent.height / evt.nativeEvent.width) * width)
}
/>
<View style={[styles.postDescripton]}> <View style={[styles.postDescripton]}>
<Text style={styles.title}>{title}</Text> <Text style={styles.title}>{title}</Text>
<Text style={styles.summary}>{summary}</Text> <Text style={styles.summary}>{summary}</Text>