40 lines
1.1 KiB
TypeScript
40 lines
1.1 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,
|
||
...TransitionPresets.ModalPresentationIOS,
|
||
...(Platform.OS === "android" && {
|
||
cardStyleInterpolator: forModalPresentationAndroid,
|
||
}),
|
||
cardOverlayEnabled: true,
|
||
headerTransparent: true,
|
||
headerShown: false,
|
||
detachPreviousScreen: false,
|
||
};
|