1

我正在尝试构建一个简单的登录屏幕。但是，当我试图证明内容居中时，元素不会停止上下跳跃。. 如果我删除 flex 或 justifyContent 属性，它会停止跳跃。我的代码看起来像这样

export default class LoginScreen extends React.Component {

  render() {
    return (
      <View style={Styles.container} >
        <Text>Hello world</Text>
     </View>
  )}



let Styles = StyleSheet.create({
  container: {
    flex: 1,
    flexDirection: 'column',
    // padding: 15,
    // backgroundColor: 'red',
    justifyContent: 'center',
    alignItems: 'center',
  },
)

我的 App.js 看起来像这样

import { Platform } from 'react-native';
import { Navigation } from 'react-native-navigation';
import registerScreens from './app/Screens';

import {
  AppRegistry,
  Text,
} from 'react-native';
registerScreens();

let tabs = [
    {
      label: 'Login',
      screen: 'tasks.LoginScreen', // this is a registered name for a screen
      icon: require('./assets/account_circle.png'),
      // selectedIcon: require('../img/one_selected.png'), // iOS only
      title: 'Hello world'
    },
    {
      label: 'Two',
      screen: 'tasks.CreateUserScreen',
      icon: require('./assets/account_circle.png'),
      // selectedIcon: require('../img/two_selected.png'), // iOS only
      title: 'Screen Two'
    }
  ]

Navigation.startTabBasedApp({
  tabs,
  animationType: Platform.OS === 'ios' ? 'slide-down' : 'fade',
  tabsStyle: {
    tabBarBackgroundColor: '#003a66',
    tabBarButtonColor: '#ffffff',
    tabBarSelectedButtonColor: '#ff505c',
    tabFontFamily: 'BioRhyme-Bold',
  },
  appStyle: {
    tabBarBackgroundColor: '#003a66',
    navBarButtonColor: '#ffffff',
    tabBarButtonColor: '#ffffff',
    navBarTextColor: '#ffffff',
    tabBarSelectedButtonColor: '#ff505c',
    navigationBarColor: '#003a66',
    navBarBackgroundColor: '#003a66',
    statusBarColor: '#002b4c',
    tabFontFamily: 'BioRhyme-Bold',
  },
  drawer: {
    left: {
      screen: 'tasks.LoginScreen'
    }
  }
});
4

1 回答 1

0

在尝试在我自己的应用程序中解决这个问题之后，我已经到了唯一的解决方案是将 React-Native 从 0.50.x 降级到 0.49.x 的地步——至少，这就是我最终解决的问题。

于 2017-12-05T14:39:57.333 回答