ইলেক্ট্রন / অ্যাটম শেল অ্যাপের জন্য কীভাবে অ্যাপ আইকন সেট করবেন

Question

আপনি কীভাবে আপনার ইলেক্ট্রন অ্যাপের জন্য অ্যাপ্লিকেশন আইকনটি সেট করবেন?

আমি চেষ্টা করছি BrowserWindow({icon:'path/to/image.png'});কিন্তু কাজ করে না।

এর প্রভাব দেখতে আমার কি অ্যাপটি প্যাক করা দরকার?

Comments

আপনি github.com/onmyway133/blog/issues/66

— onmyway133

ম্যাকের জন্য আপনি যে জিনিসটি করতে পারেন তা হ'ল postinstallআপনার প্রকল্পে একটি স্ক্রিপ্ট স্থাপন করা হবে যা নোড_মডিউলগুলি / স্বয়ংক্রিয়ভাবে নিজের জায়গায় .icns ফাইলটি অনুলিপি করবে।

— থেরাম

Answer 1

একমাত্র iconতৈরি করার সময় সম্পত্তি সেট করার BrowserWindowএকটি প্রভাব উইন্ডোজ এবং লিনাক্সে।

ওএস এক্স - এ আইকনটি সেট করতে, আপনি ইলেক্ট্রন-প্যাকেজার ব্যবহার করতে --iconপারেন এবং স্যুইচটি ব্যবহার করে আইকনটি সেট করতে পারেন।

এটি ওএস এক্সের জন্য .icns ফর্ম্যাটে থাকা দরকার There একটি অনলাইন আইকন রূপান্তরকারী রয়েছে যা আপনার .png থেকে এই ফাইলটি তৈরি করতে পারে।

Comments

ব্রাউজার উইন্ডোতে একটি .PNG ফাইলে আইকনটি সেট করা উইন্ডোতে টাস্কবারে প্রদর্শিত হবে। এটির কাজ করার একটি উদাহরণ এখানে আমার ব্লগে পাওয়া যাবে: myLiveforthecode.com/… এটি হতে পারে যে আমি __dirname + 'पथ / থেকে / আইকন.পিএনজি' তে সেট করেছিলাম তাই কাজ করার জন্য পথটি নিখুঁত হওয়া দরকার। তবে .exe এর জন্য আইকনটি সেট করতে আপনাকে বৈদ্যুতিন-প্যাকেজর বা সংস্থান হ্যাকার ব্যবহার করতে হবে।

— শন রাকোভস্কি

উইন্ডোজ দয়া করে সঠিক উত্তরটি এই উত্তরটি ঠিক করতে পারেন?

— আনা বেটস

ধন্যবাদ @ শ্যাশনাকাকোস্কি, আপনি ঠিক বলেছেন - আমি এই মাত্র পরীক্ষা করেছি এবং আইকন সম্পত্তিটি উইন্ডোতেও সত্যই কাজ করে। আমি এই প্রতিফলিত করতে আমার উত্তর আপডেট করেছি।

— অ্যালেক্স ওয়ারেন

এটি প্রথমে কাজ করেছিল, তবে তারপরে আমি আমার বন্ধুর কাছে বিতরণযোগ্য অ্যাপটি পাঠিয়েছিলাম এবং এটি কার্যকর হয়নি! কোন ধারনা?

— চেত

@Nick আপনি নিচের মত কিছু একটা করতে হবেelectron-packager . YourApplicationName --all --icon "path/to/my/icon.ico"

— মাতিও

Answer 2

নীচে আমার কাছে সমাধান রয়েছে:

mainWindow = new BrowserWindow({width: 800, height: 600,icon: __dirname + '/Bluetooth.ico'});

Comments

__Dirname আপনার / src / ফোল্ডারের পথ (অর্থাত আপনার app.js / main.js ফাইলের ফোল্ডার) এর উল্লেখযোগ্য।

— কনস্টান্টিন

.icnsকোন দরকার নেই ?

— ishandutt2007

Answer 3

আপনি এটি ম্যাকওএসের জন্যও করতে পারেন। ঠিক আছে, কোডের মাধ্যমে নয়, কিছু সাধারণ পদক্ষেপ সহ:

1. আপনি যে আইকন ফাইলটি ব্যবহার করতে চান তা সন্ধান করুন, এটি খুলুন এবং সম্পাদনা মেনুটির মাধ্যমে এটি অনুলিপি করুন
2. সাধারণত নোড_মডিউল / ইলেক্ট্রন / ডিস্টে ইলেক্ট্রন.এপ সন্ধান করুন
3. তথ্য উইন্ডো খুলুন
4. উপরের বাম কোণে আইকনটি নির্বাচন করুন (এর চারদিকে ধূসর সীমানা)
5. Cmd + v এর মাধ্যমে আইকনটি আটকান
6. উন্নয়নের সময় আপনার আইকনটি উপভোগ করুন :-)

আসলে এটি একটি সাধারণ জিনিস যা ইলেক্ট্রনের সাথে নির্দিষ্ট নয়। আপনি এই জাতীয় অনেক ম্যাকস অ্যাপ্লিকেশনগুলির আইকন পরিবর্তন করতে পারেন।

Comments

এটি আশ্চর্যজনক, এর জন্য আপনাকে ধন্যবাদ। এটি কাজ করতে আমার কাছে টানতে এবং ফেলে দেওয়ার দরকার পড়েছিল তবে তা সত্ত্বেও আশ্চর্য।

— রবার্ট ম্যাসেন

সম্পূর্ণ নির্দেশাবলী: সমর্থন.

