UniFandora – Mini-Diashow (Bilder, GIFs, Videos)
(github.com/enarche-ahn)Ich möchte eine einfache Diashow-App vorstellen, die ich gebaut habe, weil ich sie selbst brauchte.
Wenn ich während der Arbeitswoche kurz einen Kaffee trinke, sehe ich mir gern in einer Ecke des Monitors GIFs von IU an.
Nachdem ich meinen Hauptrechner auf den Mac umgestellt hatte und es keine passende App gab, habe ich mit Hilfe von GPT kurzerhand selbst eine einfache gebaut.
Hier sind die ungefähren Hauptfunktionen der App.
- Diashow-Funktion
- Wiedergabe von Bildern (einschließlich GIFs) und Videos
- Videos können unabhängig von der Diashow-Zeit bis zum Ende abgespielt werden
- Anpassung der Fensterhöhe an das Seitenverhältnis des Bildes
- Zeitanzeige
- Automatische Updates
Ich poste das mal, falls jemand einen ähnlichen Geschmack hat wie ich.
Anfangs habe ich sie in Swift entwickelt, dann dachte ich mir, wenn schon, dann gleich Cross-Platform.
Ich habe zwischen Flutter und Electron überlegt und mich, da ich kein Mobile im Blick hatte, für Electron entschieden.
Bei der Entwicklung dieses Mal habe ich auch ein paar neue Dinge gelernt und teile sie nebenbei gleich mit.
github : https://github.com/enarche-ahn/unifandora-release
Automatische Updates
Ich nutze Electron zum ersten Mal.
Schon lange hatte ich viel Neugier, weil ich immer wieder gehört hatte, dass Visual Code mit Electron entwickelt wurde,
aber als ich es dann tatsächlich benutzt habe, war ich sofort begeistert.
Besonders überrascht hat mich, wie unglaublich einfach sich automatische Updates anbinden lassen.
Log-Ausgabe in der Shell
Normalerweise konnte ich Log-Meldungen zur Fehlersuche im Renderer nur im Entwicklermodus des Browsers sehen.
Ich habe GPT einfach mal gefragt, und prompt kam die perfekte Lösung.
Die Methode war viel einfacher und effizienter, als ich erwartet hatte, sodass ich richtig beeindruckt war.
(Vermutlich liegt es auch daran, dass ich lange nur Backend entwickelt habe und mich damit nicht gut auskannte ^^;)
Wenn man es wie unten ergänzt, wird console.log() aus [renderer.js] sauber in der Shell ausgegeben.
[main.js]
// Log messages received from renderer
ipcMain.on('renderer-log', (event, message) => {
console.log('Renderer Log:', message);
});
[preload.js]
contextBridge.exposeInMainWorld('electronAPI', {
sendLog: (message) => ipcRenderer.send('renderer-log', message)
});
[renderer.js]
// Override console.log to forward log messages to the main process.
(function() {
const originalConsoleLog = console.log;
console.log = function(...args) {
if (window.electronAPI && typeof window.electronAPI.sendLog === 'function') {
window.electronAPI.sendLog(args.join(' '));
}
originalConsoleLog.apply(console, args);
};
})();
window.addEventListener('DOMContentLoaded', () => {
...
console.log('Slideshow started...');
});
1 Kommentare
Derzeit habe ich nur die Windows-Version als Binärdatei hochgeladen.
Die macOS-Version ist noch nicht verfügbar, weil ich dem Apple Developer Program erneut beitreten muss ^^;;;
Wer sie vorerst benötigt, kann den Source herunterladen, bauen und verwenden~