やる気駆動型エンジニアの備忘録

WPF(XAML+C#)の話題を中心に.NET/Android/CI やたまに趣味に関するブログです

Circle CI でErogoDox EZ のキーマップをビルドする

1年と少し前から使い始めたErgoDox EZ ですが、少しキーマップを変えたいなと思いました。 しかし、時間が経過しすぎて前回ビルドしたBash on Ubuntu on Windows も環境ごとOS をクリーンインストールしていました。

ちなみに前回のビルドでハマったところは以下にまとめています。

iyemon018.hatenablog.com

時代は2019年
もうそろそろCI サービスでも使って自前で環境構築なんかしたくないと思い、せっかくなので触ったことのないCircle CI を使ってみました。 また、今回はDocker を使用してビルドします。 私はDocker も触ったことが無いのでこの方法が正しいかどうかは自身がありません。。。

なお、この方法は2019年01月24日時点のものです。時間が経過すると同じ方法ではビルドできない可能性がありますのであしからず。

取り敢えずやりたいことはこんな感じです。

  • リポジトリGitHub にあるものを使用する
  • キーマップファイルは手元のWindows 環境で編集する
  • Circle CI を使用して自動ビルドする
  • ついでにArtifacts から .hex ファイルをダウンロードできるようにする

下準備

まずは以下のqmk_firmware のGitHub リポジトリをFork しておきます。

github.com

つぎにCircle CI でFork したプロジェクトをビルドできるように設定します。 取り敢えず環境はLinux にしました。 .yml ファイルは後ほど作成するので、まずは"Start building"でビルドの設定を完了させます。

Cicle CI でビルド

Fork したqmk_firmware をローカル環境にクローンします。 クローンは割と時間がかかるのでしばらく待ちます。 クローンできたら次は.circleci フォルダにconfig.yml ファイルを作成します。

ちなみにWindows 環境では拡張子のみの表記であるフォルダ名(".circleci"みたいな)を普通に設定することができません。 このようなフォルダは以下の方法で作成します。

  1. 新規フォルダを作成する
  2. フォルダ名を編集する
  3. フォルダ名は".circleci."(末尾に"."があること)とする
  4. あとはEnter を入力すると末尾の"."が自動的に除外される

さて、config.yml を編集します。

ErgoDox EZ のキーマップをCircle CI でビルドするための設定ファイル

キーマップのビルドにはDocker を使用します。 ローカル環境でビルドする場合は"make ~~"とかしてたんですが、今はDocker のビルド スクリプトが存在します。 その方法がdocs/getting_started_build_tools.mdに記載されています。

 util/docker_build.sh keyboard:keymap 
 # For example: util/docker_build.sh ergodox_ez:steno

どうやら docker_build.sh にキーボードの種類とキーマップの種別を設定することでビルドしてくれるようです。便利! 上記のconfig.yml はこの方法を採用して書きました。

ビルドして試す

ビルド結果の .hex ファイルはこれまで通り .build フォルダに作成されます。 config.yml でも.build/ergodox_ez_default.hexファイルをArtifacts に設定しています。

あとはqmk_firmware/keyboards/ergodox_ez/keymaps/default/keymap.cファイルを編集してPush すると自動ビルドが実行されます。

f:id:iyemon018:20190124215859p:plain

こんな感じでArtifacts に .hex ファイルが追加されていれば完了です!

今回は初めてDocker とCircle CI を触りましたが、Circle CI はビルドするだけなら簡単にできます。 また、Docker についても予めスクリプトが用意されているため、予備知識無しでもビルドできました。

ローカルに環境を作ると少しキーマップを変えたいと思っても時間が経っていると環境どこだっけとなりやすいので、できるだけサービス側に丸投げしたいところです。 今回のようにCI サービスを利用されている方もちらほらいるようなので一度お試しあれ。

(映画・感想)ブラック・ミラー:バンダースナッチ

NETFLIX オリジナル映画『ブラック・ミラー:バンダースナッチ 』の感想&レビューです。

あらすじ

1984年、天才プログラマーに出会い、ビデオゲーム「バンダースナッチ」の開発チャンスを得た若きプログラマーが主人公。ファンタジー小説に基づくゲーム開発に取り組むなかで、徐々に現実とパラレルリアリティが混同し始める…。

予告編

www.youtube.com

NETFLIX で話題沸騰らしい、映画の形として全く新しい「ストーリーを視聴者が選択できる」という映画です。 NETFLIX ではこの形式を"インタラクティブ映画"と称しています。"インタラクティブ"とは、直訳すると"相互に作用する"という意味ですが、コンピュータの世界では"双方向的なコミュニケーションが可能であること"、"ユーザーの操作に対して画面上の情報や内容が変化すること"を指し示します。

ちなみにブラック・ミラーというのはシリーズ物になっていて「社会風刺をブラックテイストに表現したオムニバス形式の物語」らしいです。オムニバス形式なので、1話ごとにストーリーや設定などは全く異なります。

以下、ネタバレ含みます!

続きを読む

(映画・感想)FEAR.INC -フィアー・インク-

2016年に公開された海外ホラー映画『FEAR.INC -フィアー・インク-』の感想&レビューです。

  • タイトル : FEAR.INC
  • 監督 : ヴィンセント・マシャーレ
  • 公開 : 2016年
  • ジャンル : ホラー
  • 出演
    • ルーカス・ネフ(ジョー・フォスター)
    • ケイトリン・ステイシー(リンジー
    • クリス・マークエット(ベン)
    • ステファニー・ドレイク(アシュリー)

あらすじ

本当に怖い体験がしたいならある会社へ連絡を。名刺にあった番号に早速電話したホラー映画好きの男。すると、彼と友人達に次々と恐怖の出来事が襲い掛かり...。

予告編


最高の恐怖を味わいたかったら電話しよう!映画『フィアー・インク』予告編

タイトルの"FEAR"は日本語で"恐れ"、".INC"は"法人企業"や"株式会社"を表す単語なので本国だと"株式会社恐れ"みたいなタイトルになるんでしょうか。めっちゃダサいです。

以下、ネタバレ含みます!

続きを読む

(映画・感想)BIRD BOX -バード・ボックス-

NETFLIX オリジナル映画『BIRD BOX -バード・ボックス-』の感想&レビューです。

あらすじ

謎の闇に突き動かされた者たちが相次々と命を絶ち、人口が激減して5年。ここまで生き延びてきた母親が2人の子供を連れて、安住の地を目指す危険な旅に出る。

予告編


視界を奪われた世界を生き抜く、サバイバル・スリラー『BIRD BOX/バード・ボックス』予告編

この監督の作品は始めてみましたが、Wikipedia で見る限り家族愛を描いた作品が多いんですかね?
あと、脚本の方が「エリック・ハイセラー」という方なのですが、過去に『遊星からの物体X ファーストコンタクト』の脚本もされていたそうで。あれも面白かった。
また、2017年に大ヒットした『君の名は。』のハリウッド実写版の脚本家にも抜擢されているそうです。これは知らなかった。

以下、ネタバレ含みます!

続きを読む

(WPF)Windows Community Toolkit の MapControl を使ってみた

随分と昔(といっても今年だった気がする)にXAML Islands というキーワードを目にしたのですが、そのパッケージが OSS 化されて WPF でも使用できるとのことなので試しに使ってみました。

XAML Islands って?

Windows のデスクトップ アプリケーション開発では UWP, WPF, Windows Forms があります。 しかし、現状 WPF, Windows Forms は新たな機能は追加されておらず、Windows API の恩恵を 100% 享受できているわけではありません。
そこで、UWP と同じコントロールをホストする機能として XAML Islands が登場しました。
(と、記憶しています。。。)
以下は参考ページです。

docs.microsoft.com

docs.microsoft.com

2018年12月現在、XAML Islands を使用するための NuGet パッケージが公開されています。
(GitHub) Microsoft.Toolkit.Win32

github.com

今回はこのパッケージを使用して XAML Islands の以下の機能を試してみます。

  • MapControl

なお、この記事で記載している内容は2018年11月27日にリリースされたVer.5.0.1時点のものです。

動作環境

github.com

github.com

MapControlの使い方

MapControl はその名の通り地図を表示・操作するためのコントロールです。
UWP の MapControl と全く同じように扱えるわけでは無いですが、似たようなよく使われる機能は揃っているようです。

docs.microsoft.com

docs.microsoft.com

ただし、Microsoft.Toolkit.Wpf.UI.Controls.MapControlに定義されているプロパティは実際には使用されていない(?)ようで、地図の位置や拡大率を変えてもプロパティの値が変更されませんでした。
タッチパネルなどで操作する場合は問題ないのですが、ボタン操作などで拡大率を変更したり、回転したい場合は以下の方法で実現します。(ただし、上記に書いたとおり MapControl プロパティの値は変化しないため、スライダーなどとデータバインドするといった使い方ができません)

MapControl に関するコード

拡大・縮小は 48行目、回転は 58行目、傾き(3Dビュー)は 68行目が該当箇所となっています。
それぞれのメソッドは非同期になっています。

また、表示座標・拡大率などを一度に設定する場合は 30行目にあるMapControl.TrySetViewAsyncメソッドを使用します。
MapControl は何らかの操作を行う際にアニメーションします。これは初期表示座標の移動時には少し不便だったため、アニメーションを非表示に設定しています。
さらに、一度MapControl.TrySetViewAsyncメソッドを呼び出してもタイミングによっては失敗することがありました。(原因はわかっていません)
この現象を回避するために座標設定が成功するまでリトライしています。(26行目~41行目)
この回避策が正しいかどうかはわかりませんが、これでひとまず初期座標の表示は可能です。

これを実行すると以下のような画面が表示されます。 f:id:iyemon018:20181228142317p:plain

オフライン環境でも使える

少し試しただけなのですが、どうやら MapControl はオフライン環境でも地図の表示が可能です。
[設定] - [アプリ] - [オフライン マップ] から地図データをダウンロードすればいいようですがこのあたりの仕組みはよくわかっていません。
また、重要なことですが日本地図はオフラインデータとして提供されていません。
試しにオフライン環境で実行してみましたが真っ白な地名も記載されていない背景だけが表示されます。
このあたりは Microsoft から提供されるまで待ちですね。

このように UWP と全く同じ機能を使用することはできませんが、WPF でも MapControl を使用することはできます。今後より良くなるには(OSS化されたとはいえ)Microsoft 次第なんでしょう。
近い内に他の機能(InkCanvas とか)も触ってみようと思います。

今回使用したサンプルはこちら↓↓↓↓↓

github.com