This repository contains examples on UI/UX enhancements for an electron application based on our learning and research through various online articles.
Our sources include (but are not limited to) the following:
To get started, clone or download this repository.
If via SSH, use:
git clone [email protected]:hyperbridge/electron-sexykit.git
If using HTTPS, use:
git clone https://github.com/hyperbridge/electron-sexykit.git
This section describes the structure of this repository
Contains a list of directories each with a proof of concept of an enhancement in the aforementioned articles
This example demonstrates the change in the zoom factor of the window based on it being resized. To try it out, do the following:
cd examples/adjust-zoom-on-resize
npm install
npm start
When the app window loads up, resize it and watch what happens!
In the event of the application crashing because of uncaught exceptions or otherwise, we would like to let the user know through a modal and send crash reports to our server for analytics.
To demonstrate the basic functionality, do the following:
cd examples/adjust-zoom-on-resize
npm install
npm start
There are a few existing issues at the moment though. The package we are using doesn't seem to be sending the crash report to the server for some reason. In that case, we might need to detect the type of error, and send over the reports using POST requests to our servers. Have a look at the following GitHub issues surrounding the topic:
This example demonstrates the preservation of window state (size and position on relaunch):
cd examples/preserve-window-state
npm install
npm start
When the app window loads up, resize it and move it around. Close the app, and relaunch with npm start and see what happens!
This example demonstrates the progress bar on the taskbar icon to reflect progress on some task. For proof of concept, we are using the iteration variable of a for-loop as the progress metric:
cd examples/progress-bar
npm install
npm start
When the app window loads up, keep a close eye on the task bar and notice what happens!
This example demonstrates the functionality for a tray window. To demonstrate, do the following:
cd examples/tray
npm install
npm start
When the app window loads up, click on the pikachu icon on the task bar, and wait for a cute surprise!
This example demonstrates the ability of the app to block screenshots. To try it, do:
cd examples/block-screenshots
npm install
npm start
Whent the app loads, try to take a screenshot and see what happens!
Please review CONTRIBUTING.md for more details
Please stay tuned for more updates to this section