Android text lineheight doesn't match Web or Windows #1062

Activity

1. dijitaletkinlikler commented on Apr 1, 2021

   

   dijitaletkinlikler

   on Apr 1, 2021

   Last edited by dijitaletkinlikler

   More actions

   Here's how I solve this problem with createjs.
   Someone shared this code before:

   var cache = {}
   createjs.Text.prototype._drawTextLine = function (ctx, text, y) (
   this.textBaseline = ctx.textBaseline = "alphabetic";
   if (! (this.font in cache)) {
   var metrics = this.getMetrics ();
   cache [this.font] = metrics.vOffset;
   }
   var offset = cache [this.font];
   if (this.outline) {
   ctx.strokeText (text, 0, y - offset, this.maxWidth || 0xFFFF);
   } else {
   ctx.fillText (text, 0, y - offset, this.maxWidth || 0xFFFF);
   }
   };

   I am adding gold FontFace right away.

   var isIE =false || !!document.documentMode;
   var tarayiciEdge = !isIE && !!window.StyleMedia;

   if(!tarayiciEdge){

   const dikTemelYazi = new FontFace('Dik_ABC_1_Normal', 'url(../../../genelScriptsCss/fontStyle/Dik__ABC_1_Normal.ttf)');
   const dikTemelYaziCizgili = new FontFace('Dik_ABC_6_Noktali_Kılavuzlu', 'url(../../../genelScriptsCss/fontStyle/Dik_ABC_6_Noktali_Kılavuzlu.ttf)');
   
   dikTemelYazi.load().then((font) => {
     document.fonts.add(font);
   
       console.log('Font loaded');
   
   })
   
   dikTemelYaziCizgili.load().then((font) => {
     document.fonts.add(font);
   
       console.log('Font loaded');
   
   })
   

   }
2. vwmberry95 commented on Apr 2, 2021

   

   vwmberry95

   on Apr 2, 2021

   Author

   More actions

   Thanks for the reply, that got me pointed in a direction that yielded more testing results.

   In the screenshots above, I'm using "ideographic" baseline. If I switch to "alphabetic" baseline, then they match. Unfortunately, my project requires that I use "ideographic" baseline.

   The fact that "alphabetic" matches up but "ideographic" doesn't, does that help identify the cause of this issue?