Wear OS의 시계 화면을 Processing으로 만들어 보자

배경



얼마 전 자신이 속한 연구실에서 스마트 워치를 샀습니다.
뭔가 재미있을 수 없을까-와 만지고 있는 곳에서, 여러가지 기사등을 접하고 있습니다.
스마트 워치는 자신 중에서는 2, 3년 전이 상당히 고조되고 있던 기억이 있었기 때문에, 지금 얽히면서 만져볼까라는 생각이었습니다만, 조사해 보면 여러가지 발견이 있었습니다. 이번에는 그 때의 메모와 Processing에서 WatchFace(시계 화면)를 만들어 보았으므로 개발의 흐름을 써 보았습니다.

TicWatch Pro



이번에 구입한 스마트 워치는 TicWatch Pro라는 중국 Mobvoi(모브보이)사가 판매하고 있는 최신의 스마트 워치를 샀습니다(29000엔 정도). 이 외에도 TicWatch E라든지, TicWatch E2 , TitWatch C2 같은 것도 있는 것 같네요. TicWatch Pro는 배터리를 잡는 것이 좋다고 노력하면 3, 4일은 가지는 것 같습니다.
상당히 검토중인 사이트가 있으므로 마지막에 몇 개 얹어 둡니다.

Wear OS by Google



OS의 명칭이 Android Wear에서 Wear OS by Google 로 변경되었습니다.
가장 목이었던 배터리 관리도 개선되고 있다고 합니다.
최신 버전은 2.6이었습니다 (2019/3/20)

Processing에서의 개발



Java 기반 처리에는 Android 기기로 내보낼 수있는 Android 모드가 있습니다. Android 모드에서는 Android 앱 외에 Android 월페이퍼 Wallpaper, 스마트 워치 화면 WatchFace, VR의 2안화면을 내보낼 수 있습니다.



Android 모드가 없는 경우는, 우단의 모드 선택 버튼의 [Add Mode..]로부터 인스톨 할 수가 있습니다.

이전 준비



개발하기 전에 해 두어야 하는 경우가 있습니다. Android 기기에서 개발을 한 적이 있는 사람은 알겠지만, 먼저 개발자 옵션을 활성화합니다.
스마트 워치 설정 메뉴에서
설정 -> 시스템 -> 터미널 정보 -> 빌드 번호를 7회 연타합니다.

그러면 개발자 옵션이 설정 메뉴에 나타납니다.

Processing 코드



화면 크기는 TicWatchPro의 경우 가로 400, 세로 400입니다.
이 코드는 옛날에 어딘가의 사이트를 참고로 하여 만든 것을 스마트 워치용으로 했습니다.
Processing 시계 등으로 구구하면 나올지도 (웃음)
int MARGIN = 20;

void setup() {
  size(400,400);
  stroke(255);
  smooth();
  frameRate(30);
}

void draw() {
  background(0);
  float s = second();
  float m = minute() + (s/60.0);
  float h = hour()%12 + (m/60.0);
  translate(width/2, height/2);
  rotate(radians(180));

  //なんとなくの文字
  pushMatrix();
  rotate(radians(180));
  translate(0,70);
  fill(255,0,0);
  textSize(30);
  textAlign(CENTER);
  text("WatchFace", 0,0);
  text("for", 0,30);
  text("Processing", 0,60);
  popMatrix();

  // 文字盤の表示
  pushMatrix();
  fill(128);
  noStroke();
  for(int i=0; i<60; i++){
    rotate(radians(6));
    ellipse(width/2-MARGIN,0,3,3);
  }
  for(int i=0; i<12; i++){
    rotate(radians(30));
    ellipse(width/2-MARGIN,0,10,10);
  }
  popMatrix();

  noFill();
  stroke(255);
  // 秒針
  pushMatrix();
  rotate(radians(s*(360/60)));
  strokeWeight(1);
  line(0,0,0,width/2-MARGIN);
  popMatrix();

  // 分針
  pushMatrix();
  rotate(radians(m*(360/60)));
  strokeWeight(2);
  line(0,0,0,width/2-MARGIN);
  popMatrix();

  // 時針
  pushMatrix();
  rotate(radians(h*(360/12)));
  strokeWeight(4);
  line(0,0,0,width/3-MARGIN);
  popMatrix();
}

오류가 있지만 내보내기가 성공하면 스마트 워치의 WatchFace 선택 화면에 Processing 응용 프로그램이 추가되어 있어야합니다.



참고



TicWatch Pro 리뷰 사이트
· 물욕 가젯
· 리브웰!

좋은 웹페이지 즐겨찾기