How to use the react-native-redash.useTransition function in react-native-redash

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

github wcandillon / can-it-be-done-in-react-native / season2 / safari-tabs / components / Tabs.tsx View on Github external
export default ({ tabs: tabsProps }: TabsProps) => {
  const ref = useRef<TransitioningView>();
  const [tabs, setTabs] = useState([...tabsProps]);
  const [selectedTab, setSelectedTab] = useState(OVERVIEW);
  const transitionVal = useTransition(
    selectedTab,
    neq(selectedTab, OVERVIEW),
    eq(selectedTab, OVERVIEW),
    durationMs,
    easing
  );
  const { onGestureEvent, translateY } = useMemo(() => {
    const translationY = new Value(0);
    const velocityY = new Value(0);
    const state = new Value(State.UNDETERMINED);
    const translateY1 = limit(
      decay(translationY, state, velocityY),
      state,
      -tabsProps.length * 100,
      0
    );
github wcandillon / can-it-be-done-in-react-native / the-5-min / src / Accordion / List.tsx View on Github external
export default ({ list }: ListProps) => {
  const [open, setOpen] = useState(false);
  const transition = useTransition(
    open,
    not(bin(open)),
    bin(open),
    400,
    Easing.inOut(Easing.ease)
  );
  const height = bInterpolate(
    transition,
    0,
    LIST_ITEM_HEIGHT * list.items.length
  );
  const bottomRadius = interpolate(transition, {
    inputRange: [0, 16 / 400],
    outputRange: [8, 0]
  });
  return (