问题标签 [react-native-image]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
2977 浏览

react-native - react-native-image-slider-box 与本地图像不起作用

我正在尝试使用“react-native-image-slider-box”库创建一个图像轮播。我正确配置了库类和参数,但无法在移动博览会应用程序中看到图像轮播。

我使用的代码:

并且图像存在于这样的目录中:

我在哪里错了?我应该怎么做才能使图像滑块工作?输出仅显示 HomeGrid 组件而不是 SliderBox 组件。

0 投票
1 回答
33 浏览

react-native - React Native:您如何处理使屏幕顶部的图形时间等难以看到的问题?

我的 React Native 应用程序的屏幕顶部有以下图形:

在此处输入图像描述

显然问题在于时间、电池电量等很难看到,因为图形是黑色的。人们通常如何处理这种事情?如果我把它变成白色,如果特定手机上的时间等是白色的,我就会冒它不那么明显的风险。我是否应该在屏幕顶部放置填充,以使图形不与文本重叠?

0 投票
2 回答
628 浏览

css - React Native:如何使 ImageBackground 中的 View 具有 100% 的宽度但具有水平填充?

我的 React Native 应用程序中有以下屏幕: 在此处输入图像描述

蓝黑白底是ImageBackgrounda,中间的绿条是a View。代码是:

我希望15px在 green 的左右边缘有填充View。如果是ImageBackgroundView我会在其中添加15px填充,但是当它是时ImageBackground,会导致:

在此处输入图像描述

相反,如果我添加margin: 15px到 green View,我会得到:

在此处输入图像描述

我应该如何处理这个,让它看起来像这样?

在此处输入图像描述

0 投票
2 回答
107 浏览

reactjs - React Native Image:如何根据输入道具渲染特定图像?

Image在我的 React Native 应用程序中,我有一个组件,其中包含一个source我想要依赖于输入道具的组件。我尝试了以下两种方法:

但两者都抛出错误。谁能告诉我这些代码有什么问题?我能想到的唯一其他解决方案是

并将图像的路径名作为道具传递,但我认为有一个更清洁的解决方案。

0 投票
0 回答
62 浏览

reactjs - 即使在导航之后,react-native 图像选择器也应该保持其图像

实际上我正在使用 react-native 图像选择器,并且有不同的页面。因此,当我在 react-native 图像选择器中加载图像并导航到不同的页面并返回相同的图像时,图像不再存在。我希望应该维护在图像选择器中加载的图像

//这就是我设置照片状态的方式

0 投票
1 回答
2511 浏览

react-native - ReferenceError:找不到变量:道具

在 React-Native 中,我正在创建一个名为 ImageSelector 的功能组件,其中我使用 expo-image-picker 并将图像 URI 用作使用 Formik 的父组件中的必填字段。我的模拟器工作正常,我能够成功选择通用图像并在控制台中记录图像 URI('success:' + result.uri),但出现以下错误:

我想在下面的图像组件中显示图像,但图像不显示(它不会中断)。我收到以下错误Unhandled Promise Rejection: ReferenceError: Can't find variable: props我想这是指父表单组件,但我不知道要改变什么才能让这个错误消失。

父组件

以下 4 行不执行(控制台日志用于测试以确保它们不会被调用):

  • onImagePicked({uri: result.uri});*
  • 控制台.log('a'); *
  • setSelectedImage({uri: result.uri});*
  • 控制台.log('b');*

我需要消除与道具相关的错误,将 selectedImage 设置为等于 result.uri,并<Image />使用 selectedImage.uri 作为图像源在组件中显示图像。

帮助?

0 投票
2 回答
270 浏览

react-native - 当道具更改时,反应原生图像组件不在本地图像和uri之间切换

我有一个头像组件,里面有以下 XML

当应用程序加载头像时为空,因此 defaultAvatar 加载,然后几秒钟后图像接收到新的道具,它应该切换到 uri 图像,但它无法做到这一点。

当我将代码更改为

然后组件按预期工作,最初头像加载空白,几秒钟后它正确加载 uri 图像。

该问题似乎仅在头像必须从本地存储的资产切换到 uri 时才存在。

0 投票
1 回答
142 浏览

react-native - 有没有办法在 React Native 中保存带有视图的图像?

我有这张图像,上面叠加了尺子的图像,正如您在这张图片中看到的那样,我想将带有尺子的图像保存到相机胶卷中。标尺是从相机胶卷加载的图像上的视图组件。我无法找到一种方法来做到这一点。有人可以帮忙吗?

0 投票
2 回答
745 浏览

react-native - 如何在 react-native-image-slider-box lib 中控制滑块的速度

每个人。我正在构建 expo 应用程序并使用 react-native-image-slider-box npm lib 添加了滑块图像。但是没有改变滑块速度的想法.....有什么解决方案吗?为此使用另一个库会很棒。

谢谢。

0 投票
1 回答
172 浏览

javascript - React Native 图像 web uri 不适用于真实设备(在模拟器中工作)

我正在为所有国家/地区创建滚动视图,每个国家/地区都有一个标志作为图像和一个名称,我基于的数据是从 API 更新的,在 API 响应后,我将国家数据设置为该州对象,我调用 this.setSatet(newstate) 来更新滚动视图。

所以,我使用这段代码来显示每个国家的国旗:

我确保给定的URI是正确的,我已将以下所有网络安全添加到我的 android 项目中:

我在模拟器上测试了我的应用程序,它运行良好,但在我的真实设备上无法运行我得到的图像没有显示一个空的图像视图,请有任何想法的人可以帮助我,请分享。我有很多时间寻找解决方案,但没有办法,请帮忙。