How to use the react-native-iphone-x-helper.getBottomSpace function in react-native-iphone-x-helper

To help you get started, we’ve selected a few react-native-iphone-x-helper examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github halilb / react-native-photo-browser / lib / bar / BarContainer.js View on Github external
const styles = StyleSheet.create({
  container: {
    position: 'absolute',
    left: 0,
    right: 0,
    borderBottomColor: 'rgba(0, 0, 0, 0.1)',
    borderBottomWidth: 1,
    backgroundColor: 'rgba(20, 20, 20, 0.5)',
  },
  topBar: {
    top: 0,
  },
  bottomBar: {
    bottom: 0,
    paddingBottom: getBottomSpace(),
  },
});

export {
  BarContainer,
  BAR_POSITIONS,
};
github halilb / react-native-photo-browser / lib / bar / BarContainer.js View on Github external
render() {
    const { style, position, children, height } = this.props;
    const isBottomBar = position === BAR_POSITIONS.BOTTOM;

    return (
      
      {children}
      
    );
  }
}
github wcandillon / can-it-be-done-in-react-native / season2 / spotify-player / components / BottomTab.tsx View on Github external
import React from "react";
import { Dimensions, SafeAreaView, StyleSheet } from "react-native";
import Animated from "react-native-reanimated";
import { PanGestureHandler, State } from "react-native-gesture-handler";
import { onGestureEvent } from "react-native-redash";
import { getBottomSpace } from "react-native-iphone-x-helper";

import { timing, withSpring } from "./AnimatedHelpers";
import TabIcon from "./TabIcon";
import Player from "./Player";
import MiniPlayer from "./MiniPlayer";

const { height } = Dimensions.get("window");
const TABBAR_HEIGHT = getBottomSpace() + 50;
const MINIMIZED_PLAYER_HEIGHT = 42;
const SNAP_TOP = 0;
const SNAP_BOTTOM = height - TABBAR_HEIGHT - MINIMIZED_PLAYER_HEIGHT;
const config = {
  damping: 15,
  mass: 1,
  stiffness: 150,
  overshootClamping: false,
  restSpeedThreshold: 0.1,
  restDisplacementThreshold: 0.1
};
const {
  Clock,
  Value,
  cond,
  useCode,
github Musicoin / app / components / Player.js View on Github external
}

  showAlert(title, text) {
    this.props.alertWithType('error', title, text);
  }

  _toggleTippingModal() {
    this.setState({isTippingModalVisible: !this.state.isTippingModalVisible});
  }
}

const styles = StyleSheet.create({
  smallPlayerContainer: {
    flexDirection: 'row',
    position: 'absolute',
    bottom: 49 + getBottomSpace(),
    left: 0,
    right: 0,
    ...Platform.select({
      ios: {
        shadowColor: 'black',
        shadowOffset: {height: -3},
        shadowOpacity: 0.1,
        shadowRadius: 3,
      },
      android: {
        elevation: 20,
      },
    }),
    alignItems: 'center',
    justifyContent: 'center',
    backgroundColor: '#34393F',
github just4fun / react-native-sticky-keyboard-accessory / src / index.js View on Github external
keyboardShow(e) {
    LayoutAnimation.easeInEaseOut();
    this.setState({
      bottom: isIphoneX() ? (e.endCoordinates.height - getBottomSpace()) : e.endCoordinates.height
    });
  }
github Musicoin / app / components / Player.js View on Github external
right: 0,
    ...Platform.select({
      ios: {
        shadowColor: 'black',
        shadowOffset: {height: -3},
        shadowOpacity: 0.1,
        shadowRadius: 3,
      },
      android: {
        elevation: 20,
      },
    }),
    backgroundColor: Colors.backgroundColor,
    paddingVertical: 10,
    paddingTop: getStatusBarHeight(true),
    paddingBottom: getBottomSpace(),
  },
  centerText: {
    justifyContent: 'center',
    alignItems: 'center',
  },
  optionsButton: {
    justifyContent: 'center',
  },
  modalButton: {
    margin: 16,
    flexDirection: 'row',
    alignItems: 'center',
  },
});

function mapStateToProps(state) {

react-native-iphone-x-helper

A library to help you design your react-native app for the iPhone X

MIT
Latest version published 4 years ago

Package Health Score

53 / 100
Full package analysis