Sharing bangle 1 UI idea

Posted on
  • I was testing the output from Bangle.on("touch") and noticed that it returned 3. Which is when you put your finger along the line/boundary between the 2 touch sensors left/right. Which made me realise that it provides functionality for 3 buttons instead of the expected 2. Obviously this was intended by the developers, just some people might not consider it.

    let _1third = 79;
    let _2thirds = 159;
    let _3thirds = 239;
    let _1quarter = 59;
    let _3quarters = 179;
    let _1half = 119;
    
    let rect = (p1,p2,c) => {
    	g.setColor(c[0],c[1],c[2]);
    	g.fillRect(p1[0],p1[1],p2[0],p2[1]);
    };
    
    let circle = (p,size,c) => {
    	g.setColor(c[0],c[1],c[2]);
    	g.fillCircle(p[0],p[1],size);
    };
    
    let redraw = () => {
    	g.clear();
    //leftUp
    circle([_1quarter,_1quarter],30,[1,1,1])­;
    //rightUp
    circle([_3quarters,_1quarter],30,[1,1,1]­);
    //midDown
    circle([_1half,_3quarters],30,[1,1,1]);
    };
    
    
    Bangle.on('touch',(button)=>{
    	console.log(`you pressed ${button}`);
    	if ( button === 3 ) {
    		g.setBgColor(1,1,0);
    	} else if ( button === 2 ) {
    		g.setBgColor(0,1,0);
    	} else if ( button === 1 ) {
    		g.setBgColor(0,1,1);
    	}
    	Bangle.buzz().then(()=>{
    		redraw();
    	});
            redraw();
    });
    
    
    

  • That's a nice idea! Do you find it reasonably reliable selecting the middle one?

  • I had 'asked' for something a while ago... - in the emulator: clicking in a 'demilitarized' zone close to the border of left and right touch zone. To 'make it reliable', feedback has to be given to the user, and touch 'event' has to fire a bit deferred after a configurable short time, and release event has to happen deferred as well in a configurable short time, in order to detect that it is a simultaneous touch and release versus anything else... (touch and not swipe)... I did something very early in Bangle.js history - on emulator - even before bangle was available to me.

  • I haven't used it in practise, but in the demo that it seemed reliable enough, given the button isn't too large and a the tip of an index finger covers both touch areas. You might have to be a bit more careful than usual though, when pressing it, for accuracy.

    I was browsing the source of some of the 'launch' apps on the app store and realised people are already using this feature for 'center touch'

    // Screen event
    Bangle.on('touch', function(button){
      if(STATE.settings_open) return;
      switch(button){
        case 1:
          prev();
          break;
        case 2:
          next();
          break;
        case 3:
          run();
          break;
      }
    });
    

    taken from https://github.com/espruino/BangleApps/b­lob/master/apps/toucher/app.js
    Touch Launcher app.

  • I've used the touch launcher for a while some time ago, and "middle-pressing" worked fine for me.

  • Post a reply
    • Bold
    • Italics
    • Link
    • Image
    • List
    • Quote
    • code
    • Preview
About

Sharing bangle 1 UI idea

Posted by Avatar for d3nd3-o0 @d3nd3-o0

Actions