react-native#UIManager JavaScript Examples

The following examples show how to use react-native#UIManager. You can vote up the ones you like or vote down the ones you don't like, and go to the original project or source file by following the links above each example. You may check out the related API usage on the sidebar.
Example #1
Source File: index.js    From react-native-loop-game with MIT License 6 votes vote down vote up 
function App() {
  const timeout = setTimeout(initStatusbar, 100);

  if (UIManager.setLayoutAnimationEnabledExperimental) {
    UIManager.setLayoutAnimationEnabledExperimental(true);
  }

  initStatusbar();

  useEffect(() => () => {
    clearTimeout(timeout);
  });

  return (
    <ThemeContextProvider>
      <SettingsContextProvider>
        <Navigator onNavigationStateChange={onRouteChange} />
      </SettingsContextProvider>
    </ThemeContextProvider>
  );
}
Example #2
Source File: App.js    From react-native-nfc-rewriter with MIT License 6 votes vote down vote up 
constructor(props) {
    super();
    // explicitly create redux store
    // enable LayoutAnimation for Android
    if (
      Platform.OS === 'android' &&
      UIManager.setLayoutAnimationEnabledExperimental
    ) {
      UIManager.setLayoutAnimationEnabledExperimental(true);
    }
  }
Example #3
Source File: pull_view.rn.jsx    From taro-form with MIT License 4 votes vote down vote up 
componentDidMount() {
    const { side = 'bottom', overlayOpacity = 0.5 } = this.props
    const position = {}
    const { positionOther } = this.state
    if (process.env.TARO_ENV === 'rn') {
      // RN端动画
      setTimeout(() => {
        const handle = findNodeHandle(this.anRef)
        UIManager.measureInWindow(handle, (x, y, width, height) => {
          const { animationRoot } = this.state
          switch (side) {
            case 'left':
              position.top = 0
              position.bottom = 0
              positionOther.left = width
              break
            case 'right':
              position.top = 0
              position.bottom = 0
              positionOther.right = width
              break
            case 'top':
              position.left = 0
              position.right = 0
              positionOther.top = height
              break
            case 'bottom':
              position.left = 0
              position.right = 0
              positionOther.bottom = height
              break
          }

          this.setState({
            styleRn: StyleSheet.create({
              position,
              other: positionOther
            })
          })
          Animated.timing(
            animationRoot,
            {
              toValue: 1,
              duration: this.animatedTime,
              useNativeDriver: false
            }
          ).start()
        })
      }, 100)
    } else {
      // 小程序和h5动画
      this.animated = Taro.createAnimation({
        transformOrigin: "50% 50%",
        duration: this.animatedTime,
        timingFunction: "ease-out",
        delay: 0
      })
      this.query = Taro.createSelectorQuery().in(process.env.TARO_ENV === 'h5' ? this : this.$scope)
      this.query.select('.pull-view__main').boundingClientRect(res => {
        switch (side) {
          case 'left':
            position.top = 0
            position.bottom = 0
            positionOther.left = res.width + "px"
            break
          case 'right':
            position.top = 0
            position.bottom = 0
            positionOther.right = res.width + "px"
            break
          case 'top':
            position.left = 0
            position.right = 0
            positionOther.top = res.height + "px"
            break
          case 'bottom':
            position.left = 0
            position.right = 0
            positionOther.bottom = res.height + "px"
            break
        }
        this.setState({
          position,
          positionOther
        }, () => {
          this.setState({
            animationMain: this.animated[side](0).opacity(1).step().export(),
            animationRoot: this.animated.backgroundColor(`rgba(0, 0, 0, ${overlayOpacity})`).step().export()
          })
        })
      }).exec()
    }
  }