Работа с изображениями

При добавлении значков мы можем указать путь до изображения в формате PNG, JPEG или ICO:

icon: 'test.ico'

либо объект класса NativeImage:

icon: nativeImage.createFromPath(path.join(__dirname, 'test.ico'))

Чтобы воспользоваться вторым способом нужно предварительно импортировать объект nativeImage с помощью следующей инструкции:

const { nativeImage } = require('electron');

Создание объекта изображения

Создать объект изображения позволяют следующие методы объекта nativeImage:

  • createEmpty() — создает пустой объект изображения:
let img1 = nativeImage.createEmpty();
console.log( img1.getSize() ); // { width: 0, height: 0 }
  • createFromPath(<Путь>) — загружает изображение из файла и возвращает объект NativeImage. Можно загрузить изображения в форматах PNG, JPEG и ICO. Если путь не существует или формат не поддерживается, то метод вернет пустой объект. Пример загрузки изображения в формате PNG:
let img2 = nativeImage.createFromPath('test.png');
console.log( img2.getSize() ); // { width: 400, height: 300 }
  • createFromBitmap(<Buffer>, <Опции>) — в первом параметре указывается буфер с данными, возвращаемыми методом toBitmap(). Во втором параметре передается объект со свойствами width, height и scaleFactor:
let data1 = img2.toBitmap();
let img5 = nativeImage.createFromBitmap(data1, {
   width: 400, height: 300, scaleFactor: 1.0
});
console.log( img5.getSize() ); // { width: 400, height: 300 }
  • createFromBuffer(<Buffer>[, <Опции>]) — в первом параметре указывается буфер с данными в формате PNG или JPEG. Во втором параметре можно передать объект со свойствами width, height и scaleFactor:
let data2 = img2.toPNG();
let img6 = nativeImage.createFromBuffer(data2, {
   width: 400, height: 300, scaleFactor: 1.0
});
console.log( img6.getSize() ); // { width: 400, height: 300 }
  • createFromDataURL(<dataURL>) — создает объект NativeImage на основе URL с закодированными данными:
let data3 = img2.toDataURL();
let img7 = nativeImage.createFromDataURL(data3);
console.log( img7.getSize() ); // { width: 400, height: 300 }

Получение размеров изображения

Получить объект с размерами изображения позволяет метод getSize([<scaleFactor>]):

let img3 = nativeImage.createFromPath('photo.jpg');
console.log( img3.getSize() ); // { width: 500, height: 333 }

Метод isEmpty() возвращает значение true, если изображение пустое, и false — в противном случае:

console.log( img1.isEmpty() ); // true
console.log( img2.isEmpty() ); // false

Преобразование объекта в различные форматы

Преобразовать объект изображения в различные форматы позволяют следующие методы:

  • toPNG([<Опции>]) — возвращает объект Buffer, содержащий данные в формате PNG. Пример сохранения изображения в файл:
let data4 = img2.toPNG();
try {
   fs.writeFileSync('dataPNG.png', data4, {encoding: null});
} catch (e) {
   console.log(e);
}
  • toJPEG(<Качество>) — возвращает объект Buffer, содержащий данные в формате JPEG. В параметре указывается качество изображения в виде числа от 0 до 100. Пример сохранения изображения в файл:
let data5 = img3.toJPEG(100);
try {
   fs.writeFileSync('dataJPEG.jpg', data5, {encoding: null});
} catch (e) {
   console.log(e);
}
  • toBitmap([<Опции>]) — возвращает объект Buffer, содержащий копию сырых данных изображения:
console.log(img2.toBitmap());
// <Buffer 00 80 00 ff 00 80 00 ff ... 479950 more bytes>
  • getBitmap([<Опции>]) — возвращает ссылку на объект Buffer, содержащий сырые данные изображения. Данные при этом не копируются:
console.log(img2.getBitmap());
// <Buffer 00 80 00 ff 00 80 00 ff ... 479950 more bytes>
  • toDataURL([<Опции>]) — возвращает URL с закодированными данными изображения:
console.log(img2.toDataURL());
// data:image/png;base64,iVBORw0KGgoAAAANSUhE...

Обрезка изображения

Обрезать изображение позволяет метод crop(<Объект>). В качестве параметра указывается объект со свойствами x, y, width и height, описывающий обрезаемую область. Метод возвращает объект NativeImage. Пример:

let img8 = img3.crop({x: 200, y: 50, width: 300, height: 300});
try {
   fs.writeFileSync('dataPNG2.png', img8.toPNG(), {encoding: null});
} catch (e) {
   console.log(e);
}

Изменение размеров изображения

Изменить размеры изображения позволяет метод resize(<Опции>). В качестве параметра указывается объект со свойствами width (ширина), height (высота) и quality (качество). Если указана только ширина или только высота, то второй параметр рассчитывается с соблюдением соотношения сторон. В свойстве quality можно указать значения good, better или best (значение по умолчанию) в виде строки. Метод возвращает объект NativeImage. Пример:

let img9 = img3.resize({width: 250, quality: 'best'});
try {
   fs.writeFileSync('dataPNG3.png', img9.toPNG(), {encoding: null});
} catch (e) {
   console.log(e);
}

Учебник по Electron js
Учебник по Electron js в формате PDF

Помощь сайту

ЮMoney (Yandex-деньги): 410011140483022

ПАО Сбербанк:
Счет: 40817810855006152256
Реквизиты банка:
Наименование: СЕВЕРО-ЗАПАДНЫЙ БАНК ПАО СБЕРБАНК
Корреспондентский счет: 30101810500000000653
БИК: 044030653
КПП: 784243001
ОКПО: 09171401
ОКОНХ: 96130
Скриншот реквизитов