メインコンテンツまでスキップ

オリジナルキーボードの作成

IwashiIME では、Unity の uGUI システムを使ってボタンを自由に配置し、オリジナルキーボードを作成することができます。
50音順、フリック入力、QWERTY配列、あるいは特定の定型文専用キーボードなど、用途に合わせた入力インターフェースを構築可能です。

作成の基本フロー​

  1. 土台の作成: キーボードの親となるオブジェクトを用意し、マーカーを付けます。
  2. キーの配置: ボタンを並べ、それぞれの役割（文字入力、削除、エンターなど）を設定します。
  3. 登録: 作成したキーボードを IwashiIME に認識させます。
テンプレートシーンの活用

ゼロから作成するのが難しい場合や、基本的な構造を確認したい場合は、以下のサンプルシーンを開いてください。
作成に必要なコンポーネントがあらかじめ設定されたテンプレートが用意されています。

📂 Assets/IwashiAssets/Iwashiime/Samples/CreateKeyboardTemplate.unity

1. キーボードの登録（親オブジェクト）​

自作したキーボードをシステムに認識させるためには、そのキーボードのルート（親）となるオブジェクトに KeyboardMarker コンポーネントをアタッチする必要があります。

  1. 空の GameObject（または Panel など）を作成します。
  2. Add Component から KeyboardMarker を追加します。
ポイント

この KeyboardMarker がついているオブジェクトが、1つの「キーボード盤面」として扱われます。 これがないプレハブは、オリジナルキーボードとしてロードされません。

2. ボタンの配置と設定​

ボタンの基本構造​

IwashiIME のボタンは、Unity 標準の uGUI で作成します。

  1. Selectable コンポーネントを持つオブジェクト（Image や Button など）を配置します。
    • システム側でクリック判定を行うため、Button コンポーネントの OnClick 設定は不要です。
  2. 対象のオブジェクトに ButtonMarker コンポーネントをアタッチします。
  3. Inspector の Button Type を変更して、そのキーの役割を決定します。

ボタンの種類 (Button Type)​

タイプ説明
Input Button文字を入力する通常のキーです。
Flick Buttonフリック入力用のキーです。（詳細は後述）
Backspace / Delete文字を削除します。
Enter / Send改行（Enter）や送信（Send）を行います。
Full Space / Half Space全角スペース（　）・半角スペース（ ）を入力します。
Caret Prev / Nextカーソル（キャレット）を左右に移動します。
Toggle Caseアルファベットの大文字・小文字を切り替えます。

3. 各ボタンの詳細設定​

文字入力キー (Input Button)​

「あ」や「A」などの単一文字を入力するボタンです。

  • 入力文字の指定: Input Button タイプを選択した場合、入力される文字は子オブジェクトの TextMeshPro から自動取得されます。 ボタンの子階層に Text (TMP) という名前のオブジェクトを作成し、そこに入力させたい文字を設定してください。

フリック入力キー (Flick Button)​

スマホのようなフリック入力を行うボタンです。構造が特殊なため、以下のルールに従って作成する必要があります。

推奨

ゼロから作成するのは大変なため、既存のプレハブをコピーして改造することを強く推奨します。 📂 Assets/IwashiAssets/Iwashiime/Runtime/Prefabs/Common/FlickButton.prefab

構造の解説​

フリックボタンは、以下のような階層構造を持つ必要があります。

  1. Candidates (親コンテナ)
    • フリック入力の候補をまとめる親オブジェクトです。
  2. 方向オブジェクト (Center / Left / Up / Right / Down)
    • それぞれの方向に対応するオブジェクトです。
    • Center: タップ（フリックなし）
    • Left: 左フリック
    • Up: 上フリック
    • Right: 右フリック
    • Down: 下フリック
  3. Text (文字定義)
    • 各方向オブジェクトの中にある Text (TMP_Text) コンポーネントに入力されている文字が、実際に送信される文字 になります。
    • 例：「あ行」キーを作る場合
      • Center/Text: 「あ」
      • Left/Text: 「い」
      • Up/Text: 「う」... と設定します。

