Question

我是本机的新手，我在移动应用程序上工作，并且我的屏幕是可重用的组件。它由徽标，图像和另一个可重复使用的组件组成。我想将其固定在一个位置：徽标在顶部，图像在中心，组件在底部。我使用forceInset = {{{bottom：'never'}}}将所有内容包装在SafeAreView组件中，除了似乎固定在顶部的组件之外，其他一切都很好。我快疯了。

在两个图像包装在一个容器中而组件包装在另一个容器中的同时，我在justifyContent空间之间玩耍

import TextContainer from './TextBottomContainer';

export default class Screen extends React.Component {
  static navigationOptions = {
    header: null
  };

  render() {
    return (
      <SafeAreaView style={styles.SAV} forceInset={{ bottom: 'never' }}>
        <View style={{ justifyContent: 'center' }}>
          <View style={styles.container}>
            <Image
              style={styles.logo}
              source={require('../../assets/logo.png')}
            />
            <Image style={styles.img} source={this.props.mainImage} />
          </View>
          <TextContainer
            title={this.props.textTitleBottom}
            content={this.props.textContentBottom}
          />
        </View>
      </SafeAreaView>
    );
  }
}

const styles = StyleSheet.create({
  SAV: {
    flex: 1,
    justifyContent: 'space-between',
    backgroundColor: 'yellow'
  },
  container: {
    alignItems: 'center',
    backgroundColor: 'blue'
  },
  logo: {
    width: 181,
    height: 64,
    marginTop: 60,
    resizeMode: 'contain'
  },
  img: {
    width: 247,
    height: 192,
    resizeMode: 'contain',
    marginTop: 137
  }
});

我想要的是一个屏幕：徽标，图像，TextContainer。我所拥有的：TextContainer，位于其徽标后面和其图像下方。

在屏幕上放置项目时出现问题

0 个答案: