/** * Copyright (c) 2013-present, Facebook, Inc. * All rights reserved. * * This source code is licensed under the BSD-style license found in the * LICENSE file in the root directory of this source tree. An additional grant * of patent rights can be found in the PATENTS file in the same directory. * * Facebook, Inc. ("Facebook") owns all right, title and interest, including * all intellectual property and other proprietary rights, in and to the React * Native CustomComponents software (the "Software"). Subject to your * compliance with these terms, you are hereby granted a non-exclusive, * worldwide, royalty-free copyright license to (1) use and copy the Software; * and (2) reproduce and distribute the Software as part of your own software * ("Your Software"). Facebook reserves all rights not expressly granted to * you in this license agreement. * * THE SOFTWARE AND DOCUMENTATION, IF ANY, ARE PROVIDED "AS IS" AND ANY EXPRESS * OR IMPLIED WARRANTIES (INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES * OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE) ARE DISCLAIMED. * IN NO EVENT SHALL FACEBOOK OR ITS AFFILIATES, OFFICERS, DIRECTORS OR * EMPLOYEES BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, * EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, * PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; * OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, * WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR * OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THE SOFTWARE, EVEN IF * ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. * * @providesModule NavigationCardStackStyleInterpolator * @flow */ 'use strict'; import type { NavigationSceneRendererProps, } from 'NavigationTypeDefinition'; /** * Utility that builds the style for the card in the cards stack. * * +------------+ * +-+ | * +-+ | | * | | | | * | | | Focused | * | | | Card | * | | | | * +-+ | | * +-+ | * +------------+ */ /** * Render the initial style when the initial layout isn't measured yet. */ function forInitial(props: NavigationSceneRendererProps): Object { const { navigationState, scene, } = props; const focused = navigationState.index === scene.index; const opacity = focused ? 1 : 0; // If not focused, move the scene to the far away. const translate = focused ? 0 : 1000000; return { opacity, transform: [ { translateX: translate }, { translateY: translate }, ], }; } function forHorizontal(props: NavigationSceneRendererProps): Object { const { layout, position, scene, } = props; if (!layout.isMeasured) { return forInitial(props); } const index = scene.index; const inputRange = [index - 1, index, index + 1]; const width = layout.initWidth; const opacity = position.interpolate({ inputRange, outputRange: ([1, 1, 0.3]: Array), }); const scale = position.interpolate({ inputRange, outputRange: ([1, 1, 0.95]: Array), }); const translateY = 0; const translateX = position.interpolate({ inputRange, outputRange: ([width, 0, -10]: Array), }); return { opacity, transform: [ { scale }, { translateX }, { translateY }, ], }; } function forVertical(props: NavigationSceneRendererProps): Object { const { layout, position, scene, } = props; if (!layout.isMeasured) { return forInitial(props); } const index = scene.index; const inputRange = [index - 1, index, index + 1]; const height = layout.initHeight; const opacity = position.interpolate({ inputRange, outputRange: ([1, 1, 0.3]: Array), }); const scale = position.interpolate({ inputRange, outputRange: ([1, 1, 0.95]: Array), }); const translateX = 0; const translateY = position.interpolate({ inputRange, outputRange: ([height, 0, -10]: Array), }); return { opacity, transform: [ { scale }, { translateX }, { translateY }, ], }; } module.exports = { forHorizontal, forVertical, };