[] Drawing is truncated on new firmware

[bobrippling]

Affected hardware version

Bangle 2

Your firmware version

2v26

The bug

Description

When using kbmulti for inputting text, occasionally it'll render like this:

The touch handling seems to follow, meaning the very short keys have to be hit for their letters. This only started after an upgrade to 2v26/2v27

Installed apps

No response

[bobrippling]

@gfwilliams any ideas of FW changes that might've changed how kbmulti renders?

[gfwilliams]

Honestly I'm not sure. It seems to use the Layout library, so it's the Layout that has got confused somehow.

• You say "occasionally" - is there any way to get it repeatable, or anything you can think about the times it happens?
• You could check Bangle.appRect at the time the Layout is created and see if it includes the whole screen. If it's offset at the bottom then maybe some other app is overwriting it?
• It might be handy to see if you can look at the layout object and whether there is anything odd going on there.
• Can you reproduce it with just the layout code from

  BangleApps/apps/kbmulti/lib.js

  Lines 182 to 210 in 40416fc

  	layout = new Layout( {
  	type:"v", c: [
  	{type:"h", c: [
  	{type:"txt", font:"12x20", label:text.slice(-12), id:"text", fillx:1},
  	(settings.showHelpBtn ? {type:"btn", font:'6x8', label:'?', cb: l=>onHelp(resolve,reject), filly:1 } : {}),
  	]},
  	{type:"h", c: [
  	{type:"btn", font:fontSize, label:letters[1], cb: l=>onKeyPad(1), id:'1', width:btnWidth, filly:1 },
  	{type:"btn", font:fontSize, label:letters[2], cb: l=>onKeyPad(2), id:'2', width:btnWidth, filly:1 },
  	{type:"btn", font:fontSize, label:letters[3], cb: l=>onKeyPad(3), id:'3', width:btnWidth, filly:1 },
  	]},
  	{type:"h", filly:1, c: [
  	{type:"btn", font:fontSize, label:letters[4], cb: l=>onKeyPad(4), id:'4', width:btnWidth, filly:1 },
  	{type:"btn", font:fontSize, label:letters[5], cb: l=>onKeyPad(5), id:'5', width:btnWidth, filly:1 },
  	{type:"btn", font:fontSize, label:letters[6], cb: l=>onKeyPad(6), id:'6', width:btnWidth, filly:1 },
  	]},
  	{type:"h", filly:1, c: [
  	{type:"btn", font:fontSize, label:letters[7], cb: l=>onKeyPad(7), id:'7', width:btnWidth, filly:1 },
  	{type:"btn", font:fontSize, label:letters[8], cb: l=>onKeyPad(8), id:'8', width:btnWidth, filly:1 },
  	{type:"btn", font:fontSize, label:letters[9], cb: l=>onKeyPad(9), id:'9', width:btnWidth, filly:1 },
  	]},
  	]
  	},{back: ()=>{
  	deactivateTimeout(charTimeout);
  	Bangle.setUI();
  	Bangle.removeListener("swipe", onSwipe);
  	g.clearRect(Bangle.appRect);
  	resolve(text);
  	}});

  on its own?

I just tried with just the layout code:

var fontSize = "6x15";
var Layout = require("Layout");
var letters = {
"1":".,!?1","2":"ABC2","3":"DEF3",
"4":"GHI4","5":"JKL5","6":"MNO6",
"7":"PQRS7","8":"TUV80","9":"WXYZ9",
};
var settings = {};
var onKeyPad = () => {};
var btnWidth = g.getWidth()/3;
var text = "Hello";

Bangle.loadWidgets();
layout = new Layout( {
  type:"v", c: [
    {type:"h", c: [
      {type:"txt", font:"12x20", label:text.slice(-12), id:"text", fillx:1},
      (settings.showHelpBtn ? {type:"btn", font:'6x8', label:'?', cb: l=>onHelp(resolve,reject), filly:1 } : {}),
    ]},
    {type:"h", c: [
      {type:"btn", font:fontSize, label:letters[1], cb: l=>onKeyPad(1), id:'1', width:btnWidth, filly:1 },
      {type:"btn", font:fontSize, label:letters[2], cb: l=>onKeyPad(2), id:'2', width:btnWidth, filly:1 },
      {type:"btn", font:fontSize, label:letters[3], cb: l=>onKeyPad(3), id:'3', width:btnWidth, filly:1 },
    ]},
    {type:"h", filly:1, c: [
      {type:"btn", font:fontSize, label:letters[4], cb: l=>onKeyPad(4), id:'4', width:btnWidth, filly:1 },
      {type:"btn", font:fontSize, label:letters[5], cb: l=>onKeyPad(5), id:'5', width:btnWidth, filly:1 },
      {type:"btn", font:fontSize, label:letters[6], cb: l=>onKeyPad(6), id:'6', width:btnWidth, filly:1 },
    ]},
    {type:"h", filly:1, c: [
      {type:"btn", font:fontSize, label:letters[7], cb: l=>onKeyPad(7), id:'7', width:btnWidth, filly:1 },
      {type:"btn", font:fontSize, label:letters[8], cb: l=>onKeyPad(8), id:'8', width:btnWidth, filly:1 },
      {type:"btn", font:fontSize, label:letters[9], cb: l=>onKeyPad(9), id:'9', width:btnWidth, filly:1 },
    ]},
  ]
  },{back: ()=>{
    deactivateTimeout(charTimeout);
    Bangle.setUI();
    Bangle.removeListener("swipe", onSwipe);
    g.clearRect(Bangle.appRect);
    resolve(text);
  }});
layout.render()

And it renders fine for me... But I can't think of any reason it'd be different in 2v26/27 apart from me introducting the new PBF fonts (although you explicitly set the font)

[bobrippling]

Thanks, yes it's a little random, let me see if I can get a stable repro