adolforeyna/EMI-ExpoAPP
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Improve mobile photo quality for uploads and media rendering

Browse Source
This commit is contained in:
Adolfo Reyna
2026-02-21 21:35:34 -05:00
parent 270e4e1c2d
commit 5e05cba3ad
4 changed files with 8 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
Views/NewPost.js
View File

@@ -51,7 +51,7 @@ let NewPostView = (props) => {
// Launch image picker to select images from gallery // Launch image picker to select images from gallery
const result = await ImagePicker.launchImageLibraryAsync({ const result = await ImagePicker.launchImageLibraryAsync({
mediaTypes: ImagePicker.MediaTypeOptions.Images, mediaTypes: ImagePicker.MediaTypeOptions.Images,
quality: 0.2, // Set image quality quality: 0.85, // Avoid aggressive client-side compression before upload
allowsMultipleSelection: true, // Allow multiple images to be selected allowsMultipleSelection: true, // Allow multiple images to be selected
}); });
if (!result.canceled) { if (!result.canceled) {

2
Views/ProfileSettings.js
View File

@@ -55,7 +55,7 @@ let ProfileSettings = () => {
mediaTypes: ImagePicker.MediaTypeOptions.Images, mediaTypes: ImagePicker.MediaTypeOptions.Images,
allowsEditing: true, allowsEditing: true,
aspect: [4, 3], aspect: [4, 3],
quality: 0.5, quality: 0.85,
//allowsMultipleSelection: true, //allowsMultipleSelection: true,
}); });
if (!result.canceled) { if (!result.canceled) {

7
components/Media.js
View File

@@ -1,6 +1,6 @@
// Import necessary dependencies // Import necessary dependencies
import React, { useState, useEffect } from 'react'; import React, { useState, useEffect } from 'react';
import { View, TouchableHighlight, StyleSheet, FlatList, TouchableWithoutFeedback, TouchableOpacity, Share } from 'react-native'; import { View, TouchableHighlight, StyleSheet, FlatList, TouchableWithoutFeedback, TouchableOpacity, Share, Dimensions, PixelRatio } from 'react-native';
import { Button, Text, ProgressBar } from 'react-native-paper'; import { Button, Text, ProgressBar } from 'react-native-paper';
import API from './../API.js'; import API from './../API.js';
import VideoPlayer from './VideoPlayer.js'; import VideoPlayer from './VideoPlayer.js';
@@ -71,7 +71,10 @@ let Media = (props) => {
const viewer = gState.me; const viewer = gState.me;
// Extracting tags from content // Extracting tags from content
const imagesTag = imagesTagF(props.content, props.imageWidth || 1000, props.imageHeight || 1000); const screenWidth = Dimensions.get('window').width;
const requestedImageWidth = props.imageWidth || Math.max(1200, Math.ceil(screenWidth * PixelRatio.get() * 1.2));
const requestedImageHeight = props.imageHeight || requestedImageWidth;
const imagesTag = imagesTagF(props.content, requestedImageWidth, requestedImageHeight);
const imagesTagLimited = imagesTag.slice(0, 10); const imagesTagLimited = imagesTag.slice(0, 10);
const isImagesCapped = imagesTag.length > imagesTagLimited.length; const isImagesCapped = imagesTag.length > imagesTagLimited.length;
const imageStyle = imagesTag.length === 1 ? styles.image : styles.multipleImage; const imageStyle = imagesTag.length === 1 ? styles.image : styles.multipleImage;

2
components/NewPost.js
View File

@@ -21,7 +21,7 @@ let NewPost = ({ profileid, newPostCB }) => {
mediaTypes: ImagePicker.MediaTypeOptions.Images, mediaTypes: ImagePicker.MediaTypeOptions.Images,
//allowsEditing: true, //allowsEditing: true,
//aspect: [4, 3], //aspect: [4, 3],
quality: 0.2, quality: 0.85,
allowsMultipleSelection: true, allowsMultipleSelection: true,
}); });
if (!result.canceled) { if (!result.canceled) {