标签: react-native-android

React Native从后台强制打开Android应用程序

如何从代码将android应用程序从后台切换到前台?我有后台任务正在运行,可以在后台播放声音、发出异步请求等。

android react-native react-native-android

7
推荐指数
0
解决办法
704
查看次数

如何使用 Android Studio 调试本机反应本机库?

这个问题不是关于如何调试React-Native 应用程序的 javascript-land。它是关于如何在 node_modules-folder 中调试本机库(在这种情况下意味着:JAVA-Code)。

虽然我很容易用 XCode 调试 RN-Applications 的原生 iOS 部分,但我偶然发现了 Android Studio 的各种问题......主要是,将项目导入 Studio 后 node_modules-Folder 不存在,为什么不能设置断点来调试通过。

版本:

  • Android Studio 2.2.2(当前最新版本)
  • react-native 0.38.0(也是最新版本)
  • gradle 1.3.1(从 react-native init 预配置)
  • 还尝试升级到 gradle 2.2.2
  • 安装了包括 NDK 在内的最高版本 23 的 Android SDK 和构建工具

我是如何做到的/重现的步骤

1. 创建新的 React Native 项目:

react-native init debugTest
Run Code Online (Sandbox Code Playgroud)

2. 使用您想要本地调试的本地代码安装第三方库

cd debugTest && 
react-native install react-native-sqlite-storage
Run Code Online (Sandbox Code Playgroud)

3.确保一切都能在android端正常工作:

  • 启动 GenyMotion

  • 启动 AVD

  • 在终端中使用此命令运行应用程序:

    react-native run-android

(这将打开打包程序以及传输 js-bundle 所需的所有其他内容)。如果想省略这一步,需要手动启动打包程序:

node node_modules/react-native/local-cli/cli.js start
Run Code Online (Sandbox Code Playgroud)

4.启动Android Studio …

java android android-studio react-native react-native-android

7
推荐指数
1
解决办法
2798
查看次数

如果只有组件的一部分发生变化,React 是否会渲染整个组件?

我想知道如果我将大组件拆分成许多非常小的组件,我的代码是否会更高效,以便应用程序一次只渲染 DOM 的较小部分。

但是我觉得 React 可能已经只渲染了应用程序发生变化的部分,无论组件是大还是小。所以如果一个庞大组件的一小部分被改变,React 只会重新渲染组件的那一小部分,而不是整个组件。

我在第二段中的断言是否正确,或者我可以通过将一个大组件分成许多小组件来获得更好的性能吗?我在这个问题中包括 ReactJS 和 React Native。我认为它们在这方面是相同的,但如果它们不同,我想知道。

reactjs react-native react-native-android react-native-ios

7
推荐指数
1
解决办法
8289
查看次数

长文本通过本机反应将其他元素推离屏幕

我正在尝试使用 Flexbox 在 React-Native 中构建布局,但在文本很长时遇到了问题。我希望布局看起来像这样:

所需布局

但是,当蓝色文本变长时,它会将日期从屏幕右侧推开,如下所示:

在此处输入图片说明

我故意让文本停留在 1 行。我想要的是蓝色文本在不缩小文本的情况下尽可能多地展开。我是 RN 的新手,我在 CSS 方面的工作非常有限,所以我在做这样的事情方面没有太多经验。这是我的样式表代码:

const styles = StyleSheet.create({
  textContainer: {
    flex: 1
  },
  separator: {
    height: 1,
    backgroundColor: '#dddddd'
  },
  title: {
    fontSize: 25,
    fontWeight: 'bold',
    color: '#48BBEC'
  },
  subtitle: {
    fontSize: 20,
    color: '#656565'
  },
  dateContainer: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'flex-end'
  },
  rowContainer: {
    flexDirection: 'row',
    padding: 10
  }
});
Run Code Online (Sandbox Code Playgroud)

最后,我的布局代码:

<TouchableHighlight
    underlayColor='#dddddd'>
      <View style={styles.rowContainer}>
          <View  cstyle={styles.textContainer}>
            <Text numberOfLines={1} style={styles.title}>{rowData.name}</Text>
            <Text style={styles.subtitle}>{rowData.teacher}</Text>
          </View>
          <View style={styles.dateContainer}>
            <Text style={styles.subtitle}>{result}</Text>
          </View> …
