MessageBox এবং OpenDialog এর মাধ্যমে ইউজার ইন্টারঅ্যাকশন

Electron এ নোটিফিকেশন এবং ডায়লগ বক্স - ইলেকট্রন  (Electron) - Web Development

317

Electron অ্যাপ্লিকেশনগুলোতে MessageBox এবং OpenDialog ব্যবহার করে ইউজারের সাথে ইন্টারঅ্যাকশন করা যায়। এই দুটি বৈশিষ্ট্য ব্যবহার করে আপনি ব্যবহারকারীর কাছে সতর্কতা, তথ্য, ফাইল নির্বাচন এবং অন্যান্য ইন্টারঅ্যাকটিভ ডায়ালগ শো করতে পারেন।

১. MessageBox

MessageBox সাধারণত উইন্ডোতে একটি পপ-আপ ডায়ালগ শো করতে ব্যবহৃত হয়, যা ব্যবহারকারীকে একটি বার্তা দেখায় এবং ব্যবহারকারীকে কোন সিদ্ধান্ত নিতে বলে, যেমন "OK" বা "Cancel"।

MessageBox ব্যবহার করার উপায়

MessageBox মূলত dialog মডিউল দ্বারা পরিচালিত হয়, যা Main Process-এ ব্যবহৃত হয়।

উদাহরণ: MessageBox ব্যবহার করে একটি বার্তা প্রদর্শন করা

Main Process (main.js):

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

let mainWindow;

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

  mainWindow.loadFile('index.html');

  // MessageBox এর মাধ্যমে একটি সতর্কবার্তা দেখানো
  dialog.showMessageBox(mainWindow, {
    type: 'warning',    // বার্তার ধরন (warning, error, info, etc.)
    buttons: ['OK', 'Cancel'], // বার্তার জন্য বাটন
    title: 'Warning',  // বার্তার শিরোনাম
    message: 'Are you sure you want to exit?', // বার্তা
  }).then(result => {
    if (result.response === 0) {  // যদি 'OK' বাটন ক্লিক করা হয়
      app.quit();  // অ্যাপ বন্ধ হবে
    } else {
      console.log('User canceled the action');
    }
  });
});

এই কোডে, dialog.showMessageBox() ব্যবহার করে MessageBox তৈরি করা হচ্ছে, যা একটি সতর্কতা বার্তা দেখাবে এবং ব্যবহারকারী যদি OK ক্লিক করে, অ্যাপটি বন্ধ হয়ে যাবে।


২. OpenDialog

OpenDialog ব্যবহার করে আপনি ব্যবহারকারীকে ফাইল নির্বাচন করার জন্য একটি ডায়ালগ খুলতে পারেন। এটি ব্যবহারকারীদের ফাইল সিস্টেম থেকে ফাইল নির্বাচন করতে সাহায্য করে।

OpenDialog ব্যবহার করার উপায়

OpenDialog সাধারণত dialog.showOpenDialog() ফাংশন দ্বারা ব্যবহৃত হয়, যা ব্যবহারকারীর কাছে ফাইল নির্বাচন ডায়ালগ শো করে।

উদাহরণ: OpenDialog ব্যবহার করে ফাইল নির্বাচন করা

Main Process (main.js):

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

let mainWindow;

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

  mainWindow.loadFile('index.html');

  // OpenDialog এর মাধ্যমে ফাইল নির্বাচন করা
  dialog.showOpenDialog(mainWindow, {
    title: 'Select a File',    // ডায়ালগের শিরোনাম
    defaultPath: '/home/user', // ডিফল্ট পাথ
    filters: [                // ফাইল টাইপ ফিল্টার
      { name: 'Text Files', extensions: ['txt'] },
      { name: 'All Files', extensions: ['*'] }
    ],
    properties: ['openFile']  // ফাইল নির্বাচনের জন্য
  }).then(result => {
    if (!result.canceled) {
      console.log('Selected file:', result.filePaths[0]); // নির্বাচিত ফাইলের পাথ দেখানো
    } else {
      console.log('User canceled the file selection');
    }
  });
});

এখানে, dialog.showOpenDialog() ব্যবহার করে একটি ফাইল নির্বাচন ডায়ালগ শো করা হয়েছে। ব্যবহারকারী যখন একটি ফাইল নির্বাচন করবে, তার পাথ result.filePaths[0] দ্বারা পাওয়া যাবে। এছাড়া, ব্যবহারকারী যদি ডায়ালগ বন্ধ করে দেয়, তবে canceled ফ্ল্যাগটি true হবে।


৩. MessageBox এবং OpenDialog এর মধ্যে পার্থক্য

বৈশিষ্ট্যMessageBoxOpenDialog
প্রকারবার্তা দেখানোর জন্য ব্যবহৃত (যেমন সতর্কতা, ত্রুটি, ইত্যাদি)ফাইল সিলেকশন ডায়ালগ শো করার জন্য ব্যবহৃত
ব্যবহারব্যবহারকারীকে একটি বার্তা বা সিদ্ধান্ত নেওয়ার জন্য জিজ্ঞাসা করাব্যবহারকারীকে ফাইল নির্বাচন করতে বলা
ফাংশনdialog.showMessageBox()dialog.showOpenDialog()
প্রতিক্রিয়াresponse (যেমন 'OK', 'Cancel')filePaths (নির্বাচিত ফাইলের পাথ)

৪. অন্য Dialog ফিচার

ইলেকট্রন dialog মডিউলে আরো কিছু উপকারি ফাংশন রয়েছে, যেমন:

  • SaveDialog: ব্যবহারকারীকে ফাইল সংরক্ষণের জন্য ডায়ালগ শো করে।

SaveDialog উদাহরণ:

dialog.showSaveDialog(mainWindow, {
  title: 'Save File',
  defaultPath: '/home/user/untitled.txt',
}).then(result => {
  if (!result.canceled) {
    console.log('Saved file path:', result.filePath);
  }
});
  • MessageBox এর অন্যান্য ধরনের বার্তা:
    • info: সাধারণ তথ্য বার্তা।
    • error: ত্রুটি বার্তা।
    • question: প্রশ্ন সাপেক্ষ বার্তা।

MessageBox এর অন্যান্য ধরনের উদাহরণ:

dialog.showMessageBox(mainWindow, {
  type: 'info',   // তথ্য বার্তা
  message: 'This is an info message'
});

সারাংশ

  • MessageBox এবং OpenDialog ইলেকট্রনে ইউজার ইন্টারঅ্যাকশন তৈরি করার শক্তিশালী টুল।
  • MessageBox ব্যবহার করে আপনি পপ-আপ বার্তা বা সতর্কতামূলক ডায়ালগ তৈরি করতে পারেন।
  • OpenDialog ব্যবহার করে আপনি ফাইল নির্বাচন করার জন্য ডায়ালগ শো করতে পারেন।
  • আপনি SaveDialog, MessageBox এর বিভিন্ন ধরনের, এবং OpenDialog এর অন্যান্য প্যারামিটারগুলো ব্যবহার করে আরও উন্নত ইন্টারঅ্যাকশন তৈরি করতে পারবেন।
Content added By
Promotion

Are you sure to start over?

Loading...