4. 文字入力状態に応じた表示の切り替え（EmptyStateMarker）​

キーボードの入力状況（文字が入っているか、空か）に応じて、オブジェクトのアクティブ状態を自動で切り替えることができます。

対象のオブジェクトに EmptyStateMarker コンポーネントをアタッチします。

State Type の設定​

設定値挙動
Active文字が入力されていない（空の）状態 でオブジェクトをアクティブにします。
Inactive文字が入力されている状態 でオブジェクトをアクティブにします。
具体的な活用例
  • Active に設定: 未入力時に入力可能な定型文を入力するボタンを作成できます。iPhoneの ^-^ 等。
  • Inactive に設定 入力された文字をすべて消すための「×」ボタンなどに使用します。文字が入力されていない状態では非表示になります。

4. テーマへの対応（任意）​

自作したキーボードの色を ThemeManager で変更できるようにするには、各パーツに ThemeMarker コンポーネントをアタッチします。

  • Color Type: 適用したい色（Primary, Background など）を選択します。
  • Graphic: 色を反映させる対象（Image や Text）を指定します。
    • 指定しない場合、自動的に自身についている Selectable の ColorBlock が変更されます。

詳細は カスタマイズ ページを参照してください。

5. キーボードアセットの生成（書き出し）​

ボタンの配置が完了したら、KeyboardMarker の機能を使って、配布や登録が可能な形式（Prefab と JSON）へ変換します。

親オブジェクトの KeyboardMarker コンポーネントを開き、以下の手順で設定を行ってください。

1. メタデータの入力​

キーボードの情報を入力します。

  • ID: キーボードを識別する固有のIDです（半角英数、最大15文字）。
    他者作のキーボードと重複しないように Prefix を設定する事を推奨します。必須項目です。
  • Keyboard Name: キーボードの表示名です。必須項目です。
  • Version: バージョン情報（例: 1.0.0）。必須項目です。
  • Author Name: 作者名。必須項目です。
  • Description: キーボードの詳しい説明や使い方などを記述します（任意）。
  • Author Contact: 作者の連絡先（WebサイトのURLやSNSアカウントなど）を記述します（任意）。

2. サムネイルの撮影​

キーボード一覧などで表示されるサムネイル画像を設定します。
Scene ビューでキーボードが良い感じに映るようにカメラアングルを調整し、Capture Thumbnail from Scene View ボタンを押すと、現在の見た目がキャプチャされます。（※IDが入力されていないと撮影できません）
Thumbnail.png という名前でフォルダに配置すれば事前に用意した画像を使用することも可能です。

3. アセットの生成​

Create / Update Keyboard Asset ボタンを押します。 これにより、以下の処理が実行されます。

  1. 設定に基づいた JSON ファイル（定義データ）の生成
  2. キーボードの Prefab 化
  3. Assets/IwashiimeAsset/Keyboards フォルダへの保存
配布について

作成したオリジナルキーボードを配布したい場合は、上記 Keyboards フォルダ内に生成された IDの名前のフォルダ をパッケージ化する事で配布が可能です。

6. 実装（登録）​

最後に、生成されたキーボードアセットを IwashiIME 本体に登録して使用可能にします。
登録作業は、IwashiIME プレハブにアタッチされている KeyboardManager コンポーネントを使用して簡単に行えます。

  1. シーン上の IwashiIME プレハブを選択します。
  2. Inspector で Keyboard Manager コンポーネントを探します。
  3. Keyboard Browser に、プロジェクト内の有効なキーボード一覧（Assets/IwashiimeAsset/Keyboards 内）が自動的に表示されます。
    手順5で正しくアセット化されていれば、ここに自作キーボードが表示されます。
  4. 使用したいキーボードをクリックして選択状態にします（緑色の枠がつきます）。
  5. Selected Keyboards リストで、キーボードの並び順（切り替え順）を調整します。
  6. Apply Keyboards ボタンを押して、設定を反映させます。

これで、IwashiIME で自作キーボードが使用できるようになります。