react-native-drawer Swipe to close drawer

โดยปกติ Drawer ของเรามันจะต้องออกมาประมาณ เท่านี้ !!!

ตัวอย่างโค๊ด

<Drawer
type="overlay"
content={<ControlPanel />}
tapToClose={true}
openDrawerOffset={0.2}
panCloseMask={0.2}
styles={drawerStyles}
tweenHandler={(ratio) => ({
main: { opacity:(2-ratio)/2 }
})}
>
</Drawer>

แล้วถ้ามีคนอยากได้ แบบเต็มๆหน้าจอ แบบนี้หล่ะครับ

ถ้าเป็นแบบนี้ มันจะปิดยังไงอ่ะ คงต้องทำปุ่ม Close เพื่อปิดมัน หรือ ลากปัด เพื่อซ่อนมันเข้าไป

แต่ลากแล้วซ่อนมันทำยังไงหล่ะ ?

<Drawer
type="overlay"
content={<ControlPanel />}
tapToClose={true} <--- ลบออกไปด้วยนะ
openDrawerOffset={0.2} <-- ลบออกให้มันเต็มหน้าจอนะครับ
panCloseMask={0.80}
captureGestures={'closed'} <--- เพิ่มตัวนี้เข้ามาครับ
styles={drawerStyles}
tweenHandler={(ratio) => ({
main: { opacity:(2-ratio)/2 }
})}
>
</Drawer>

เท่านี้ ก็ปัด Drawer เก็บเข้าที่ๆ มันควรจะอยู่ได้แล้ว

ขอบคุณคับ 555555555555555

ผู้ค้นพบเจอ

หนูนุ้ย iApp

Ref.

https://github.com/root-two/react-native-drawer/issues/251