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

Layout position incorrect when placed in container view #20

Open
IjzerenHein opened this issue Aug 5, 2022 · 1 comment
Open

Layout position incorrect when placed in container view #20

IjzerenHein opened this issue Aug 5, 2022 · 1 comment
Assignees
Labels
bug Something isn't working

Comments

@IjzerenHein
Copy link
Contributor

IjzerenHein commented Aug 5, 2022

In certain layout setups, the THEOplayerView is not positioned correctly according to the flex-box styling rules.

example:

const App = () => {
  return (
    <View style={styles.container}>
      <Text style={styles.text}>
        Press enter to show the on-screen keyboard
      </Text>
      <TextInput style={styles.textInput} placeholderTextColor="#888888" />
      <THEOplayerView style={styles.video} config={CONFIG} source={SOURCE} />
    </View>
  );
};

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#333333',
  },
  text: {
    fontSize: 40,
    color: 'white',
    marginBottom: 20,
  },
  textInput: {
    width: 800,
    fontSize: 40,
    padding: 8,
  },
  video: {
    marginTop: 50,
    width: 640,
    height: 400,
  },
});

which produces the following layout:

note that the height of the video-player also appears clipped here

image

where you would expect:

image

I only tested this on tvOS

Repository containing the example and workaround:
https://github.com/IjzerenHein/ReactNativeTheoplayerKeyboardIssue

@tvanlaerhoven tvanlaerhoven added the bug Something isn't working label Aug 11, 2022
@wvanhaevre
Copy link
Collaborator

@IjzerenHein Is this still an issue for you? Or can this ticket be closed?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

3 participants