Electron ile Native Dialog Kullanımı

Electron Nedir?

Electron, web teknolojilerini kullanarak masaüstü uygulamaları geliştirmek için kullanılan bir framework'tür. HTML, CSS ve JavaScript kullanarak platformlar arası uygulamalar oluşturmanıza olanak sağlar. Electron, Chromium ve Node.js'i birleştirerek, geliştiricilere web uygulamalarının zengin özelliklerini masaüstü deneyimine taşımaktadır.

Native Dialog Nedir?

Native Dialog, işletim sisteminin yerel kullanıcı arayüzü bileşenlerini kullanarak dosya açma, kaydetme veya seçim gibi temel etkileşimler sağlar. Bu, kullanıcıların uygulama ile doğal bir şekilde etkileşim kurmasına olanak tanır. Electron, bu özellikleri kullanarak geliştiricilerin uygulamalarında standart diyalog pencereleri oluşturmasını sağlar.

Electron ile Native Dialog Kullanımı

Electron'da Native Dialog kullanmak oldukça basittir. 'dialog' modülünü kullanarak yerel diyalog pencerelerini açabiliriz. Aşağıdaki adımlar bu süreci açıklamaktadır.

Gerekli Modülün Yüklenmesi

İlk olarak, Electron uygulamanızda 'dialog' modülünü tanımlamanız gerekir. Bu modül, Electron'un ana sürecinde kullanılabilir. Aşağıdaki gibi tanımlama yapabilirsiniz:

const { app, BrowserWindow, dialog } = require('electron');

Basit Bir Dosya Açma Diyaloğu Oluşturma

Şimdi, basit bir dosya açma diyalog penceresi oluşturmak için aşağıdaki kodu kullanabilirsiniz:

app.on('ready', () => {
  let mainWindow = new BrowserWindow({ width: 800, height: 600 });

  dialog.showOpenDialog(mainWindow, {
    properties: ['openFile', 'openDirectory']
  }).then(result => {
    console.log('Selected file:', result.filePaths);
  }).catch(err => {
    console.log(err);
  });
});

Sonuç

Electron ile Native Dialog kullanımı, masaüstü uygulamalarınıza etkileşim eklemek için güçlü bir yöntemdir. Kullanıcıların veri girmesine veya seçim yapmasına olanak tanıyarak, uygulama deneyimini zenginleştirir. Yukarıdaki örnekleri izleyerek hızlıca kendi uygulamanızda Native Dialog kullanmaya başlayabilirsiniz.