扫描二维码关注官方公众号
返回列表
+ 发新帖
查看: 132|回复: 0

[转载发布] RPGMV完全透明化方案!定制属于你的桌面精灵!

[复制链接]
累计送礼:
0 个
累计收礼:
0 个
  • TA的每日心情
    开心
    2025-2-4 02:05
  • 签到天数: 110 天

    连续签到: 2 天

    [LV.6]常住居民II

    2327

    主题

    395

    回帖

    1万

    积分

    管理员

    Rank: 9Rank: 9Rank: 9

    VIP
    6
    卡币
    10465
    OK点
    16
    推广点
    0
    同能卷
    0
    积分
    13215

    灌水之王

    发表于 2024-11-22 14:16:37 | 显示全部楼层 |阅读模式
    本人一直有一个需求,就是能不能用RPGMV开发桌面精灵?我认为是可以的。但是有一个技术要点始终无法解决,那就是游戏透明化。
    如今,本人终于解决了这个问题。下面是实现方案。
    PS:该方案已经同步到我的教程中,详细请参考:https://rpg.blue/thread-493005-1-1.html
    qq交流群:529245311
    教程地址链接:https://klsdf.github.io/
    GitHub项目链接:https://github.com/klsdf/klsdf.github.io



    如果要让RPGMV完全透明,首先我们需要理解以下几个知识点:

    1. RPGMV是一个网页,因此想让他透明本质上是需要网页透明
    2. RPGMV运行在nwjs框架上,因此也需要让nwjs透明
    3. pixijs是控制RPGMV显示的动画库,同样会控制游戏的透明



    1. 因此,首先需要让rpgmv的html页面透明

       在index.html中,修改背景颜色为透明

      HTML 代码
    1. [/code]
    2. 2. 修改并增加package.json的配置,让html的透明能显示到桌面
    3. JAVASCRIPT 代码
    4. [code]"window": {
    5.        "frame": false,
    6.        "transparent": true
    7.      },
    复制代码

       frame可以取消游戏的框架,取消关闭按钮和最小化最大化按钮,这也是桌面精灵的基础。transparent可以让游戏框架透明。

    3. 修改pixi.js的源码

       ctrl+f,找到下面的代码


       _this._backgroundColorRgba[3] = _this.transparent ? 0 : 1;


       可以看到,虽然框架透明了,但是因为pixi也渲染了游戏,导致游戏还是没有透明。这个_backgroundColorRgba,前三个变量控制rgb,第三个控制alpha通道。

       所以我们要把这个代码修改为:


    JAVASCRIPT 代码
    1. _this._backgroundColorRgba[3] = 0;
    复制代码



       当然,也可以自定义小数,实现半透明

    4. 这样配置还是无法实现,透明。因为pixi.js在配置时,默认了禁止透明。所以还要开启透明配置。在RENDER_OPTIONS中,修改transparent为true

       ```js
        RENDER_OPTIONS: {
           transparent: true,
       ```

       如果配置加载还是不透明,可以强制修改透明度。

       ctrl+f找到下面的代码

       ```js
       _this.transparent = options.transparent
       ```

       修改为

       ```js
       _this.transparent = true;
       ```

    5. 此时游戏的标题界面已经透明了,但是游戏画面仍不透明,此时我们要注意,游戏的图块本身就不是透明的,为了测试。我们需要新建一个场景,里面什么都不要加。仅仅测试透明效果。

    6. 但是,这时候却发现,屏幕都是黑色。并没有透明。这是很正常的,查看源码发现Spriteset_Base中,this._blackScreen.opacity透明度默认为255。所以我们需要修改。

       ```
       this._blackScreen.opacity = 10;
       ```

       这个值同样是自定义的。

    7. 这时,我们发现,右键菜单,还是无法透明。这是因为Scene_MenuBase中,没有设置透明。查看源码发现Scene_MenuBase.prototype.createBackground时,没有默认透明,因此修改代码为:

       
    JAVASCRIPT 代码
    1. Scene_MenuBase.prototype.createBackground = function(){
    2.        this._backgroundSprite = new Sprite();
    3.        //闫修改,增加了这个
    4.        this._backgroundSprite.opacity = 0;
    5.        this._backgroundSprite.bitmap = SceneManager.backgroundBitmap();
    6.        this.addChild(this._backgroundSprite);
    7.    };
    复制代码

       

    8. 此时,游戏已经全部透明。如果画上图块没有透明,这是因为,图块素材本身也需要透明。

       此时只要远景图是透明的,图块是透明的,就可以完全透明化。


    剩下的就靠各位自由发挥了!






                本帖来自P1论坛作者klsdf,因Project1站服务器在国外有时候访问缓慢不方便作者交流学习,经联系P1站长fux2同意署名转载一起分享游戏制作经验,共同为国内独立游戏作者共同创造良好交流环境,原文地址:https://rpg.blue/forum.php?mod=viewthread&tid=493077  若有侵权,发帖作者可联系底部站长QQ在线咨询功能删除,谢谢。

    本帖子中包含更多资源

    您需要 登录 才可以下载或查看,没有账号?立即注册

    x
    天天去同能,天天有童年!
    回复 送礼论坛版权

    使用道具 举报

    文明发言,和谐互动
    文明发言,和谐互动
    高级模式
    您需要登录后才可以回帖 登录 | 立即注册

    本版积分规则

    关闭

    幸运抽奖

    社区每日抽奖来袭,快来试试你是欧皇还是非酋~

    立即查看

    聊天机器人
    Loading...

    QQ|Archiver|手机版|小黑屋|同能RPG制作大师 ( 沪ICP备12027754号-3 )

    GMT+8, 2025-3-10 12:12 , Processed in 0.115278 second(s), 54 queries .

    Powered by Discuz! X3.4

    Copyright © 2001-2020, Tencent Cloud.

    快速回复 返回顶部 返回列表