Skip to content

[Android] Different shadow length in landscape and portrait view (elevation) #18545

Closed
@scriptum

Description

@scriptum

Environment

$ react-native info

  React Native Environment Info:
    System:
      OS: Linux 4.14 Mageia 6
      CPU: x64 AMD Ryzen 7 2700X Eight-Core Processor
      Memory: 533.61 MB / 15.66 GB
      Shell: 4.3.48 - /bin/bash
    Binaries:
      Node: 8.12.0 - ~/.npm-global/bin/node
      Yarn: 1.10.1 - ~/.npm-global/bin/yarn
      npm: 6.0.1 - ~/.npm-global/bin/npm
    SDKs:
      Android SDK:
        Build Tools: 27.0.3, 28.0.2, 28.0.3
        API Levels: 23, 24, 27, 28
    npmPackages:
      react: 16.6.0-alpha.8af6728 => 16.6.0-alpha.8af6728 
      react-native: 0.57.3 => 0.57.3 
    npmGlobalPackages:
      react-native-cli: 2.0.1

Steps to Reproduce

  1. Start new application
  2. Add bottom bar with elevation
  3. Run on Android (5+)
  4. Rotate phone
import React from 'react';
import { StyleSheet, Text, View } from 'react-native';

export default class App extends React.Component {
  render() {
    return (
      <View style={styles.container}>
        <Text>Open up App.js to start working on your app!</Text>
        <Text>Changes you make will automatically reload.</Text>
        <Text>Shake your phone to open the developer menu.</Text>
        <View style={styles.tabBar}>
          <Text>Test</Text>
        </View>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
  tabBar: {
    flex: 1,
    backgroundColor: '#fff',
    position: "absolute",
    bottom: 0,
    height: 56,
    elevation: 8,
    width: "100%",
    alignItems: 'center',
    justifyContent: 'center',
    opacity: 1
  },
});

Expected Behavior

Pretty shadows

Actual Behavior

Different shadows

photo_2018-03-24_22-33-32
photo_2018-03-24_22-33-36

Metadata

Metadata

Assignees

No one assigned

    Labels

    BugPlatform: AndroidAndroid applications.Platform: LinuxBuilding on Linux.StaleThere has been a lack of activity on this issue and it may be closed soon.

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions