0.0.6 • Published 4 years ago

@tototares/capacitor-dark-mode v0.0.6

Weekly downloads
-
License
MIT
Repository
github
Last release
4 years ago

Ionic Capacitor Dark Mode

For detailed tutorial on how to enable dark mode using this plugin visit: https://medium.com/@hinddeep.purohit007/supporting-dark-mode-in-ionic-capacitor-8e57fe9dbd47

Platforms Supported: Android, iOS, Electron and Web/PWA

This plugin can be used to monitor the changes made to system's dark mode.

Installation

npm install capacitor-dark-mode

Android Configuration:

Open MainActivity.java and add the following code inside this.init() add(DarkMode.class); Adding the above mentioned line will add the following import statement: import com.bkon.capacitor.DarkMode.DarkMode; If you encounter errors, please add both the lines manually to MainActivity.java

Import the Plugin in your app

Open app.component.ts file and import the plugin as follows: import { Plugins } from '@capacitor/core';

Listen for changes to Dark Mode:

Plugins.DarkMode.addListener("darkModeStateChanged", (state: any) => { if(state.isDarkModeOn) { // Dark mode is on. Apply dark theme to your app } else { // Dark mode is off. Apply light theme to your app } if(state.supported == false) { // Dark mode is not supported by the platform
}
});