Project1

标题: 事件使用:高斯模糊(毛玻璃)效果简单实现 [打印本页]

作者: 日月星辰    时间: 2016-3-21 13:23
标题: 事件使用:高斯模糊(毛玻璃)效果简单实现
本帖最后由 日月星辰 于 2016-3-21 13:26 编辑

自己在制作时候正好用上。请教过别人,然后我自己把功能扩充了下。具体功能可见代码help
另外,由于保存图片在”事件“中,想要渐变,移动等功能只要使用 移动图片 即可实现。

JAVASCRIPT 代码复制下载
  1. /*:
  2. * @author 日月星辰
  3. * @plugindesc 屏幕截图&模糊 工具
  4. * @help
  5. * 1. 在事件中显示名为 snap 的图片即可获取全屏截图 (可随便放一张图片,推荐为空)
  6. * 2. 在事件中显示名为 blur 的图片即可获取全屏截图并模糊 (同上)
  7. * 3. 在事件中使用插件指令: blurPart x, y, w, h, opacity, id,
  8. *    即可获取区域截图并模糊,保存至id号图片
  9. *
  10. * @param blurLevel
  11. * @desc 模糊的等级,越高越糊,推荐范围[1,5],默认1
  12. * @default 1
  13. */
  14.  
  15. var params = PluginManager.parameters('SnapBlur');
  16.  
  17. var blurLevel = Number(params['blurLevel'] || 1);
  18.  
  19. var x;
  20. var y;
  21. var w;
  22. var h;
  23.  
  24. (function() {
  25. Sprite_Picture.prototype.loadBitmap = function() {
  26.   if (this._pictureName === "snap") {
  27.     this.bitmap = SceneManager.snap();
  28.   } else if (this._pictureName === "blur" ){
  29.     this.bitmap = SceneManager.snap();
  30.     for (var i = 0; i < blurLevel; i++)
  31.       this.bitmap.blur();
  32.   } else if (this._pictureName === "blurPart") {
  33.     this.bitmap = SceneManager.snap();
  34.     for (var i = 0; i < blurLevel; i++)
  35.       this.bitmap.blurArea(x, y, w, h);
  36.   } else {
  37.     this.bitmap = ImageManager.loadPicture(this._pictureName);
  38.   }
  39. };
  40. })();
  41.  
  42. var alias_command = Game_Interpreter.prototype.pluginCommand;
  43. Game_Interpreter.prototype.pluginCommand = function(command, args) {
  44.   alias_command.call(this, command, args);
  45.   if (command === 'blurPart') {
  46.     x = parseInt(args[0]);
  47.     y = parseInt(args[1]);
  48.     w = parseInt(args[2]);
  49.     h = parseInt(args[3]);
  50.  
  51.     var opacity = parseInt(args[4]);
  52.     var id = parseInt(args[5]);
  53.  
  54.     $gameScreen.showPicture(id, "blurPart" ,0, 0, 0, 100, 100, opacity, 0, x, w, y, h);
  55.   }
  56.   return true;
  57. };
  58.  
  59. Bitmap.prototype.blurArea = function(x, y, w, h) {
  60.     for (var i = 0; i < 2; i++) {
  61.         var canvas = this._canvas;
  62.         var context = this._context;
  63.         var tempCanvas = document.createElement('canvas');
  64.         var tempContext = tempCanvas.getContext('2d');
  65.         tempCanvas.width = w + 2;
  66.         tempCanvas.height = h + 2;
  67.         tempContext.drawImage(canvas, x, y, w, h, 1, 1, w, h);
  68.         tempContext.drawImage(canvas, x, y, w, 1, 1, 0, w, 1);
  69.         tempContext.drawImage(canvas, x, y, 1, h, 0, 1, 1, h);
  70.         tempContext.drawImage(canvas, x, h - 1, w, 1, 1, h + 1, w, 1);
  71.         tempContext.drawImage(canvas, w - 1, y, 1, h, w + 1, 1, 1, h);
  72.         context.save();
  73.         context.fillStyle = 'black';
  74.         context.fillRect(x, y, w, h);
  75.         context.globalCompositeOperation = 'lighter';
  76.         context.globalAlpha = 1 / 9;
  77.         for (var yy = 0; yy < 3; yy++) {
  78.             for (var xx = 0; xx < 3; xx++) {
  79.                 context.drawImage(tempCanvas, xx, yy, w, h, x, y, w, h);
  80.             }
  81.         }
  82.         context.restore();
  83.     }
  84.     this._setDirty();
  85. };


作者: 咖喱卡卡    时间: 2016-3-21 21:37
有效果图吗?




欢迎光临 Project1 (https://rpg.blue/) Powered by Discuz! X3.1