微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

从数组创建网格并设置颜色

如何解决从数组创建网格并设置颜色

我需要为颜色选择器从 250 种颜色的数组中创建一个网格。 网格布局示例:

Iterable
  • 已经有效:创建网格并设置按钮的颜色。

  • 什么不起作用:颜色正确顺序

Phaser 3 / JavaScript 代码

xxxxx 
xxxxx 
xxxxx
...

如何按照预定义的顺序为网格上的按钮设置颜色?

解决方法

代码有几个问题

  • Javascript 数组从 0 开始,因此 for 循环从 1 开始 遗漏了一些条目。

  • xGrid 值每次都增加 1,但之后只是
    添加到 yGrid 以获取位置,它需要是 xGrid*6 以便 正确地从 x 行开始。

     const arrColors = [ '0xF44336','0xFFEBEE','0xFFCDD2','0xEF9A9A','0xE57373','0xEF5350','0xE53935','0xD32F2F','0xC62828','0xB71C1C','0xFF8A80','0xFF5252','0xFF1744','0xD50000','0xFCE4EC','0xF8BBD0','0xF48FB1','0xF06292']; 
     // Array shortened for readability
    
     for(let xGrid = 0; xGrid < 6; xGrid++) {
         for(let yGrid = 0; yGrid < 12; yGrid++) {
             this.add.sprite( xGrid * 100,yGrid * 100,'button-color').setTint(arrColors[(xGrid * 6) + yGrid])
         }
      }
    

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。