javascript/NativeScript
1
0
Fork 0
mirror of https://github.com/NativeScript/NativeScript.git synced 2025-11-05 13:26:48 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: interactive dismissal for shared element transitions

Browse Source
This commit is contained in:
Nathan Walker
2023-03-15 20:59:55 -07:00
parent 69f920995c
commit 393c3f0d97
8 changed files with 224 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
apps/toolbox/src/pages/transitions.ts
View File

@@ -27,6 +27,7 @@ export class TransitionsModel extends Observable {
openModal() {
page.showModal('pages/transitions/transitions-modal', {
transition: SharedTransition.custom(new ModalTransition(), {
interactiveDismissal: true,
toPageStart: {
y: 200,
duration: 1000,

2
apps/toolbox/src/pages/transitions/transitions-modal.xml
View File

@@ -8,7 +8,7 @@
<Label text="Opened Modal" verticalAlignment="top" marginTop="20" class="text-center" fontSize="28" color="black" />
<ContentView row="1" sharedTransitionTag="open-modal-box2" marginTop="20" width="75" height="75" borderRadius="37" backgroundColor="orange" />
<ContentView row="2" sharedTransitionTag="open-modal-box" marginTop="20" width="200" height="200" borderRadius="100" backgroundColor="purple" />
<ContentView row="2" sharedTransitionTag="open-modal-box1" marginTop="20" width="200" height="200" borderRadius="100" backgroundColor="purple" />
<ContentView row="2" sharedTransitionTag="open-modal-box3" marginTop="20" width="30" height="30" borderRadius="15" backgroundColor="red" horizontalAlignment="right" marginRight="50" />
<ContentView row="1" sharedTransitionTag="open-modal-box4" marginTop="20" width="30" height="30" borderRadius="15" backgroundColor="pink" horizontalAlignment="left" marginLeft="50" />
</GridLayout>