Razl-Dazl

Windows以外の環境でも音ゲーがしたい！！！という奇特な人間向けの内容

前提として

• OSはUbuntu 22.04 日本語Remixを導入
• BMSのアプリケーションはbeatorajaを使用する
• 普通のキーボードではなく、アケコンなど外部のコントローラを接続する

となっております

なおUbuntuは本家リリースのものではなく、日本語Remix版を使用することを強くおすすめします

さもなくば日本語入力関連の不具合で泣くことになります・・・

Java実行環境導入

とりあえず必要なものを入れていきましょう

まずはJavaの実行環境を整える

窓版beatorajaはexeファイル付きで即実行できるようになっていますが、LinuxではJavaの実行環境を整える必要があります

sudo apt install openjdk-11-jdk

インストールに問題無ければjava -versionで情報が出るはず

username@hogehoge:/$ java -version
# こういうのが出るはず
openjdk version "11.0.22" 2024-01-16
OpenJDK Runtime Environment (build 11.0.22+7-post-Ubuntu-0ubuntu222.04.1)
OpenJDK 64-Bit Server VM (build 11.0.22+7-post-Ubuntu-0ubuntu222.04.1, mixed mode, sharing)

次にJavaFXのライブラリを入れる

Java8までは別途入れる必要は無かったけどJava11では必要な模様

ただしaptでopenjfxを入れてもうまく動作しないようなので、代わりにブラウザからダウンロードしてきて適当なフォルダに配置する

ここでははホームフォルダ/home/usernameに置くものとして進めます（usernameは各自のものに置換）

ここ のDownloadsから各オプションを選択してJavaFXを引っ張ってくる

• バージョンは17.0.11 LTS
• Operating SystemはLinux
• Architectureはx64（ここは人によるけど普通のPCなら99パーセントx64）
• TypeはSDK

バージョンを最新版の21.0.3とかにしてしまうとSDKの最小サポートバージョンの不一致で動かないので注意！
）
そしてダウンロードしたopenjfx-17.0.11_linux-x64_bin-sdk.zipを展開して、フォルダjavafx-sdk-17.0.11をホームフォルダの下に配置

beatoraja起動

最新版 を頂いてくる（betoraja-x.x.x-modernchicの方）

そして展開したファイルたちの中にあるbeatoraja-config.commandを編集する

1行目と2行目の間に、JavaFXライブラリのパスを追加する

export PATH_TO_FX=/home/username/javafx-sdk-17.0.11/lib

最後の行は以下の文に置換（追記ではなく置換えてください）

