问题标签 [imagebackground]

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 投票
0 回答
80 浏览

react-native - 在 react-native 中使用 imageBackground 不会出现图像

我想动态地使图像出现在“ImageBackground”上。

我有一个 JSON 数据文件,其中包含图像的所有路径。

我使用 flatlist 来使用数据文件中的所有数据,并使用自定义组件来格式化我的可视化(集成为 flatist 上的项目)。

我的问题是,当我使用 JSON 文件中的数据时,我的图像没有出现,但是当我使用静态路径时,一切正常。

我究竟做错了什么?当我 console.log 我的 item.poster_path 正确发布。这可能是我在

但我自己没有找到

// 助手/filmsData.js

// 自定义组件 Item import React from 'react'; 从 'react-native' 导入 { StyleSheet, Text, View, ImageBackground, Image, TouchableOpacity };

0 投票
1 回答
53 浏览

react-native - 图像不适合屏幕 React-native

我有一个可以工作但高度超过的图像背景,我不知道如何使它适合屏幕。事实上,它“切割”了图像的顶部。

原图:

在此处输入图像描述

我的代码:

结果 : 在此处输入图像描述

0 投票
2 回答
65 浏览

reactjs - 反应本机背景图像大小

我是 react native 的新手,我想使用 ImageBackground。

但是,当我尝试使用以下代码使其全屏显示时:

它只返回我屏幕的一半图片。关于它为什么这样做的任何想法?

在此处输入图像描述

我的初始图像属性如下: 在此处输入图像描述

我的初始图像可以在这里找到:https ://unsplash.com/photos/0AwoTNSdwV

0 投票
1 回答
79 浏览

react-native - 更改图像背景 onClick

我有一个带有 imageBackground 的视图。在此之下,我有 3 个按钮。我想要这样,当您单击其中一个按钮时,imageBackground 会发生变化。

我想每次都使用带有状态变化的开关盒,但它没有用。我有点迷路了...我发布了我的代码,如果您有任何想法,非常感谢您的帮助!

0 投票
2 回答
1389 浏览

javascript - React Native 背景图片只是一个白屏

我正在使用从 导入的 ImageBackground 组件,react-native但没有显示图像。只是背景中的白屏

我试过this.backgroundImage改成{image: require('../assets/images/default_seal.jpg')}

我尝试使用此答案指定的 resizeMode 属性,但它不起作用。

0 投票
3 回答
1028 浏览

react-native - React Native ImageBackground 方向更改

即使我可以更改屏幕方向以更新状态并重新渲染,ImageBackground 组件仍然不会更新其宽度。

我有以下代码:

当用户更改设备的方向时,会调用 mylayoutchange() 函数。它正确更新状态。渲染功能将更新。如图所示,宽度和高度已正确更改console.log()。但是,无论出于何种原因,<ImageBackground>都不会更新其正确的宽度和高度。

当屏幕旋转时,背景图像不再填满屏幕的整个大小,而是看到绿色背景颜色。

我究竟做错了什么?

我的环境:

0 投票
1 回答
92 浏览

react-native - React Native - ImageBackground 未在 TvOS 上显示图像

我正在尝试在我的应用程序上获取图像tvOS。但它没有出现。

URL的是https,我在其中使用了相同的代码Android TV,它就像一个魅力,当我console.logurl 时它也很完美。

遵循以下行为:

在此处输入图像描述

“粉红色”图像是fast-image. 好的,它工作得很好,但是“红色背景”是一个ImageBackground并且没有加载图像。两者都使用相同的图像存储库。

按照下面的代码:

onError事件没有捕获任何错误。

任何人都知道我能做些什么来解决这个问题?

非常感谢。

0 投票
0 回答
39 浏览

react-native - React Native:在应用调整大小模式“包含”后获取“ImageBackground”中图像的当前高度和宽度

我正在从图库中选择一个图像并将其加载到ImageBackground(which have fixed height and width)本机反应中,并resizeMode在其上应用“包含”,

我想知道resizeMode应用时图像的当前高度和宽度。谢谢

0 投票
1 回答
195 浏览

android - 使用 React Native 在 Android 上使用 KeyboardAvoidView 推起 BackgroundImage

我想在键盘出现时停止 BackgroundImage 被推,只有 TextInput 组件和按钮应该被推上去。这适用于 iOS 上的当前代码,但不适用于 Android。我尝试过使用and和of 的absolute位置,但到目前为止没有任何效果。以下是Android上的代码和屏幕截图:ImageBackgroundflexheightImageBackground

更新1: 对不起,忘记添加截图(我已经android:windowSoftInputMode="adjustResize"在清单文件中添加了): 在此处输入图像描述

在此处输入图像描述

并且android:windowSoftInputMode="adjustPan",它看起来如下所示:

在此处输入图像描述

0 投票
1 回答
395 浏览

react-native - 当屏幕尺寸不同时,我应该如何处理绝对位置?

我想在 react-native 中使用 ImageBackground 在特定位置显示文本。

使用调整大小模式作为包含时,如何为不同的屏幕尺寸指定不同的绝对位置?

https://i.stack.imgur.com/HRUwn.png