urahiroLog

書きたいことを書きます。プログラム以外のことも

自作キーボード入門：Ergo68でレイヤー切替時にバックライトLEDの色を変える方法

コンピューター

自作キーボード入門でErgo68を買ってしばらく使ってみた。 キーボードの右上にレイヤーインジケータがついているけど実際使ってる時はキーキャップに隠れて見えない。 レイヤーが変わったらバックライトの色を変えるようにしようと思い立ってやってみた。

ergo68の写真

1. QMK 環境構築

自作キーボードのキーマップ変更はRemapというWebアプリでできる。 Remapの機能でLEDの色を変える機能はあるが、Ergo68ではなぜか色が変わらなかった。 Twitterでつぶやいたらサリチル酸さんからリプが！ Ergo68はRGB_matrixって仕組みで制御されているらしく、Remapでは制御できないとのこと。 アドバイスいただいて、本当に助かりました。。

色々と自作キーボードの細かい部分をいじるには、QMKファームウェアを直接触る必要があるみたい。

1/13追記 サリチル酸さんのブログでの言及

ツイッターのアドバイス頂いていたやつの詳しい手順を記載くださってました。

単にバックライトの色を変更したい方はこの方法でできそうですね。

見出しが【新記事】自作キーボード入門：Ergo68でレイヤー切替にバックライト色を変える方法 の部分に画像ありで説明あります。

DeviceカテゴリのUnderglowグループの中のRGB Toggle（On/Off）、RGB Mode（光り方のスイッチ）、Hue、Sat、Bright、Speedあたりをキーに設定して、キーを押して光り方を調整してくださいね、という意味でした。

salicylic-weekly.hatenablog.jp

追記以上--------

やったこと

QMK MSYSをインストールする

基本的にここからは公式のQMKセットアップの手順に従って設定した。 セットアップ

QMKのセットアップ手順は割と頻繁に変わるみたいなので、具体的な手順はここには書かないようにする。

キーマップの作成