exec java --module-path $PATH_TO_FX --add-modules=javafx.controls,javafx.fxml -Xms1g -Xmx4g -cp beatoraja.jar:ir/* bms.player.beatoraja.MainLoader

保存したらそのファイルをエクスプローラ上で右クリック-> プログラムとして実行(R) を選択

これで最初の画面が出てくるはず・・・

ちなみにUbuntuではJAVA_HOMEのようなJava自体のパスの定義は不要です

専コン・アケコン等を認識させる

持っている虹コンが普通に接続しただけでは認識しませんでした

どうやら別途ドライバのインストールが必要らしい

sudo apt install joystick

またbeatorajaの設定も一応チェックしてください（起動ボタンを押してから出てきた選曲画面でキーボードの6を押す）

Controller Device 1が各アケコン達のものになっているか確認

私の持っている虹コンはUSB Joystickとして認識されていました

あれ認識しないなーと思ったら既定値がASRock LED Controllerと設定されていました・・・そら認識しないワ・・・

さあこれで鍵盤や皿が使えるようになったはずです！廃人ライフを楽しみましょう！

動作について

筆者の環境では判定を+50ms程度に設定しています

同じPCのWindows環境では+30ms程度だったのでオフセット値が増えていますが、大きな支障は無いと思われます（何なら昔はMacBookで+70msとかにしていたので・・・）

動作が安定しない場合はGPUのドライバ設定を変えてみると改善するかもしれません

GPUのドライバがオープンソースの物だったりすると純正よりパフォーマンスが悪いそうなので、多少動作への影響はあるかと思います

当初GPUファンが変な唸り方をしていて微妙にストレスでしたが、ドライバを一番上の検証済みと書かれたものへ変更したら解決しました

参考

• Getting Started with JavaFX
• M1 iMacでBMS | tsukasa69
• 【Ubuntu】ゲームパットを使う - 某氏の猫空

MarkdownのドキュメントをWebサイトとして公開するにあたって、通常のリンク貼り付けのみではどうしても華やかさに欠けてしまうため、カード型のリンクを試してみました

ブラウザ上からの編集について

ブラウザ上でGitBookのサイトにアクセスすればGUIの操作で完結が可能なのですが、筆者は普段そちらを使用していないので、ここではローカルのVSCode等で書いていきます

何なら、ブラウザ上からファイルの編集を行うのはあまりオススメしません・・・

簡単に説明すると、GitBookでの目次はSUMMARY.mdというファイルを作成してカスタマイズするのですが、そもそもカスタマイズせず自動生成に頼った方が圧倒的に楽なので、私はGitBook用のリポジトリにSUMMARY.mdを置いていません

しかし、ブラウザ上でファイルの編集を行うと、その際にSUMMARY.mdが自動生成されてしまい、次回以降ローカルでファイルを編集する際にSUMMARY.mdを削除する、又は整合性が合うように中身を編集する必要が生じてしまいます

上記の理由から、ファイルの編集はローカルの環境で行うことを推奨します

カード形リンクの作り方

以下のようなHTMLを記述すると、GitBook上ではカード形のリンクとして振る舞います

<table data-view="cards">
  <thead>
    <tr>
      <th></th>
      <th data-hidden data-card-cover data-type="files"></th>
      <th data-hidden data-card-target data-type="content-ref"></th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Page1へのリンク</td>
      <td><a href="img/page1.jpg">thumbnail</a></td>
      <td><a href="page1.md">page1.md</a></td>
    </tr>
    <tr>
      <td>Page2へのリンク</td>
      <td><a href="img/page2.jpg">thumbnail</a></td>
      <td><a href="page2.md">page2.md</a></td>
    </tr>
    <tr>
      <td>Sub-Pageへのリンク</td>
      <td><a href="sub-page/img/sub.jpg">thumbnail</a></td>
      <td><a href="sub-page/README.md">sub-page/README.md</a></td>
    </tr>
    <tr>
      <td>外部へのリンク(Google)</td>
      <td><a href="img/google.jpg">thumbnail</a></td>
      <td><a href="https://www.google.com/">Google</a></td>
    </tr>
  </tbody>
</table>

ここでは、<tr>~</tr>で囲まれた部分が1つのカードとして機能します

この部分を増やすことでカードの数を増やすことが可能です

また、<td>~</td>に囲まれた部分によってカードの情報を指定します

1つ目にはカードのタイトル、2つ目にはカードに表示するサムネイル画像、3つ目にはリンク先を指定します

リンク先については、ドキュメント内の別ページを指定する際はmarkdownファイルの相対パスを指定します　また外部リンクを指定する際はURLをそのまま指定します

メリット・デメリット

メリットは言わずもがな、Webページの華やかさ・分かりやすさが増します

デメリットはWebページ上でしかレイアウト・リンクが機能しない事です　残念ながら、VSCodeやObsidianといったエディタ上でリンクをクリックしても、正しく遷移しません

折角Markdownで管理している訳ですから、リンクが機能しないというのは少々勿体ないですね

これについては、「個別のページではカード形式のリンクを使用せず、目次などでのみ使用する」という方針で妥協しています

個別のページでカードを使用してしまうと、もしGitBookから他の静的サイトジェネレータ(Hugo等)へ乗り換えた際に、内容とは関係なしに修正の必要が生じてしまいます

目次であれば、そもそもHugoでしたらタグやカテゴリーを付与して自動分類に頼ることになりますから、そのページ自体が不要になります　従って修正を加える必要はありません

要は、GitBookという環境で必要なファイルに対してのみカードを使用する、という事ですね

カードの使用にあたってはメリット・デメリットがありますが、やはりWebページの視認性が上がることは捨てがたいですから、GitBookを静的サイトジェネレータ代わりに使用している方々は是非とも導入してみてください・・・

最近GitBook(のホスティングサービス)でドキュメントを纏めているのですが、数式の扱いでちょっと困っています…

いちおうLaTeX記法は使える

GitBookはLaTeX記法が使えるので、それに従って書けば一応それっぽくなります

$$
ζ(s)= \sum_{n=1}^∞ \frac{1}{n^s}
$$

例えば、書いた数式をデリミタ(ドル記号2つ)で挟む事によって、以下のように数式を美しく出力することが出来ます
　

初学者なので、無限大を\inftyで書いてないなどのツッコミどころがありますが、話の本筋で無いので見逃してください…

ただしデリミタの仕様が変

今この問題にぶち当たっています

VSCodeやObsidian等の、MarkdownのプレビューにおいてLaTeX記法をサポートしているエディタと比較して、GitBookではデリミタの扱いが少々異なっており、思った通りの出力が出来ていません…

通常、LaTeX記法ではインライン表記(文章中に1行で表示すること)を行う際に、ドル記号1つで数式を囲みます

また、数式だけを独立して表示する際は、ドル記号2つで数式を囲みます

VSCode上で出力する際も、基本これに従います

しかし、GitBookでインライン表記を行う際には、ドル記号2つで数式を囲む必要があります

そして数式だけを独立して表記する際は、ドル記号2つで囲った上に改行を挟む必要があります(例として書いたコードブロック内で改行をしているのはこの為です…)

軽く調べた限りでは、どうも昔からこのような仕様みたいなので、修正される見込みは低いと考えています…

仕方ないので、暫くはインライン表記を諦めて、ドル記号2つ+改行だけでやりくりすることにします…基本的にはエディタ上での出力を優先したいのです…GitBook側の仕様に合わせるというのは再利用性が下がるので…

というわけで、解決方法は見つかっていないので皆さん気をつけてください、というそれだけのメモでした(fin)

Viewに対してandroid:background属性でdrawableファイルを指定すると、それをViewの背景として使用する事が出来ます・・・が、別のレイアウトファイルからincludeした際に背景が消えてしまうことがあります

 <androidx.recyclerview.widget.RecyclerView
            android:id="@+id/fields"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="@drawable/background_stroke_1dp">

このように定義した背景がincludeするとおかしくなる・・・

原因としてはandroid:backgroundTint属性のオーバーライドが考えられます

backgroundTintに色を指定すると、背景のdrawableの概形を維持したまま色だけを変更することが出来ます(例えば、backgroundに星形のdrawableを指定してbackgroundTintに黄色を指定すれば、そのViewの背景は黄色の星形になるわけです)

backgroundTintを指定しなかった場合は、drawbleで定義したものがそのまま背景として使用されますが、外部でテーマを定義した場合等においてはその定義値によってオーバーライドされてしまいます

色の指定で透明度100%の値をぶち込めば背景は消えてしまいます・・・今回は、includeしたレイアウトファイルにてbackgroundTintが透明色でオーバーライドされていたようです

これを防ぐには、backgruondTintにnullをセットすればok

 <androidx.recyclerview.widget.RecyclerView
            android:id="@+id/fields"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="@drawable/background_stroke_1dp"
            android:backgroundTint="@null">

原因の究明に半日近く費やした割には、呆気なく潰せる不具合でした・・・

レイアウトにEditTextを含む画面にて双方向データバインディングを導入したところ、EditTextに対するsetText()やsetSelection()が正しく動作しなくなってしまいました

元々は以下のようなコードを記述していました(一例)

val text = intent.getStringExtra("text")
editText.setText(text)
editText.setSelection(editText.text.length)

しかし、双方向データバインディングを用いてEditTextの中身をViewModelのプロパティと紐付けるようにした場合、setText()を使用した値の入力は反映されなくなってしまいます

で、いろいろ試行錯誤してみたのでそれぞれの結果を残しておきます

1. ViewModelのプロパティに値をセットするように書き換える

最初のコードの2行目を置き換えただけです

VIewModelに定義したプロパティへ値をセットするように変更

val text = intent.getStringExtra("text")
viewModel.text.value = text
editText.setSelection(editText.text.length)

結果、正しく動作せずIndexOutOfBoundsException()が出る・・・

Logcatを見てみると、空の EditTextに対してsetSelection(20)のような操作を行い例外が発生していました

ViewModelにセットされた値がEditTextに反映される前にsetSelection()が実行されたと推測

2. Observerで値の変更を検知するようにして、ViewModelのプロパティに値をセット

viewModel.text.observe(this, Observer{
	editText.setSelection(it.length)
})

val text = intent.getStringExtra("text")
viewModel.text.value = text

1と同様例外が発生してクラッシュ・・・

ここで注意したいのが、あくまでもObserverはViewModelのプロパティの変化を検知しているだけである事

よって最初の場合と同じように、EditTextの中身に値が反映されるまではラグが発生するのでダメ

3. ViewModelの値ではなくEditTextの値に対して変更を検知する

val watcher = object: TextWatcher {  
    override fun beforeTextChanged(s: CharSequence?, start: Int, count: Int, after: Int) {  
    }  
    override fun onTextChanged(s: CharSequence?, start: Int, before: Int, count: Int) { 
    }  
    override fun afterTextChanged(s: Editable?) {  
        if(isFirst) {  
            isFirst = false  
            binding.content.setSelection(binding.content.text.length)  
        }  
    }  
}
binding.editText.addTextChangedListener(watcher)

val text = intent.getStringExtra("text")
viewModel.text.value = text

これは問題なく動いた。

EditText自体にリスナをセットする手法です

TextWatcherを継承したクラスの中にフラグを置いていますが、カーソルを動かすのを値をセットした直後だけにするためです

本当はremoveTextChangedListener()でリスナを無効化したかったのですが、自分の試行錯誤した範囲では例外が発生してしまったり、そもそもリスナ自体がうまく動作しなくなったりと使いこなす事が出来なかったので諦めました

双方向データバインディングを使えばActivityクラスがスッキリするはずなのに、今回ばかりは余計に記述量が増えてしまいました　うーん・・・

あと、Activity内からViewModelのプロパティに値をセットしているのもあまり良くないですね、ここはそのうち直すことにします

ViewModelを生成する前にIntentから文字列を受け取って、ViewModel生成時に値をぶち込んでしまえば最後の1行は消えるので・・・まあ・・・そのうち直します・・・

完

いつの間にかiPad版VRoid Studioがリリースされていて驚きを隠せないのですが

PCで作成したモデルをiPadの方で開こうとしたらアプリがクラッシュしました

すぐ見当はついて予想通りだったのですがファイルが重すぎる事が原因でした

VRoidには、髪の毛を編集した際にマテリアルがどんどん増殖していく致命的な（バグ｜仕様）がありまして、これを放置しているとファイルが肥大化してしまうんですよね・・・

PCで編集する際はPCのスペックで殴って誤魔化していましたがiPad版は流石に無理でした／(^o^)＼

単純にメモリ不足になって落ちてしまいます

不要なマテリアルがこのように大量発生しているので1個1個丹精込めて消していきます（込めるな）

1個ずつ消していくしかありません　増殖しすぎると編集画面がメチャメチャ重くなるので結構時間がかかります

一応グラボはRTX3000番台載せているんですけど、最初はマテリアル1個消すのに数秒固まったりしていました・・・かなり重かったです・・・

2個ほど注意点

• 使用中のマテリアルは消すことが出来ない
• マテリアルを消す際は、下の項目から順に消す方が動作が軽い（何故？）

マテリアルの設定箇所はパーツ全体と髪の毛1個1個の方の2箇所あるので、どちらかにマテリアルが設定されていると消せません

マテリアルがうまく消せない場合は、もう一方にマテリアルが設定されている可能性大です

そんなこんなで重複したマテリアルを全て削除すると、100MB150MBまで肥大していたファイルが10MB15MB程度になりました

再度髪の毛を編集するとまたマテリアルが増えていってしまうので、一旦vroidcustomitem形式でエクスポートしておくことをお薦めします

iPad miniでも動くのすごい

最小の環境が整ったのでめでたしめでたし

Hugoでのビルド作業を自動化するためにworkflowファイルを作ったんですけど、なんかリモートへのプッシュがうまくいかなかったんですよね

git -c diff.mnemonicprefix=false -c core.quotepath=false --no-optional-locks push -v --tags origin master:master
POST git-receive-pack (701 bytes)
Pushing to https://github.com/g396/******.git
To https://github.com/g396/******.git
 ! [remote rejected] master -> master (refusing to allow an OAuth App to create or update workflow `.github/workflows/github-pages.yml` without `workflow` scope)
error: failed to push some refs to 'https://github.com/g396/******.git'

普段PCではSourceTreeで作業しているのですが、SourceTreeにはworkflowファイルを更新する権限が無くそれが原因でした

代替でGitHub Desktopをインストールしてそちらからコミット&プッシュすることで解決しました・・・

GitHub Desktopの権限の欄を見ると、“Update github action workflows"が存在します

workflowのファイルを編集してプッシュするにはこの権限が必要です

適当にプッシュ用のトークン発行してgitコマンド手打ちでもいいかもしれないですが、gitをCLIで操作するのあんまり好きじゃなくて・・・

GitHub Desktopを使うと変な環境依存の問題も発生しづらいのでおすすめです、っていうだけの話でした　おしまい