2024.10.01
【勉強】ミドルウェア・アプリケーションのEOL・EOSLについて学んでみた
2014.11.28
プログラミングNGUIあれこれ(Unity)
こんにちは、KTです。
前はUnity関連のメモと同じところに書いてたけど多くなりそうだったので分割しました。
NGUI(Next-Gen UI)の使い方なんかをまとめていきます(こっちも多くなりそうならさらに分割するかも)
縦方向スクロールビュー上に横方向のスクロールビューを配置して、iOSのメールアプリのような動作を実現する場合、NGUIのスクロールビューのみではスクロール方向によってスクロール対象を変更する方法が見当たらなかったので拡張してみました。
※ 以前載せていた方法だと、DrawCall数が多くなりすぎて動作が重くなっていたため、修正しました
以下の動作を実現します。
まずは、以下のような構成でオブジェクトを配置します。
UIRoot(NGUI)
+- Camera
+- ScrollView
+- TableContents
+- CellContents
次に、NGUIのUIDragScrollViewを継承したスクリプトを作成し、以下のように実装します。
using UnityEngine; using System.Collections; public class MyDragScrollView : UIDragScrollView { enum Mode { None, Horizontal, Vertical, } Mode currentMode; Vector2 totalDelta = Vector2.zero; void Start() { currentMode = Mode.None; } void OnPress(bool pressed) { if (currentMode != Mode.None) { base.scrollView.Press(pressed); } // Initialized currentMode = Mode.None; totalDelta = Vector2.zero; } void OnDrag(Vector2 delta) { totalDelta += delta; switch (currentMode) { case Mode.None : // ドラッグ角度(垂直が0) float angle = Mathf.Rad2Deg * Mathf.Atan2 (Mathf.Abs (totalDelta.x), Mathf.Abs (totalDelta.y)); if (angle > 80f) { // drag Horizontal currentMode = Mode.Horizontal; // UIScrollViewにスクロールさせずに、手動でlocalPositionを変更 transform.localPosition += new Vector3 (delta.x, 0f, 0f); } else { // drag Vertical currentMode = Mode.Vertical; base.scrollView.Press(true); base.scrollView.Drag(); } break; case Mode.Horizontal : transform.localPosition += new Vector3 (delta.x, 0f, 0f); break; case Mode.Vertical : base.scrollView.Drag(); break; } } }
このスクリプトをCellContentsにアタッチして、スクロールビューをセットすればOKです。
ポイントはOnDragで渡されるdeltaの角度が横向きの場合は手動でセルを横スクロールし、角度が縦向きの場合のみUIScrollViewでスクロールしている点です。
NGUIのUILabelには、リンク機能や文字装飾機能が備わっています。
UILabelのテキストの、処理を行いたい文字列を[url=(url)]文字列[/url]のように[url=〜]で囲うことで、その文字列がリンクとなります(NGUI上でクリックイベントが受け取れるようになる)
例えば、UILabelに以下のコンポーネントを付与した場合、Test >> click me << Testと表示され、click meの部分をクリックするとfugaとログ出力されます。
public class Hoge : MonoBehaviour { UILabel label; void Start() { label = GetComponent<UILabel>(); label.text = "Test >> [url=fuga]click me[/url] << Test"; } void OnClick() { string text = label.GetUrlAtPosition (UICamera.lastWorldPosition); Debug.Log(text); } }
上記の[url]タグ以外にも、[b]タグ(太文字)、[i]タグ(イタリック)、[u]タグ(アンダーライン)、[(16進6桁)]〜[-](文字色変更)などが用意されています。
NGUIには、多言語化を簡単に実現出来るLocalizationという機能があります。
まずは、多言語化用のファイルを用意します。
Resourcesディレクトリ(無ければ作りましょう)の下に、Localization.csvファイルを作成しましょう。
一行目に、KEY,言語名1,言語名2,・・・のようにして、使用する言語を定義します。KEYという名前は変更出来ません。
二行目以降に、キー名,言語1のテキスト,言語2のテキスト,・・・のようにして各言語毎の文字列を定義していきます。
追加したら一度Unityを再起動しましょう。(重要)
Localization.csv 例
KEY,English,Japanese Button1,Click Me,クリック Text1,This is test.,テストメッセージ
次に、多言語化対象のオブジェクトに、UILocalizeコンポーネントを追加します。
多言語化出来るのは、UILabelとUISpriteのみとなります。UILabelの場合はテキストに、UISpriteの場合はスプライト名に反映されます。
コンポーネントを追加したら、作成したcsvファイルの任意のキーをKeyにセットします。
そうすると、Previewが表示され、EnglishとJapaneseにそれぞれcsvファイルで設定したテキストが表示されているはずです。(もし表示されなければ、NGUIのサンプルのLocalizationファイルが残っていないか確認してください。何故かそちらが優先して読み込まれることがあるようです)
最後に、iOSやAndroid等で動かした時に、システムの言語設定を反映するようにしましょう。
以下のスクリプトを適当なオブジェクトに貼付けてください。
public hoge : MonoBehaviour { void Start() { if (Application.systemLanguage == SystemLanguage.Japanese) { Localization.language = "Japanese"; // csvファイルで指定したキー } else { Localization.language = "English"; // csvファイルで指定したキー } } }
これで多言語化は完成です。
動的にスプライトを切り替える場合の多言語化についても、基本的には同じやり方でOKです。
Localization.csvを作ってUILocalizeコンポーネントを対象のスプライトに追加しましょう。
あとはスプライトを切り替えている箇所でスプライトではなくUILocalizeのkeyを切り替えて反映するだけです。
public class Hoge : MonoBehaviour { // スプライト切り替え時にコールされるメソッド public void SwitchSprite() { UILocalize localize = transform.GetComponent<UILocalize> (); if (localize == null) { // UILocalizeがAddされていない場合はスプライトを切り替える this.sprite.spriteName = "Hoge"; } else { // UILocalizeコンポーネントがあればkeyを変更 localize.key = "HogeSprite"; // keyの変更を反映 localize.value = Localization.Get (localize.key); } } }
Localization.csv
KEY,English,Japanese HogeSprite,hogesprite_en,hogesprite_ja
これでOKです。
【記事への感想募集中!】
記事への感想・ご意見がありましたら、ぜひフォームからご投稿ください!【テクノデジタルではエンジニア/デザイナーを積極採用中です!】
下記項目に1つでも当てはまる方は是非、詳細ページへ!Qangaroo(カンガルー)
【テクノデジタルのインフラサービス】
当社では、多数のサービスの開発実績を活かし、
アプリケーションのパフォーマンスを最大限に引き出すインフラ設計・構築を行います。
AWSなどへのクラウド移行、既存インフラの監視・運用保守も承りますので、ぜひご相談ください。
詳細は下記ページをご覧ください。
最近の記事
タグ検索