phaser
phaser copied to clipboard
phaserjs
Bitmapfont kerning on webGL still uncorrected
Version 3.60 (up to 3.80.1)
- Phaser Version: 3.60 (up to 3.80.1)
- Operating system: macos
- Browser:
Description
I've read that the kerning on webgl has been fixed but it is still broken.
Example Test Code
Additional Information
<font> <info size="342"/> <common base="@texB" pages="1" scaleW="1969" scaleH="1043" lineHeight="342"/> <pages> <page id="0" file="title.png"/> </pages> <chars count="20"> <char page="0" chnl="15" xoffset="-36" width="317" height="338" id="89" x="2" y="2" xadvance="218" yoffset="0"/> <!-- Y --> <char page="0" chnl="15" xoffset="-39" width="321" height="346" id="79" x="321" y="2" xadvance="225" yoffset="-5"/> <!-- O --> <char page="0" chnl="15" xoffset="-39" width="281" height="340" id="85" x="644" y="2" xadvance="186" yoffset="0"/> <!-- U --> <char page="0" chnl="15" xoffset="-39" width="290" height="346" id="67" x="927" y="2" xadvance="195" yoffset="-5"/> <!-- C --> <char page="0" chnl="15" xoffset="-37" width="311" height="338" id="65" x="1219" y="2" xadvance="216" yoffset="0"/> <!-- A --> <char page="0" chnl="15" xoffset="-39" width="291" height="338" id="78" x="1532" y="2" xadvance="196" yoffset="0"/> <!-- N --> <char page="0" chnl="15" xoffset="-38" width="401" height="338" id="87" x="2" y="350" xadvance="306" yoffset="0"/> <!-- W --> <char page="0" chnl="15" xoffset="-39" width="221" height="338" id="73" x="405" y="350" xadvance="126" yoffset="0"/> <!-- I --> <char page="0" chnl="15" xoffset="-39" width="271" height="338" id="66" x="628" y="350" xadvance="177" yoffset="0"/> <!-- B --> <char page="0" chnl="15" xoffset="-37" width="273" height="346" id="83" x="901" y="350" xadvance="178" yoffset="-5"/> <!-- S --> <char page="0" chnl="15" xoffset="-39" width="245" height="338" id="76" x="1176" y="350" xadvance="150" yoffset="0"/> <!-- L --> <char page="0" chnl="15" xoffset="-39" width="294" height="338" id="68" x="1423" y="350" xadvance="199" yoffset="0"/> <!-- D --> <char page="0" chnl="15" xoffset="-39" width="244" height="338" id="70" x="1719" y="350" xadvance="150" yoffset="0"/> <!-- F --> <char page="0" chnl="15" xoffset="-39" width="277" height="338" id="82" x="2" y="698" xadvance="181" yoffset="0"/> <!-- R --> <char page="0" chnl="15" xoffset="-39" width="250" height="338" id="69" x="281" y="698" xadvance="155" yoffset="0"/> <!-- E --> <char page="0" chnl="15" xoffset="-39" width="260" height="338" id="80" x="533" y="698" xadvance="165" yoffset="0"/> <!-- P --> <char page="0" chnl="15" xoffset="-39" width="279" height="338" id="84" x="795" y="698" xadvance="184" yoffset="0"/> <!-- T --> <char page="0" chnl="15" xoffset="-39" width="149" height="345" id="33" x="1076" y="698" xadvance="54" yoffset="-4"/> <!-- ! --> <char page="0" chnl="15" xoffset="-39" width="282" height="338" id="72" x="1227" y="698" xadvance="188" yoffset="0"/> <!-- H --> <char page="0" chnl="15" xoffset="-39" width="313" height="338" id="77" x="1511" y="698" xadvance="218" yoffset="0"/> <!-- M --> <char xoffset="0" page="0" chnl="15" width="0" height="0" id="32" x="0" y="0" xadvance="108" yoffset="0"/> <!-- space --> </chars> <kernings count="66"> <kerning first="89" second="79" amount="-6"/> <kerning first="79" second="85" amount="33"/> <kerning first="67" second="65" amount="0"/> <kerning first="65" second="78" amount="21"/> <kerning first="87" second="73" amount="18"/> <kerning first="73" second="78" amount="44"/> <kerning first="66" second="79" amount="21"/> <kerning first="79" second="78" amount="35"/> <kerning first="78" second="85" amount="47"/> <kerning first="85" second="83" amount="23"/> <kerning first="73" second="76" amount="44"/> <kerning first="76" second="68" amount="33"/> <kerning first="70" second="82" amount="36"/> <kerning first="82" second="69" amount="31"/> <kerning first="69" second="69" amount="39"/> <kerning first="69" second="83" amount="18"/> <kerning first="83" second="80" amount="34"/> <kerning first="80" second="73" amount="30"/> <kerning first="78" second="83" amount="27"/> <kerning first="84" second="79" amount="8"/> <kerning first="79" second="84" amount="8"/> <kerning first="84" second="65" amount="-12"/> <kerning first="65" second="76" amount="21"/> <kerning first="66" second="85" amount="33"/> <kerning first="85" second="76" amount="47"/> <kerning first="76" second="76" amount="33"/> <kerning first="76" second="83" amount="12"/> <kerning first="83" second="69" amount="34"/> <kerning first="69" second="89" amount="10"/> <kerning first="89" second="69" amount="19"/> <kerning first="69" second="33" amount="33"/> <kerning first="80" second="69" amount="34"/> <kerning first="69" second="82" amount="39"/> <kerning first="82" second="70" amount="31"/> <kerning first="70" second="69" amount="36"/> <kerning first="69" second="67" amount="25"/> <kerning first="67" second="84" amount="11"/> <kerning first="84" second="33" amount="25"/> <kerning first="83" second="87" amount="7"/> <kerning first="73" second="83" amount="23"/> <kerning first="83" second="72" amount="34"/> <kerning first="72" second="33" amount="42"/> <kerning first="65" second="67" amount="1"/> <kerning first="67" second="69" amount="28"/> <kerning first="78" second="65" amount="21"/> <kerning first="65" second="73" amount="16"/> <kerning first="76" second="69" amount="33"/> <kerning first="69" second="68" amount="39"/> <kerning first="73" second="84" amount="27"/> <kerning first="79" second="79" amount="21"/> <kerning first="79" second="77" amount="35"/> <kerning first="77" second="33" amount="42"/> <kerning first="83" second="67" amount="20"/> <kerning first="67" second="79" amount="14"/> <kerning first="79" second="82" amount="35"/> <kerning first="65" second="87" amount="-18"/> <kerning first="87" second="69" amount="23"/> <kerning first="83" second="79" amount="20"/> <kerning first="77" second="69" amount="48"/> <kerning first="66" second="82" amount="35"/> <kerning first="82" second="73" amount="27"/> <kerning first="76" second="73" amount="29"/> <kerning first="73" second="65" amount="16"/> <kerning first="78" second="84" amount="31"/> <kerning first="66" second="69" amount="35"/> <kerning first="69" second="84" amount="22"/> </kernings> </font>
These fiddles illustrate the difference between CANVAS and WEBGL rendering:
WEBGL: https://jsfiddle.net/d5341sga/2/ CANVAS: https://jsfiddle.net/zbs9e7wL/2/
Note: the examples above are using Phaser 3.80.1