React Native:当屏幕发生变化时，如何让视图停留在屏幕上？

Question

我正在用react native构建一个播客应用程序，我想实现你在大多数播客/音乐应用程序中看到的屏幕底部的迷你播放器。请参见下图。我想让迷你播放器坚持不管你导航到哪个屏幕。你知道如何在原生react中实现这一点吗？我现在使用react导航作为主导航器，https://reactnavigation.org/。

​

​

Answer 1

最好的方法是使用flexbox的魔力。

把你的应用程序想象成两个主要屏幕的组合。

1)带有标题、导航菜单和播放列表的部分(内部等)

2)玩家

尝试此布局

<View style={styles.container}>
    <View style={styles.firstBox}>
        1)
    </View>
    <View style={styles.secondBox}>
        2)
    </View>
</View>

现在你要做的就是分配合适的样式

const styles = {
    container: {
        flex: 1,
    },
    firstBox: {
        flex: 8
    },
    secondBox: {
        flex: 2
    }
}

对于基本结构来说，这已经足够了。您可以相应地进行设计。