Project1

标题: 请问用blt画图时,以邻近的形式缩放 [打印本页]

作者: celica 时间: 2020-5-27 23:45
标题: 请问用blt画图时,以邻近的形式缩放
请问用bitmap.blt画图时,如何以邻近的形式缩放?
默认是会模糊化处理的, 我需要以像素形式的放大

作者: 白嫩白嫩的 时间: 2020-5-28 12:05
同求，希望大佬来解答，顺便给楼主点个赞，这是个好问题

作者: moonyoulove 时间: 2020-5-28 19:45
本帖最后由 moonyoulove 于 2020-5-28 19:46 编辑

这个不知道行不行，要不然用canvas的方法
https://developer.mozilla.org/zh-CN/docs/Web/API/CanvasRenderingContext2D/imageSmoothingEnabled

作者: celica 时间: 2020-6-5 01:31

moonyoulove 发表于 2020-5-28 19:45
这个不知道行不行，要不然用canvas的方法
https://developer.mozilla.org/zh-CN/docs/Web/API/CanvasRende ...

你好，抱歉这么晚才回。
我不太会用你说的这个。
对脚本的认识只会改造的水平。

@芯☆淡茹水

平滑似乎没什么用的样子

下面这个是需要的效果图

作者: lvashe 时间: 2020-6-5 06:44
the answer is : bitmap._context.imageSmoothingEnable = false;
Add it.

2020_06_05_06_30.png (241.53 KB, 下载次数: 11)

example

example

作者: chyj4747 时间: 2020-6-5 10:54
本帖最后由 chyj4747 于 2020-6-5 10:55 编辑

celica 发表于 2020-6-5 01:31
你好，抱歉这么晚才回。
我不太会用你说的这个。
对脚本的认识只会改造的水平。

用法：
bitmap.smooth = false;
用_smooth应该也没问题，但是会失去baseTexture的判断和设置

loadSystem函数有没有改过？默认是不做平滑处理的
内部是
this.loadBitmap('img/system/', filename, hue, false);
最后一个参数是否平滑，如果某个地方改成了true，那么你的icon本身就是平滑处理过的，也就是会模糊，即便你作为画板的bitmap没有平滑，但icon本身被平滑了那么画上去肯定也是模糊的

作者: celica 时间: 2020-6-5 17:41

lvashe 发表于 2020-6-5 06:44
the answer is : bitmap._context.imageSmoothingEnable = false;
Add it.

@chyj4747

没有效果，是不是和电脑系统有关？

作者: chyj4747 时间: 2020-6-5 19:30

celica 发表于 2020-6-5 17:41
@chyj4747

跟电脑肯定没关系

你做个简单的demo然后传上来吧，你自己写代码的话可以只传js上来，当然图片如果不是默认的也记得一起打包传上来

作者: celica 时间: 2020-6-5 19:55

chyj4747 发表于 2020-6-5 19:30
跟电脑肯定没关系

你做个简单的demo然后传上来吧，你自己写代码的话可以只传js上来，当然图片如果不是默 ...

Spriteset_Map.prototype.createLowerLayer = function() {
Spriteset_Base.prototype.createLowerLayer.call(this);
this.createParallax();
this.createTilemap();
this.createCharacters();
this.createShadow();
this.createDestination();
this.createWeather();
this.b = false;
this.icon = Bitmap.load(decodeURIComponent('img/system/IconSet.png'));
this.icon.smooth = false;
this.icon._context.imageSmoothingEnable = false;
this.a = new Sprite();
this.a.bitmap = new Bitmap(160, 160);
this.a.bitmap.smooth = false;
this.a.bitmap._context.imageSmoothingEnable = false;
this.a.bitmap.blt(this.icon, 64, 64, 32, 32, 0, 0, 160, 160);
this.addChild(this.a);
};
Spriteset_Map.prototype.update = function() {
Spriteset_Base.prototype.update.call(this);
this.updateTileset();
this.updateParallax();
this.updateTilemap();
this.updateShadow();
this.updateWeather();
if (!this.b && this.icon.isReady()) {
this.a.bitmap.blt(this.icon, 64, 64, 32, 32, 0, 0, 160, 160);
this.b = true;
}
};

复制代码

测试的，在我电脑上就是糊的。

作者: lvashe 时间: 2020-6-5 19:57

celica 发表于 2020-6-5 17:41
@chyj4747

this.icon =....
this.icon.smooth = ....(not necessary)
this.icon.context.....(not necessary)
var tempBitmap = new Bitmap(160,160)
tempBitmap._context.imageSmoothingEnable = false;
tempBitmap.blt(XXXXXXXXXXXXXXXXXX)
this.a = new Sprite(tempBitmap);

Try it :)

作者: celica 时间: 2020-6-5 20:24

lvashe 发表于 2020-6-5 19:57
this.icon =....
this.icon.smooth = ....(not necessary)
this.icon.context.....(not necessary)

Project1.zip (1.25 MB, 下载次数: 43)

in my computer

@chyj4747
传了工程文件，在我电脑上就是糊的

作者: celica 时间: 2020-6-5 21:11

lvashe 发表于 2020-6-5 19:57
this.icon =....
this.icon.smooth = ....(not necessary)
this.icon.context.....(not necessary)

在生成Sprite之前blt.
in my computer ... invalid

作者: lvashe 时间: 2020-6-5 21:35
本帖最后由 lvashe 于 2020-6-5 21:42 编辑

sorry , it's "enabled" not "enable" :(
it was my fault

作者: chyj4747 时间: 2020-6-5 22:29
本帖最后由 chyj4747 于 2020-6-5 22:35 编辑

celica 发表于 2020-6-5 19:55
测试的，在我电脑上就是糊的。

换了种做法，模糊估计是blt这个函数的内部处理，毕竟是把小尺寸图标画满大尺寸画布
个人推荐图片加载后直接添加到Sprite中，相当于sprite.bitmap = loadImage(....)，然后设置精灵的缩放，如果图片是图集，那么可以调用sprite的setFrame方法来设置显示区域
我自己的项目中一般blt是用来画背景的，所以糊不糊都一样，基本看不出来
另外，下面这种做法更简洁，blt需要等图片异步加载完成之后才能真的去绘制，不然画不出来，也就是需要在update中等待bitmap.isReady

Spriteset_Map.prototype.createLowerLayer = function() {
Spriteset_Base.prototype.createLowerLayer.call(this);
this.createParallax();
this.createTilemap();
this.createCharacters();
this.createShadow();
this.createDestination();
this.createWeather();
this.icon = ImageManager.loadBitmap('img/system/', 'IconSet', 0, false);
this.a = new Sprite(this.icon);
this.a.scale.set(4, 4);
this.a.setFrame(64, 64, 32, 32);
this.addChild(this.a);
};

复制代码

你或许是想把所有图片都画到一个sprite的bitmap上去，但其实没必要，完全可以分开

作者: celica 时间: 2020-6-5 22:38

chyj4747 发表于 2020-6-5 22:29
换了种做法，模糊估计是blt这个函数的内部处理，毕竟是把小尺寸图标画满大尺寸画布
个人推荐图片加载后直 ...

感谢帮助，
我主要是想制作卡片(bitmap)，重复的时候直接调用相同的卡就行，
这样会多出几个Sprite，不知道会不会有效率的影响（前代RGSS里sprite的多少影响还满大的）
我还是精简icon自己放大多做几张原图吧。

欢迎光临 Project1 (https://rpg.blue/)

Powered by Discuz! X3.1