Skip to content
New issue

Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? # to your account

feat(ios): add “interactiveDismissModeEnabled” API #14103

Merged
merged 2 commits into from
Sep 16, 2024

Conversation

hansemannn
Copy link
Collaborator

@hansemannn hansemannn commented Sep 5, 2024

This PR adds the ability to dynamically close a window by using a swipe gesture across the whole window (not just the left edge).

Simulator.mp4

Examples

Navigation Window

const interactiveDismissModeEnabled = Ti.App.Properties.getBool('test_interactiveDismissModeEnabled', false);
let nav;

const label = Ti.UI.createLabel({ text: 'Interactive dismiss-mode enabled?' });
const toggle = Ti.UI.createSwitch({ left: 10, value: interactiveDismissModeEnabled });
toggle.addEventListener('change', () => {
	Ti.App.Properties.setBool('test_interactiveDismissModeEnabled', !interactiveDismissModeEnabled);
	Ti.App._restart(); // Quick hack to restart the app
});

const view = Ti.UI.createView({ height: 50, top: 80, layout: 'horizontal', width: Ti.UI.SIZE });
view.add([ label, toggle ]);

const rootWindow = Ti.UI.createWindow({ backgroundColor: 'white', title: 'Navigation Window' });
const rootBtn = Ti.UI.createButton({ title: 'Open child window' });
rootBtn.addEventListener('click', () => {
	const window = Ti.UI.createWindow({ backgroundColor: 'white', title: 'Child Window' });
	nav.openWindow(window);
});

rootWindow.add([ rootBtn, view ]);

nav = Ti.UI.createNavigationWindow({
	interactiveDismissModeEnabled, // <-- This does the magic
	window: rootWindow
});

nav.open();

Tab Group

const interactiveDismissModeEnabled = Ti.App.Properties.getBool('test_interactiveDismissModeEnabled', false);
let tabGroup;

const label = Ti.UI.createLabel({ text: 'Interactive dismiss-mode enabled?' });
const toggle = Ti.UI.createSwitch({ left: 10, value: interactiveDismissModeEnabled });
toggle.addEventListener('change', () => {
	Ti.App.Properties.setBool('test_interactiveDismissModeEnabled', !interactiveDismissModeEnabled);
	Ti.App._restart(); // Quick hack to restart the app
});

const view = Ti.UI.createView({ height: 50, top: 80, layout: 'horizontal', width: Ti.UI.SIZE });
view.add([ label, toggle ]);

const rootWindow = Ti.UI.createWindow({ backgroundColor: 'white', title: 'Window 1' });
const rootBtn = Ti.UI.createButton({ title: 'Open child window' });
rootBtn.addEventListener('click', () => {
	const window = Ti.UI.createWindow({ backgroundColor: 'white', title: 'Child Window' });
	tabGroup.activeTab.openWindow(window);
});

rootWindow.add([ rootBtn, view ]);

tabGroup = Ti.UI.createTabGroup({
	interactiveDismissModeEnabled, // <-- This does the magic
	tabs: [
		Ti.UI.createTab({ title: 'Tab 1', window: rootWindow })
	]
});

tabGroup.open();

To Do's

  • Add code changes
  • Add examples
  • Add docs

@hansemannn hansemannn merged commit 5baf6a1 into tidev:master Sep 16, 2024
6 checks passed
hansemannn added a commit that referenced this pull request Sep 16, 2024
* feat(ios): add “interactiveDismissModeEnabled” API

* chore: add docs
@hansemannn hansemannn deleted the feature/dynamic-swipe-to-close branch September 16, 2024 09:02
# for free to join this conversation on GitHub. Already have an account? # to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant