Закодированный в Base64 холст сохраняется как изображение другого размера с реагировать на нативный холст - PullRequest
0 голосов
/ 27 октября 2019

Я пытаюсь сохранить холст как изображение в формате png с помощью response-native-canvas и реагировать-native-fs . Используя кодировку base64, я успешно сохранил холст, но размер выходного изображения отличается от установленного мной размера холста.

Я установил размер холста 100x100, но размер выходного изображения равен 262x262. Я попытался с другими размерами, и в результате, любой размер холста преобразуется в изображение, размер которого примерно в 2,62 раза больше размера холста. (Например, изображение размером 2520x1417 создается из холста размером 960x540)

Как обработать холст, чтобы сохранить его в изображение правильного размера?

import React, { Component } from 'react';
import Canvas from 'react-native-canvas';
import * as RNFS from 'react-native-fs';

export default class CanvasScreen extends Component {
  handleCanvas = async (canvas) => {
    if (canvas !== null) {
      canvas.width = 100;
      canvas.height = 100;
      const ctx = canvas.getContext('2d');
      ctx.fillStyle = 'black';
      ctx.fillRect(0, 0, canvas.height, canvas.width);
      const dataUrl = await canvas.toDataURL();
      const imageData = dataUrl.replace(/data:image\/png;base64,/, '');
      await RNFS.writeFile('/sdcard/Download/test.png', imageData, 'base64');
      alert('Image saved.');
    }
  };

  render() {
    return <Canvas ref={this.handleCanvas} />;
  }
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...