Question

我使用Dark Room脚本来操作图像，我试图添加一个自定义插件，其中图像应该被反转，但我没有成功。

我的插件的代码是这个

function() {
    "use strict";
    var Flip = Darkroom.Transformation.extend({
        applyTransformation: function(canvas, img, next) {
            var ctx = canvas.getContext('2d');
            ctx.scale(-1, 1) //not flip, whyy??
        }
    });
    Darkroom.plugins.flip = Darkroom.Plugin.extend({
        initialize: function() {
            var buttonGroup = this.darkroom.toolbar.createButtonGroup(),
                flipButton = buttonGroup.createButton({
                    image: "flip"
                });
            flipButton.addEventListener("click", this.flip.bind(this))
        },
        flip: function() {
            this.darkroom.applyTransformation(new Flip())
        }
    })
}()

为什么不翻？我做错了什么？

Answer 1

您不需要使用画布上下文，因为基于FabricJS的暗室，您可以setFlipX获取图像：

var Flip = Darkroom.Transformation.extend({
  applyTransformation: function(canvas, image, next) {
    image.setFlipX(!image.getFlipX());
    // do not forget to call next()
    next();
  }
});

ctx.scale(-1, 1)只需更改matrix of translation并且不会更改任何其他内容。

使用画布，DarkRoom翻转图像

1 个答案: