Files
jrshikoku/lib/stackOption.ts

48 lines
1.4 KiB
TypeScript

import { Platform } from "react-native";
import {
CardStyleInterpolators,
TransitionPresets,
} from "@react-navigation/stack";
import type { StackCardInterpolationProps } from "@react-navigation/stack";
/**
* Android用: モーダルのスライドアップはそのまま維持しつつ、
* 背景カードへのアニメーション(scale, borderRadius等)を無効化する。
* Android で背景カードのアニメーションが描画の乱れを引き起こすため。
*/
const forModalPresentationAndroid = (
props: StackCardInterpolationProps
) => {
const result = CardStyleInterpolators.forModalPresentationIOS(props);
// 背景カード(next が存在する)にはスタイル変更を適用しない
if (props.next) {
return {
cardStyle: {},
overlayStyle: result.overlayStyle,
};
}
return result;
};
export const optionData = {
gestureEnabled: true,
...(Platform.OS === "ios" ? TransitionPresets.ModalPresentationIOS : {}),
...(Platform.OS === "android" && {
animationEnabled: false,
cardStyleInterpolator: forModalPresentationAndroid,
}),
cardOverlayEnabled: true,
headerTransparent: true,
headerShown: false,
detachPreviousScreen: false,
};
export const pushTransitionOptions =
Platform.OS === "ios"
? TransitionPresets.SlideFromRightIOS
: {
animationEnabled: false,
};