Run Code Online (Sandbox Code Playgroud)

css layout flexbox react-native react-native-android

7
推荐指数
2
解决办法
4591
查看次数

react-native如何实现后台服务

在我的本机应用程序中,我需要一个后台服务来监听 Nfc 标签检测事件。我正在寻找一些像 android 后台服务一样工作的插件。

react-native-android

7
推荐指数
0
解决办法
366
查看次数

7
推荐指数
1
解决办法
2546
查看次数

Flatlist onEndReached 无限循环

我state用来存储以下数据。

state = {
    refresh: true,
    isFetching: true,
    showLoadingBottom: false,
    data: []
};
Run Code Online (Sandbox Code Playgroud)

在componentDidMount我手动调用一个_fetchData将数据加载到this.state.data.

当 flatlist 滚动到最后时,它会触发_fetchData两次,最终两次返回相同的数据(这是另一个问题,为什么它会触发两次?)。

一旦 flatlist 到达末尾,即没有更多数据从服务器返回,它就会进入一个无限循环,因为onEndReached即使服务器没有返回新数据并this.state.data保持不变,它也会一遍又一遍地不断触发。

这是我的render代码

render() {

    return (

        <View
            style={{
                flex: 1
            }}>

            <FlatList

                refreshControl={
                    <RefreshControl
                        refreshing={this.state.refresh}
                        onRefresh={() => {
                            this.setState({
                                refresh: true
                            }, this._fetchData);
                        }}
                        title={"Pull To Refresh"}
                        tintColor={darkGrey}
                        titleColor={darkGrey}/>
                }

                onEndReachedThreshold={0.5}
                onEndReached={() => {
                    this.setState({
                        showLoadingBottom: true
                    }, () => {
                        this._fetchData();
                    });

                }}

                showsVerticalScrollIndicator={false} …
Run Code Online (Sandbox Code Playgroud)

reactjs react-native react-native-listview react-native-android react-native-flatlist

7
推荐指数
2
解决办法
4328
查看次数

如何在 react-native 中使用 node.js 和 Socket.io 实现实时聊天?

我正在寻找资源来指导我跨服务器端(大部分)和客户端。我已经提到了这个资源Simple Real Time chat app。但我没有得到显着的结果。

我在本地托管此服务器端脚本index.js,端口号为 3000。我使用node index.js.Parallelly运行此脚本,我运行了react-native 代码(Android 平台)并确保 socket.io 侦听端口号 3000。但是当我从服务器端或客户端进行任何寻求通信,我没有得到任何结果。

javascript node.js socket.io react-native react-native-android

7
推荐指数
2
解决办法
3000
查看次数

React Native Dev Menu 未出现

我正在 Windows 10 上运行 Nexus 5X API 27 Oreo 的 AVD Android 模拟器中调试 React Native 应用程序,并且开发人员菜单不会使用 StackOverflow 问题中提到的步骤显示如何调试 React Native?

  1. Ctrl + M在模拟器上使用可以启用多手势操作而不是开发菜单。Windows + M最小化所有打开的窗口。我也试过进入Settings > Send keyboard shortcuts to > Virtual device.
  2. 使用该adb shell input keyevent 82命令不会做任何事情。我尝试进入adb shell并运行命令input keyevent 82。
  3. 使用摇动设备Virtual Sensors > Accelerometer不会通过摇动设备来调出菜单。
  4. 从 API 27 Oreo 升级到 API 28 Pie。

到目前为止,我能够使用第 2 步打开开发菜单,但它突然停止工作,据我所知,没有对 React Native 代码进行任何更改。我尝试在物理设备上运行它并按预期摇动它。

debugging react-native react-native-android

7
推荐指数
1
解决办法
2616
查看次数

不再支持通过UIManager ['AIRMap']直接在UIManager上进行React Native Accessing视图管理器配置

我收到以下警告:“不再支持通过UIManager ['AIRMap']直接从UIManager访问视图管理器配置。改为使用UIManager.getViewManagerConfig('AIRMap')。” 自从我安装了react-native-maps软件包以来,它就一直在显示。我应该忽略它还是它的解决方案?

提前致谢

react-native react-native-android react-native-maps

7
推荐指数
2
解决办法
5380
查看次数