161
questions
0
votes
0
answers
23
views
React Native Image sizing not functioning as intended
I am trying to display an image and have it take up full width and auto height (based on the height of the image). The desired output is this
This is my code
import {
View,
Text,
...
0
votes
0
answers
51
views
List of Images are not showing in React Native Application
I am new to react native and working on personal project. I am trying to show list of image card but images are not visible. Sometime few images are visible but same image is not visible next time.
I ...
3
votes
2
answers
1k
views
React Native Expo Local Images Not Showing
I'm simply tying to display a local image in my react native expo project and it refuses to work. I get no errors, its just not there. I understand this question has been asked before, but I can't ...
0
votes
2
answers
62
views
error related to images in react native app
import React, { useState } from 'react';
import type { PropsWithChildren } from 'react';
import { ImageSourcePropType, StyleSheet, View, Image, Pressable, Text } from 'react-native';
import DiceOne ...
0
votes
1
answer
139
views
"Implementing Resizable and Draggable Inner View with Camera Capture in React Native" [closed]
I am working on a React Native project where I need to implement a camera functionality with a specific requirement. Below I had shared a image I Want to implement below shown functionality, The ...
0
votes
0
answers
43
views
How to adjust a view size with fingers in React Native?
In React Native, when the user selects an image, I bring it to the center of the screen. The user should be able to increase or decrease the size of this image with his finger. My main wish is for him ...
0
votes
0
answers
128
views
Sketch Filter for Images for a react native app
I am creating a react native app, it is like a trace-and-sketch kind of app, so one of its key features is an image background removal which basically clears out any colour from the image and enhances ...
0
votes
2
answers
1k
views
React Native How can I change the App Icon
I am coding my first React Native app with Expo and I have it, now I want to change de App icon but I do not know how to do it, I already saw a lot of posts and watch videos but in all of them, people ...
1
vote
0
answers
360
views
How to use an authorization token with React Native Image component?
I'm working on a React Native project where I need to display images fetched from an API that requires an authorization token for authentication. I'm currently using the Image component from React ...
0
votes
0
answers
30
views
The moment my text got bigger, my image flows out of its container - React Native
enter image description here
In my project I am building a Cart like component that will be rendered on the screen. Like the image given, the moment my text got larger, it pushes away my image and ...
0
votes
1
answer
356
views
Set image url in state and use it then in react native
I am using react native for one of my project.
I am setting state with an image url, and then I wanted it to use this state in Image, but its not working
Image path: ../../assets/images/image.png
...
1
vote
0
answers
37
views
I can't fix my image in React native app
A React component for displaying different types of images, including network images, static resources, temporary local images, and images from local disk, such as the camera roll.
A string that ...
2
votes
1
answer
1k
views
Not able to display local image in react native
I am extracting image from my device whose file is coming as file:///storage/emulated/0/WhatsApp/Media/WhatsApp Images/IMG-20230525-WA0009.jpg.
I am trying to display this image as:
<Image
source=...
2
votes
0
answers
110
views
How to mix content with template images in Electron for macos
According to Electron docs
"Template images are not intended to be used as standalone images and
are usually mixed with other content to create the desired final
appearance."
May I know ...
2
votes
0
answers
758
views
Why React Native <Image /> has wrong aspect ratio when height isn't auto?
React Native <Image /> doesn't display correctly when width: "100%". Well, it displays but with wrong aspect ratio, even if I have specified the correct one. It ignores aspectRatio ...
0
votes
1
answer
277
views
How to stop distortion of image in react native flatlist
I have made use of react native flatlist to display image but sometimes the image that I get from response will not be of perfect size thats why it will distort the image to contain,
the first image ...
1
vote
2
answers
5k
views
How to upload images on firebase storage using react native expo
I'm trying to upload images on firebase storage using my expo app. I went through their documentation and tried to implement using the docs. but whenever I upload I don't get any error but the image ...
0
votes
0
answers
92
views
Unable to Repeat background Image inside FlatList/ScrollView in React Native
I am a React Native Developer. And I was trying to repeat background image and the background image is in flatlist. I tried solutions like provided stretch in resizeMode but ending with very bad ...
1
vote
1
answer
789
views
React native, Image not showing
so I'm very new to react native and I'm trying to create a FlashList. Seems to work fine with most elements but my images aren't really playing along.
Seems like the FlashList is importing the image ...
2
votes
0
answers
114
views
Some remote image is not showing in react native iOS but showing in android
Some remote image is not showing in react native iOS. But the same image is showing in android.
This is not happening for all images.
Not showing: https://d1ldvf68ux039x.cloudfront.net/thumbs/frames/...
0
votes
1
answer
1k
views
React-native android images flashing on load
I am having trouble on Android where the images are flashing only on Android and I cannot seem to find a solution.
I have attached a video below to show the problem
Here is my Flatlist
<FlatList
...
0
votes
1
answer
568
views
Issue with images styling inside a FlatList - React Native
I'm trying to design an application screen (I used React Navigation) where several images are displayed vertically inside a FlatList. Each image takes up around 90% of the screen, is centered and has ...
1
vote
1
answer
228
views
Selected image update on Avatar R.N Image Picker
Hello guys I'm Using React native Image Picker I able to select image from android library but after selection Im not able to update on my Avatar profile[Image]
After select Image here is my console....
0
votes
1
answer
295
views
React native image post with rest api
There is a section in my application where I need to take photos from users and post them to the server with rest api. ı take photos by users from camera or select gallery. After taking photos, I keep ...
1
vote
1
answer
289
views
How do I add different images for different app 'flavors'?
I've built a React Native app which has 2 versions - production and dev. I've created slightly different app icons and added these in XCode & Android Studio, and those are working fine. However, ...
1
vote
0
answers
92
views
How to click only on the colored part of the image but not on the white background
I am trying to render an image in react native. I want to select any part of that image. By selecting I mean I am now rendering a circle every time I press on the image.
You can find the codes here
...
0
votes
1
answer
145
views
React native image contain
I want to fit an background image with full height and wdith,in contain mode but when i do the image height and width will get half
[![i got this result when i user resizemode="contain"][1]][...
1
vote
1
answer
201
views
Converting inage to base64 is rotating the image in react native
I am using react-native-img-to-base64 package to convert my camera image to base64. It is converting the image successfullt but the image is 45 degree left side turned. I don't know how to make it not ...
0
votes
1
answer
301
views
React Native Image Styling
I want to set my image according to screen size and
dimension but I am not able to do it please help me out
If I rotate the phone it should set accordingly
<View style={{flex: 1}}>
<...
1
vote
0
answers
1k
views
Error in render testing react native when require image
I'm doing render testing of a login screen that returns an error when an image is on the screen and I don't know what to solve
test code
it('render screen Login ', () => {render(<Login />);});...
2
votes
2
answers
1k
views
Pool hard cap violation? Android images in React native
I have an Image component inside a modal in react native .64, and it works perfectly on iOS, but with Android I get a an error (for instance: Pool hard cap violation? Hard cap = 201326592 Used size = ...
1
vote
2
answers
1k
views
Import image string from JSON Data in Image component in React Native
I'm trying to get the image string from the mock data array and push it inside <Image> Component in React Native. Here's my Data array:
const data= [
{
title: 'Lorem ipsum dolor sit amet.',...
2
votes
1
answer
2k
views
React Native image: why does parent view stay same height as 'cover' when set to 'contain'?
I have the following image in my React Native app
I want to have this image inside a parent element with no space above or below it, and I want the image to not overshoot the left or right sides of ...
1
vote
3
answers
3k
views
How to upload large files using react-native-image-crop-picker
I'm trying to upload small files using react-native-image-crop-picker it's working fine but when I tried uploading large video/image file using react-native-image-crop-picker I'm getting Network error....
2
votes
0
answers
1k
views
React native split one image to multiple parts
I have one image now I want to split that one image into three parts.
How can I do it in React-native? I've tried different packages but not getting appropriate result which I exactly need in my app.
...
0
votes
1
answer
1k
views
can't display images from localhost dev server in react native
I'm trying to render images in react native from my local dev server, but I'm not able to shoe images. The image URI I'm getting from the server is a proper one I checked that with copying and pasting ...
1
vote
4
answers
3k
views
ImageBackground is not taking full height of View in react native
I am using ImageBackground in my react native app, but it not covering full height of the View
You can see that there is red space which is not covered by my image.
Below is my code:
<View
style=...
0
votes
2
answers
6k
views
ReactNative: displaying the image from the local storage is not working
I am building an IOS application using ReactNative. My app needs to display image from the local file system or gallery or the ones captured by the camera. But it is not working. I am displaying ...
1
vote
1
answer
4k
views
React native Image is not showing
I have a react-native app where I am looping through array that contains urls of some images on my API server.
The problem is these images are not showing on the device.
Here is the code:
<View ...
0
votes
2
answers
902
views
React native Image ' Warning: Failed prop type: Invalid prop `source` supplied to `Image`. '
So this is my code
I already answered the question.
export const BigCard = ({Title, Image, Description}) => {
console.log(Image)
return(
<StyledBigCard>
...
0
votes
0
answers
98
views
React Native Image needs to show image on corner
I have an image viewer box in my app box has the size 300px x 300px when I set the image in it and the image has the width and height 100% of this box now I set it resizeMode: 'contain' every image ...
-1
votes
1
answer
331
views
Show image in news feed like facebook
I want to show image in my feed list like facebook if I use resize mode 'contains' it show white space before and after the image please tell me any possible way to resize my image to view in proper ...
0
votes
1
answer
279
views
Setting path to image source in reactnative
<Image
source={require(`../${item.image}`)}
resizeMode="cover"
style={styles.cardImg}
/>
local images folder path => ...
0
votes
2
answers
449
views
React-native: image is not rendered
I am learning React native and simply want to add an image inside of a container.View and a title.Text. Nothing is being shown. I tried both accessing it from the assets folder and via uri.
My assets ...
0
votes
2
answers
2k
views
react native ImageBackground not showing on IOS device
I am using the ImageBackground component of react native, but in IOS (device) it is not displaying the image, in the simulator the image appears
What can this be?
code below:
import { ImageBackground }...
0
votes
1
answer
1k
views
react native image type .jfif support
I am doing a login with Facebook in the app. where I get a user profile pic. Facebook SDK returns a profile pic URL.
profile pic
I have saved this file in directory assets/download.jfif
and I get it ...
1
vote
1
answer
784
views
Image component in react native is not able to find images marked as .android.png on Android
Folder Structure
├── app.js
└── assets
├── play.android.png
└── play.ios.png
OR
├── app.js
├── play.android.png
└── play.ios.png
As per react-native documentation
The image ...
1
vote
1
answer
532
views
Images source is converting into integer number while using filter in react native
I have following data in json format
const data = [
{
"id": 1,
"category": "fruits",
"title" : "Red Apples",
"image1": require("../assets/images/products/...
1
vote
1
answer
620
views
React Native Image not working with android google maps custom view
I am displaying the five stars in a row for ratings on a ,marker in google maps. It is working great on iOs but no images are loading on Android. I don't understand why though because I am able to use ...
0
votes
2
answers
40
views
When iterate over a map to show all images, I get warning: Each child in a list should have a unique "key" prop
I have a Map data structure, in which the values of the map contains image uri. I simply want to show all images in the Map.
Here is what I did:
<View style={styles.container}>
{[...imagesMap....