Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

tabs 组件 android真机上关闭app重新打开后 高度自适应问题 #1296

Open
hwcncd opened this issue Apr 11, 2023 · 3 comments
Open

Comments

@hwcncd
Copy link

hwcncd commented Apr 11, 2023

Reproduction link

Edit on CodeSandbox

Steps to reproduce

android真机调试,关闭app后重新打开,底部有绿色横条

What is expected?

黑色view铺满

What is actually happening?

底部有绿色横条

Environment Info
antd 0.1.0
React 18.1.0,0.70.7
System android-13
Browser miui14.0.3

使用了@react-navigation/bottom-tabs 底部导航,在初始页打开之后底部导航占用过高高度,自适应调整后恢复正常,tabs的高度会刷新,但是里面的view高度少了一截

import React from 'react';
import {View, StyleSheet, Text} from 'react-native';
import {Tabs} from '@ant-design/react-native';
export default class ApprovalPendingListScreen extends React.Component {
constructor(props) {
super(props);
this.state = {
tabs: [{title: '已发起'}, {title: '待处理'}, {title: '已处理'}],
};
}
render() {
const {tabs} = this.state;
return (



Content of First Tab


Content of Second Tab


Content of Third Tab



);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: 'green'
},
tab:{
flex: 1,
backgroundColor: 'black'

},
});

@hwcncd
Copy link
Author

hwcncd commented Apr 11, 2023

import React from 'react';
import {View, StyleSheet, Text} from 'react-native';
import {Tabs} from '@ant-design/react-native';
export default class ApprovalPendingListScreen extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      tabs: [{title: '已发起'}, {title: '待处理'}, {title: '已处理'}],
    };
  }
  render() {
    const {tabs} = this.state;
    return (
      <View style={styles.container}>
        <Tabs tabs={tabs}>
          <View style={styles.tab}>
            <Text>Content of First Tab</Text>
          </View>
          <View style={styles.tab}>
            <Text>Content of Second Tab</Text>
          </View>
          <View style={styles.tab}>
            <Text>Content of Third Tab</Text>
          </View>
        </Tabs>
      </View>
    );
  }
}
const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: 'green'
  },
  tab:{
    flex: 1,
    backgroundColor: 'black'

  },
});

@hwcncd
Copy link
Author

hwcncd commented Apr 11, 2023

b6b289e1364086833dcd43ad30197233

@hwcncd
Copy link
Author

hwcncd commented Apr 11, 2023

打开app后第一个页面调用tabs才会出现

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants