musicLine(iOS)についての進捗。
フレーズツールの追加実装と通知機構の見直し、描画速度の改善について報告します。
実装状況
カテゴリ | タイトル | 補足 | |
View | |||
Composition UI配置
ガイド表示 | 音符描画の高速化 | 音符が多くても描画できる速さへ最適化 | |
音符の編集状態 | 選択や変更した時に枠線の色変更 | ||
Composition | |||
Common 作曲共通
| 通知機構 | Modelに変更があった時に、Viewへ通知して再描画。変更状況を監視してキャッシュ | |
PhraseTool フレーズツール
フレーズの編集 | データ構造 | トラックのフレーズを取得・追加、削除、状態 | |
フレーズの結合 | 連続する2フレーズの接する小節線をタップで結合(iOS独自) | ||
フレーズの分割 | フレーズをタップで分割(iOS独自) | ||
MIDI | |||
Common MIDI共通
| データ構造 | MIDIフォーマットへ出力できる構造 | |
コンバーター | Compositionのデータ構造へ変換・逆変換 |
全進捗マップを表示
カテゴリ | タイトル | 補足 | |
View | |||
Composition UI配置
ガイド表示 | ピアノ | ||
スクロールエリア | |||
小節番号 | |||
小節線 | |||
分割線 | 拡大率によって間隔を変化 | ||
フレーズ | フレーズがないところはフレーズ作成ボタンを表示 | ||
ツールボタン | 選択中のツールはツール色にハイライトする | ||
メロディーライン | ペンツールでの音符作成時の入力線 | ||
メロディー音符 | 音符の先頭にチョボをつける | ||
リズム音符 | ベース音符のみ下に表示 | ||
サンプルデータ | 手入力したサンプルデータの音符を配置 | ||
連符 | 連符は数字で表示、拡大率によって省略 | ||
ツールガイド(ペン) | 長さ編集しているリズム音符、伸ばした時の削る範囲 | ||
ツールガイド(指) | 移動中の音符影、矩形選択の枠 | ||
ツールガイド(消しゴム) | 削除範囲、和音のみの削除範囲 | ||
ツールガイド(フレーズ) | フレーズ移動・伸縮のバー、選択範囲テキスト(iOS独自) | ||
フレーズボタン | フレーズボタンとサブボタンを配置、ツールに応じてアイコンを変更、画面拡大率に応じて縮小 | ||
フレーズタブ | ツールに応じてアイコンを変更、拡大率に応じて縮小、スクロール状態に応じて移動 | ||
音符描画の高速化 | 音符が多くても描画できる速さへ最適化 | ||
音符の編集状態 | 選択や変更した時に枠線の色変更 | ||
音符音階 | メロディ音符に音階表示 | ||
Community UI配置
| |||
Dialog ダイアログ
| フレーズ | フレーズの作成・設定・挿入、フレーズの長さやリピート回数の設定 | |
Composition | |||
Common 作曲共通
| データ構造 | 座標とサイズ、状態を保持する。レンダラーやコライダー、通知等のロジック | |
コンバーター | Domainのデータ構造へ変換・逆変換 | ||
通知機構 | Modelに変更があった時に、Viewへ通知して再描画。変更状況を監視してキャッシュ | ||
FingerTool 指ツール
音符の編集 | データ構造 | フレーズの音符を取得、基点と移動ベクトルを保持して移動する | |
音符の移動 | 和音や連符は上下のみに制御 | ||
音符の影 | 移動中に操作できているかわかりやすいように(iOS独自) | ||
内外判定 | 音符の移動をフレーズ内に留める | ||
衝突判定 | 移動する音符が他の音符に重なったときの挙動 | ||
タップ選択 | タップした音符の子音符も選択・解除 | ||
矩形選択 | 囲った音符を選択 | ||
音符の入れ替え | リズム音符のスライドで重なった音符と入れ替える(iOS独自) | ||
和音の削除 | 和音を移動した時に重なる時に削除する | ||
連符に切り替え | リズム音符タップで切り替え | ||
PenTool ペンツール
音符の作成 | データ構造 | 音符を作成・分割・統合、フレーズへ音符を追加する | |
音符の作成 | タップで音符を作成。分割線に合わせて長さを決定 | ||
音符列の作成 | スワイプに沿って複数の音符を作成。音階変わる時に音符分割 | ||
有無判定 | タップやスワイプした縦ラインに既に音符があるか判定 | ||
音符の移動 | 音符が既にある場合は、作成ではなく移動。一定距離進むと移動終了 | ||
音符の分割 | リズム音符をタップした時、音符を分割、メロディ線に沿ってY位置を動かす | ||
音符の統合 | 2つのリズム音符の間をタップした場合、音符を統合 | ||
音符の伸縮 | リズム音符を左右にスワイプすることで音符の長さを伸縮、始点で分割なし(仕様変更) | ||
音符の消滅 | 音符の伸縮をした時に長さが0になると削除する(iOS独自) | ||
領域差演算 | 音符伸縮で他の音符に重なる時は差演算して他の音符長さを削る | ||
サンプリング補間 | 素早くスワイプしても音符が移動できるようにサンプリング間を補間する | ||
細かい音符 | 分割線内の細かな音符を移動する挙動 | ||
EraserTool 消しゴムツール
音符の削除 | データ構造 | 和音と連符の認識、フレーズから音符を削除する | |
音符の削除 | タップで音符を削除 | ||
和音・連符の削除 | 和音・連符をタップで和音・連符のみを削除(iOS独自) | ||
音符種別判定 | タップした音符が和音・連符・ルート音符なのか判定する | ||
音符列の削除 | スワイプで指定する削除範囲内の複数の音符を削除。 | ||
和音列の削除 | リズム音符をスワイプで複数の和音のみを削除。(iOS独自) | ||
休符に切り替え | リズム音符タップで休符に切り替える | ||
PhraseTool フレーズツール
フレーズの編集 | データ構造 | トラックのフレーズを取得・追加、削除、状態 | |
フレーズの作成・挿入 | ダイアログで長さとリピートを設定 | ||
フレーズの選択 | 2点タップで範囲選択、範囲ガイドタップで選択解除(仕様変更) | ||
フレーズの移動 | 左右スワイプで移動、移動は選択フレーズとスワイプ中のフレーズを含む | ||
フレーズの伸縮 | サブ編集領域をスワイプした時にフレーズ長さを伸縮、長さ0で削除(iOS独自) | ||
フレーズの貼り付け | 選択フレーズをコピー・ペースト、サブボタンかフレーズタブタップで挿入、選択解除 | ||
周囲有無判定 | 作成する小節の近くにフレーズがあるかの判定、設定できる長さやリピート回数の制御 | ||
フレーズボタン・タブ | ツールに応じてフレーズボタン、タブの処理を変更 | ||
フレーズの結合 | 連続する2フレーズの接する小節線をタップで結合(iOS独自) | ||
フレーズの分割 | フレーズをタップで分割(iOS独自) | ||
StampTool スタンプツール
モチーフの編集 | |||
Transform 画面移動
座標変換 | 画面を上下移動 | ピアノのスワイプにより | |
画面を左右移動 | スクロールエリアのスワイプにより | ||
画面を拡大・縮小 | ピンチアウト・インにより基点を画面中心に設定する | ||
画面を拡大・縮小(軸指定) | 長押しからのドラッグ。ピアノでX軸方向、スクロールエリアでY軸方向 | ||
MIDI | |||
Common MIDI共通
| データ構造 | MIDIフォーマットへ出力できる構造 | |
コンバーター | Compositionのデータ構造へ変換・逆変換 | ||
Commnity | |||
Common コミュニティ
共通 | データ構造 | カテゴリ等の曲情報、いいねやお気に入り等のリスポンスを保持 | |
Domain | |||
データ構造 Json形式 | Melody | MelodyTrack, *MelodyPhrase, NoteContainer, NoteBlock, Note | |
Drum | DrumTrack, *DrumPhrase, BeatContainer, Beat | ||
共通化 | Original, Repeat, Syncの3種のPhraseをジェネリッククラスとプロトコルで抽象化 | ||
Service サービスモデル
| SongReder | Jsonファイルを読み込み、Domainのデータへ変換 | |
SongWriter | DomainのデータからJsonファイルへ書き出し | ||
Common | |||
Service サービスモデル
| MidiPlayer | Midiファイルを再生する | |
リポジトリ | 保存データを管理 |
フレーズツールの実装
フレーズの結合
リズム編集領域でフレーズの境目をタップすることで2フレーズを1フレーズに結合します。
フレーズの結合はiOSからの新しい操作ですが、音符の統合も同じような操作(音符間の境目をタップ)なので、違和感はないと思います。
フレーズの分割
リズム編集領域でフレーズ内の小節線をタップすることで、その小節線から左右にフレーズを分割します。
なお、音符がフレーズ外にある時は切り取り、音符がフレーズ間を跨っている場合は長さを短くします。
こちらも音符の分割と同じような操作を意識しました。
通知機構の見直し
通知機構
音符の編集状態
前回はフレーズを変更しても描画に反映されない不具合があり、スクロールをして強制的に描画を要求してました。
これはモデルの通知機構に問題があり、モデルの変更を適切に監視できてないことが要因になっていました。モデルの監視について、ObservableObject
からEventBus
の仕組みに変更することで解決しました。
通知機構の選定など内部的な話はこちらの記事で紹介しています。
描画速度の改善
リズム音符の描画方法を見直し、処理の最適化を行いました。このくらい音符を敷き詰めるとfps10程度になっていましたが、fps20程度に向上しています。
おわりに
フレーズツールの追加実装と通知機構の見直し、描画速度の改善を行いました。
フレーズの結合・分割はmusicLine(Android版)で要望で上がっている機能改善項目です。Androidは基盤が固まっているので修正がかなり大変ですが、iOS版はリメイクするついでに要望も取り入れてます。iOSリリース後に良い機能はAndroidにも反映していきたいと思います。
通知機能は不安定でしたが、かなり安定してきて一安心です。
描画速度が遅いと最後にボトルネックになるので今のうちからちゃんとして最適化しておかないといけないですね。
次は、MIDIのデータ構造へ変換するコンバーターモデルを実装していきます。musicLineの作曲データをMIDIのデータへ変換できると、MIDIプレイヤーで音を鳴らすことができるようになります。