セットアップ手順に従ってkeymap.cを直接いじってもいいけど、キーコードとか調べながらやるの大変なので、ブラウザでGUIで設定できるQMK Configuratorを使用した。

  1. ファームウェアの構築の手順で自分用のディレクトリとkeymap.cを作成

  2. QMK Configuratorでキーマップを作成 (参考：https://youtu.be/-imgglzDMdY?si=s1UHkZIyOdY6rDA0&t=408)

  3. Configurator画面で作成したキーマップのjsonをダウンロードする

  4. qmk json2c your.json コマンドでキーマップの配列が出力される

  5. 4で出力された配列をkeymap.cに貼り付ける

  6. 日本語特有のキーに着いては正しく出力されないので手動で修正(参考：（初心者編）QMK Configuratorを使ってキーマップを書き換えよう - 自作キーボード温泉街の歩き方「日本語キーボードの記号について」)

  7. 固まったらコンパイル実行 qmk compile

（参考）キーマップをいい感じに並べるための自作ツール https://nushitoritarou.github.io/csvFormat/

ファームウェアを書き込む

QMK Toolboxのインストール

ファームウェア書き込みに便利なQMK Toolboxをインストールする。 以下ページからインストーラ落として実行 github.com

書き込み

以下ページを参考に実施 docs.qmk.fm

コンパイルが成功していれば、qmkのディレクトリ直下に yushakobo_ergo68_【ユーザ名】.hex みたいな名前のファイルがあるので、 それをQMK Toolboxにドラッグアンドドロップ

キーボード本体のリセットボタン押したら、QMK Toolbox上でFlashが推せるようになるので押す。

これでキーマップは反映されるが、LEDの設定は左右両方のマイコンに書き込まないと反映されない。

RGB Matrixを設定する

自分が設定した内容は以下のリポジトリにアップ済みなので、全く同じ設定入れるのであれば、そのまま使ってどうぞ github.com

マイ設定を説明する。

ここからはLED関連のソースを軽く説明する

keymap.c
キーマップ

キーマップをQMK Configuratorで作成して、そのあと日本語特有のキーだけ置換してあげたやつ。

後述のRemap対応すればRemap側で簡単に変更できるので、ある程度固まったやつを書いておけばいいかも。

const uint16_t PROGMEM keymaps[][MATRIX_ROWS][MATRIX_COLS] = {
        [0] = LAYOUT(
            KC_ESC , KC_1   , KC_2   , KC_3         , KC_4               , KC_5 ,                   KC_6  , KC_7               , KC_8         , KC_9   , KC_0   , KC_MINS, 
            KC_TAB , KC_Q   , KC_W   , KC_E         , KC_R               , KC_T , KC_EQL , KC_RBRC, KC_Y  , KC_U               , KC_I         , KC_O   , KC_P   , KC_LBRC, 
            KC_LCTL, KC_A   , KC_S   , KC_D         , KC_F               , KC_G , KC_INT3, KC_NUHS, KC_H  , KC_J               , KC_K         , KC_L   , KC_SCLN, KC_QUOT, 
            KC_LSFT, KC_Z   , KC_X   , KC_C         , KC_V               , KC_B , KC_DEL , KC_BSPC, KC_N  , KC_M               , KC_COMM      , KC_DOT , KC_SLSH, KC_INT1, 
            KC_LCTL, KC_LGUI, KC_LALT, LT(1,KC_INT5), MT(MOD_LSFT,KC_SPC), KC_NO, KC_NO  , KC_RCTL, KC_ENT, MT(MOD_LSFT,KC_SPC), LT(1,KC_INT2), KC_RALT, KC_APP , KC_ENT),
        [1] = LAYOUT(
            LCTL(S(KC_ESC)), KC_F1  , KC_F2  , KC_F3  , KC_F4  , KC_F5  ,                               KC_F6     , KC_F7     , KC_F8  , KC_F9  , KC_HOME   , KC_TRNS, 
            KC_TRNS        , KC_TRNS, KC_TRNS, KC_TRNS, KC_TRNS, KC_TRNS, LCTL(LALT(KC_HOME)), KC_TRNS, LCTL(KC_C), LCTL(KC_Z), KC_TRNS, KC_TRNS, LCTL(KC_V), KC_HOME, 
            KC_TRNS        , KC_TRNS, KC_TRNS, KC_TRNS, KC_TRNS, KC_TRNS, KC_TRNS            , KC_TRNS, KC_LEFT   , KC_DOWN   , KC_UP  , KC_RGHT, KC_TRNS   , KC_END , 
            KC_TRNS        , KC_TRNS, KC_TRNS, KC_TRNS, KC_TRNS, KC_TRNS, KC_TRNS            , KC_TRNS, KC_TRNS   , KC_TRNS   , KC_TRNS, KC_TRNS, LCTL(KC_F), KC_TRNS, 
            KC_TRNS        , KC_TRNS, KC_TRNS, KC_TRNS, KC_TRNS, KC_TRNS, KC_TRNS            , KC_TRNS, KC_TRNS   , KC_TRNS   , KC_TRNS, KC_TRNS, KC_TRNS   , KC_TRNS)
};
LED設定

rgb_matrix_indicators_user関数であれば、LEDの光り方を上書きできる。 この関数内でレイヤーの状態によって真ん中3つのキーの色が変わるように設定。

#define NUM_PLAIN_LEDS 6
const uint8_t plain_leds[NUM_PLAIN_LEDS] = {9,22,23,46,59,60};

bool rgb_matrix_indicators_user(void) {
    HSV hsv;
    switch (get_highest_layer(layer_state)) {
        case 1:
            hsv = (HSV){22, 255, 255};
            break;
        case 2:
            hsv = (HSV){106, 255, 255}; 
            break;
        case 3:
            hsv = (HSV){184, 255, 255}; 
            break;
        default:
            hsv = (HSV){150, 100, 255}; 
    }
    if (hsv.v > rgb_matrix_get_val()) {
        hsv.v = rgb_matrix_get_val();
    }
    RGB rgb = hsv_to_rgb(hsv);
    for (int i=0; i<NUM_PLAIN_LEDS; i++) {
        rgb_matrix_set_color(plain_leds[i], rgb.r, rgb.g, rgb.b);
    } 

    return true;
}

plain_ledsの配列には色を変えたいindexの番号を設定している。

index番号はinfo.jsonに記載されている内容を図にすると以下のような感じになるので、別の場所を光らせたい場合は以下の表を参照して変えてみるといいと思う。

indexとマッピング

rules.mk
Remap対応

多分この記述だけやればいい。

VIA_ENABLE = yes

おそらくergo68がもともとの設定でRemapに対応されているから1文追加だけでいいのかなと想像してる。

参考にしたサイト様