— apple.com/kb/PH25383?locale=en_US

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

— ডেভ

@ ডেভ আসলে তিনি বলেছিলেন6. Enjoy your icon during *development* :-)

— মিয়া

ভাল ছেলেরা ... আমি জানি ... তবে এই ফিক্সটি 2 বছরেরও বেশি পুরানো ... ;-) এবং বিটিডব্লিউ। আপনার এই "হ্যাক" টিও একটি চূড়ান্ত বিল্ডে ব্যবহার করতে সক্ষম হওয়া উচিত, যেহেতু আপনি কেবল এটিকে ডিপ অ্যাপ্লিকেশনটিতে পরিবর্তন করেন ... কিছুক্ষণ চেষ্টা করেননি .. এবং কে জানেন যে সম্ভবত কোনও সরকারী উপায় আছে, এখন ... ;-)

— অ্যালেক্সারজ

Answer 4

আপডেট করা প্যাকেজ.জসন:

"build": {
  "appId": "com.my-website.my-app",
  "productName": "MyApp",
  "copyright": "Copyright © 2019 ${author}",
  "mac": {
    "icon": "./public/icons/mac/icon.icns",     <---------- set Mac Icons
    "category": "public.app-category.utilities"
  },
  "win": {
    "icon": "./public/icons/png/256x256.png" <---------- set Win Icon
  },
  "files": [
    "./build/**/*",
    "./dist/**/*",
    "./node_modules/**/*",
    "./public/**/*",       <---------- need for get access to icons
    "*.js"
  ],
  "directories": {
    "buildResources": "public" <---------- folder where placed icons
  }
},

বিল্ড অ্যাপ্লিকেশন পরে আপনি আইকন দেখতে পারেন। এই সমাধানটি বিকাশকারী মোডে আইকনগুলি দেখায় না। আমি আইকন সেট আপ না new BrowserWindow()।

Answer 5

ইলেক্ট্রন নির্মাতারা আইকনগুলিকে সমর্থন করে

Answer 6

আপনি যদি টাস্কবারে অ্যাপ্লিকেশন আইকনটি আপডেট করতে চান, তবে মেইন.জেএস-এ নিম্নলিখিত আপডেট করুন (যদি টাইপস্ক্রিপ্ট ব্যবহার করে থাকেন তবে মেইন.টিস)

win.setIcon(path.join(__dirname, '/src/assets/logo-small.png'));

__dirnamepackage.jsonআপনার অ্যাপ্লিকেশনটির রুট ডিরেক্টরিতে (একই ডিরেক্টরি ) নির্দেশ করে।

Comments

ম্যাক সম্পর্কে নিশ্চিত?

— অনিল 8753

Answer 7

দয়া করে সচেতন হন যে আইকন ফাইল পাথের উদাহরণগুলি ধরে নিতে পারে যে মেইন.জেগুলি বেস ডিরেক্টরিের অধীনে রয়েছে। ফাইলটি যদি অ্যাপ্লিকেশনের বেস ডিরেক্টরিতে না থাকে তবে পাথের স্পেসিফিকেশনটিকে অবশ্যই সেই তথ্যের জন্য অ্যাকাউন্ট করতে হবে।

উদাহরণস্বরূপ, যদি মেইন.জেগুলি এসআরসি / সাব ডিরেক্টরিতে থাকে এবং আইকনটি সম্পদ / আইকন / এর অধীনে থাকে তবে এই আইকন পাথের স্পেসিফিকেশন কাজ করবে:

icon: __dirname + "../assets/icons/icon.png"

Answer 8

ইলেক্ট্রন-প্যাকেজ

---

BrowserWindowএকমাত্র তৈরি করার সময় আইকন সম্পত্তি সেট করার ফলে উইন্ডোজ এবং লিনাক্স প্ল্যাটফর্মগুলিতে প্রভাব পড়ে। আপনাকে সর্বোচ্চ .icns প্যাকেজ করতে হবে

ওএস এক্স ব্যবহার electron-packagerকরে আইকনটি সেট করতে, - আইকন স্যুইচ ব্যবহার করে আইকনটি সেট করুন।

এটি ওএস এক্সের জন্য .icns ফর্ম্যাটে থাকা দরকার There একটি অনলাইন আইকন রূপান্তরকারী রয়েছে যা আপনার .png থেকে এই ফাইলটি তৈরি করতে পারে।

ইলেক্ট্রন-রচয়িতা

---

সাম্প্রতিকতম সমাধান হিসাবে আমি --iconস্যুইচ ব্যবহারের বিকল্প খুঁজে পেয়েছি । আপনি যা করতে পারেন তা এখানে।

1. buildআপনার প্রকল্প ডিরেক্টরিতে নামের একটি ডিরেক্টরি তৈরি করুন এবং .icnsআইকনটিকে ডিরেক্টরিতে ডিরেক্টরিতে রেখে দিন icon.icns।
2. কমান্ড কার্যকর করে বিল্ডার চালান electron-builder --dir।

আপনি দেখতে পাবেন যে আপনার অ্যাপ্লিকেশন আইকনটি সেই ডিরেক্টরি থেকে স্বয়ংক্রিয়ভাবে নেওয়া হবে এবং প্যাকেজিংয়ের সময় কোনও অ্যাপ্লিকেশনের জন্য ব্যবহৃত হবে।

দ্রষ্টব্য : প্রদত্ত উত্তরটি electron-builderইলেক্ট্রন-নির্মাতা v21.2.0 এর সাম্প্রতিক সংস্করণের এবং পরীক্ষিত