ラベル NGUI の投稿を表示しています。 すべての投稿を表示
ラベル NGUI の投稿を表示しています。 すべての投稿を表示

2012年12月16日日曜日

NGUIでClipping Panelトラブルシューティング、5つのチェックポイント


NGUIでClipped Panelといえば、複数のアイテムからスクロールしてひとつ何かユーザ選択してもらうのに便利なUIのひとつだ。

ただし、設定が分からなくなって正しく動作しないときに何から調べたらよいか分からないのが難点のひとつだ。

NGUI公式フォーラムでトラブルシューティングの方法をFAQとして準備した様子なので翻訳して紹介したい:

http://www.tasharen.com/forum/index.php?topic=6.0
November 26, 2012, 12:30:19 AM

質問

Clipped Panelが正しくクリッピングされない。原因は?

回答


  1. シェーダがオンであることを確認。すなわちGLES1.1はターゲットに出来ず、Quality SettingをFastestにも出来ない。
  2. ウィジェットで使用するAtlasがUnlit/Transparent Coloredシェーダを使用していることを確認。もしSimple Textures (UITextures)が含まれるならば、それも、このシェーダとなっていることを確認。
  3. Clipped Panelが均一にScaleされていること:(1,1,1)
  4. クリッピングしたいウィジェットは、クリッピングされているパネルとの間に余分なパネルがあると正しく動作しない。Panel Toolを開き、クリップしたいウィジェットを選択し、どのパネルが選択表示(ハイライト表示される)されるか確認すること。もし、選択表示されているのがクリッピングされているパネルでない場合、削除すべき余分なパネルがあることを意味します。
  5. シェーダが正しくロード出来ることを確認。NGUIのResourcesフォルダを誤って移動していないか確認すること。

--------

NGUIで便利なUIを使いこなそうぜ!

2012年10月12日金曜日

NGUI 解像度調整機能が縦(Height)にしか対応してない

最近iPhone5が縦長になったことにより、NGUIで解像度調整に苦労する事例が増えている。

テラシュールウェア:[Unity3D]NGUIで作った画面をiPhone5の解像度に手っ取り早く合わせる
http://terasur.blog.fc2.com/blog-entry-285.html

根本原因は明らかで、NGUIの解像度調整機能が縦(Height)にしか対応していないことが要因だ。しかし、どうやらこの問題も次回バージョンでは対応される可能性が出てきた:
本件はNGUI2.2.6で修正されました:
http://gamesonytablet.blogspot.com/2012/11/ngui-224-225-226.html

~2012/11/17追記~
しかし、NGUI 解像度調整機能について、2.2.6バージョンではWidth対応まではしておらず回避策を含めたのみだ。

詳しくは、機会あれば別記事としたいが、理由は現時点だとコードが複雑になり影響範囲も大きいためとのことでよりエレガントな解決策が見つかれば対応する、と将来的な課題になった。
~追記ここまで~


http://www.tasharen.com/forum/index.php?topic=1933.0
October at 04:41:22 AM

【質問のまとめ】
iPhone5だと上記のとおりボタンがはみ出てしまう。iPhone5の解像度にあわせて調整する機能はないだろうか?

現行機能はAutomaticとHeightの組み合わせしかインスペクタに表示されないけど、Widthもインスペクタに表示してHeightと同等の機能はつけられないだろうか?

【回答】
なるほど。10/12以降どうするか検討してみることにするよ!
-----

しかし、質問のタイミングが絶妙だな??誰かテラシュールウェアの記事を見た人による機能追加リクエストかもしれないな・・・

みんなの意見でNGUIをより便利にしていこうぜ!

2012年10月11日木曜日

【ちょっと一息】PhotoshopからNGUIにインポートするプラグイン

NGUI公式フォーラムでPhotoshopからNGUIのAtlasに取り込みできるプラグインを開発している方の紹介が話題を集めていたので紹介します。

需要がある機能か私は「?」なのですが、フォーラムではアルファー版を試したいという方が多いようです:

http://www.tasharen.com/forum/index.php?topic=1906.0

October 04, 2012, 01:00:06 PM

こんにちは、Monster Juiceのリード開発者のBruon Mikoskiです。PSDからUnityのNGUIにダイレクトにGUIをインポートできるプラグインを開発しました!。他の方にも便利となるようベータテストを行っていきたいと考えてます。

アルファー版のビデオおよび操作方法
http://youtu.be/UDvoYx1N2e0

ダウンロード先リンク
https://docs.google.com/open?id=0Bx3gW3IbiR_sdVlBRDlkTHJBaUE

機能
  • フォトショップのPSDで作成したGUIを完全にUnity3Dに移行し同じ結果が得られる
  • 配置(Positon)の調整に時間と手間をかける必要がなくなる
  • アンカーは空のGameObejectで作成
  • GUIを手動で作成するより十倍早い
  • PSD上の編集で配置(Positon)を更新する
  • 頭文字で自動判定してウィジェットを作成する(例 "btn"を頭文字にした場合にImageButton作成)
---------

ビデオをチェックすると、Fontをインポートするのはまだ出来ない様子。まあ、まだ今後に期待ってとこかな?

2012年10月6日土曜日

NGUI 空白だらけのAtlasを解消する

今回の投稿はNGUIで無駄に空白だらけのAtlas作成を未然に防ぐ方法について。

公式フォーラムより翻訳します:

http://www.tasharen.com/forum/index.php?topic=1608.0
September 10, 2012, 07:17:14 PM

質問
SD、HD両方の解像度の英字フォントを作成してひとつのAtlasにまとめたんだけど、空白だらけになってさらに巨大化(2048x2048)になってしまったのだけど、どこで間違えちゃったかな?

回答
一般的なコツは2のべき乗サイズより1ピクセル小さいサイズにすること。たとえば1024x1024をターゲットにしているなら1023x1023にする。

ただ、添付してくれた画像をみるとこの場合は600x600ぐらいにしたら完璧じゃないかな。
-----

へえー。1ピクセルだけ下げとくのは余白を1つとる、ということなのかしら?いまひとつ理由が書かれてないのが残念だけど、何かのときに試す価値ありそうだな。

小さなテクニックを積み重ねてNGUIをマスターしようぜ!

2012年10月4日木曜日

NGUI 描画順について

公式フォーラムでNGUIの描画順について作者からの説明があったため翻訳内容を共有したい:

http://www.tasharen.com/forum/index.php?topic=1858.0
October 01, 2012, 04:55:59 PM


FAQに書いても人がそれを読んでくれないことが良くわかったのでフォーラムの目立つ位置に付箋を貼ることにしたよ。いまでも毎日この質問が出てきて困っているんだ。

問い合わせ
Depthをウィジェットに設定しても前後関係がおかしいことあるけど何で?

Depthプロパティは同一パネルの同一Atlasのウィジェットの描画順を判定するのに使用される。異なるAtlasを使用してるのであればTranformのZ座標を変更してウィジェットをカメラの一番前に移動してほしい(Zをマイナス値にする)。もし異なるパネルを使用しているのであればパネルのTransformのZ座標を一番前に移動したいパネルについてZ値をマイナス値のより小さい値に設定してほしい。そもそも、出来ることならばAtlasがひとつになるように管理できれば理想的で、その後の負担も多いに減る。

技術解説
通常UnityはすべてをTransformのZ座標でソートを行う。カメラに近いオブジェクト(より小さいZ座標)はより遠いオブジェクト(より高いZ座標)の前に重なるようになる。これはUIが平らでOrthoカメラであれば何ら問題はない(2D UIの場合)。しかし3D UIについては少しでもウィンドウを回転させることはウィジェットへの距離を変更するため、このアプローチの意味がなくなる。この理由によりDepthという概念を作成した。固定の値であるため、Transformの値変更にかかわらず一定の値となる。残念ながら異なるDraw Callの場合にDepthを強制的に参照させることができないため(別パネル/Atlasは異なるDraw Callになる)、どうしても異なるパネルやAtlasの場合はZ座標を調整するしかない。
--

正直、日本語サイトですでにこの問題は丁寧に検討されたスライドが存在していて、あえて付け足すところはないようにおもう。

「もののけ大戦“陣”」製作事例
http://www.slideshare.net/RyoheiTokimura/ss-14048278
※スライド#44~#50あたり

ただ、スライドをみてもこれについて悩んでいる人は多いと感じる。作者のほうでも新たな手立てを考えてくれないかな??

2012年10月2日火曜日

NGUI2.2.0以降のUIAtlas変更について

このブログで記載したNGUI2.2.0のバージョンアップについて質問をいただいた事項があったので私自身の回答を含めて投稿します。

なおいつものブログ投稿内容とちがって、公式フォーラムの回答ではないので何か間違っているかもしれません。その点ご承知おきください。

【質問】
UIAtlas の Show ポップアップリストで、Sprite と Atlas を切り替えてプレビュー出来たと思うのですが、その機能はなくなってしまったのでしょうか?

【回答】
結論からいうとこの機能はなくなっている。

まず、質問にあるとおりNGUIでは2.20より前のバージョンのUIAtlasでShowの横をクリックするとポップアップリストが表示されていた。
しかし、NGUI 2.20のバージョンアップにてUIAtlasに大きな変更が入った。

NGUI 2.2.0
http://gamesonytablet.blogspot.jp/2012/09/ngui-220.html


NGUI2.2.0以降ではSpriteしか表示されず、「Select a Sprite」という別ウィンドウにて検索窓つきで表示される方式になる。
 残念ながらこの方式だとAtlas全体をみることが出来ない。

ただしオブジェクトのImport Settingsをみれば今までどおりプレビューぐらいはみることができるし、別ウィンドウでスプライトを変更する都度にInspectorのDimensions, Border, Settingsは動的に変更されるようなので困ることまではないのかもしれない。

では作者はそもそも新UI Atlasで何を改善したかったのか、ということになる。

これはNGUIメニューからCreate Widgetを選択すると違いが明らかになる。

2.2.0より前のバージョンではパネルに追加される画像が表示されない。以下の例ではSpriteの名称のみHoneycombとだけ表示されるため、追加してみるまでどのようなSpriteであるか分からなかった。

一方、2.2.0より後のバージョンではNGUIメニューからCreate Widgetを選択するとさきほどのSelect a Spriteという画面からパネルに追加する画像が表示されるように変更になっている。
うん、確かに画像が表示されたほうが便利なのは明らか。

しかし、質問者のいわれるとおり、Atlas全体を表示する機能をなくす必要がなかったのではないか?との疑問は残る。ここは推測になるが、Import SettingsでAtlas全体はもともと参照できるので、個別にSpriteを表示する画面はCreate時と共通にしたかったのかもしれない。
----

最後のあたりはどういう背景かのことなので、推測になるがどうしても必要な機能があるならばNGUI公式フォーラムで仕様変更希望(feature request)を英語で記載すれば作者が直す意向があるかは質問した日に回答してくれる傾向にある。


やっぱりNGUI作者のアセット修正の意欲はすごいなー!

2012年9月28日金曜日

Unityプログラミング応用(エディタ編集)~その3

前回に引き続きプログラミング応用編として、Unityエディタの編集に関して学習していきたい。
リンク先のウェブサイトの記載と併せ、ポイント解説の翻訳を見比べてほしい:

http://catlikecoding.com/unity/tutorials/star

GUILayoutボタンはどのような働きをする?
メソッドのGUILayout.Buttonはボタンを表示し、かつクリックされたかどうか値を返す。普段使用するときはif構文のなかで呼び出しを行いそのコードブロックの中で必要な処理を行うようにする。
GUIメソッドのなかで実際に起きる流れであるが、デモのケースではOnInspectorGUIが一度ならず呼び出しが行われる。レイアウト処理、再描画、有効なGUIイベントの発生(よくあるケース)、等の際に呼び出しされる。マウスクリックイベントがボタン上で発生したときのみtrueを返す。
理解を深めるためにはDebug.Log(Event.current);をOnInspectorGUIメソッドの最後に追加するなど、テストすると良い。
通常は心配する必要がないが、テキスト生成など重い処理の際には認識する必要がある。必要性もないのに1秒あたりに何度も発生させたい処理ではない。

新しい配列要素は何が入る?
SerializedPropertyを通して新しい配列要素を挿入した場合、新しい配列要素はその一つ手前の要素の複製になる。もし最初の要素である場合はデフォルト値が入る。

ValidateCommandって何?
GUIイベントのひとつであるValidateCommandは特別のアクション(元に戻す、やり直し等)の発生を示す。ExecuteCommandに近い印象があるが、このコマンドタイプは別にあり、意味がわずかに違いつつ全く同じ目的で使用することになる。残念ながらどこでチェックをして、GUI設計の内容によってどちらかのイベントだけが発生して両方ともには発生してくれない。正直どうしてなのかは分からない。
そうすると安全に対処する方法は両方ともチェックすることだ。この場合にかぎっていえばValidateコマンドをチェックすることで要件は満たせているようだ。

breakって何? キーワードbreakを使ってループから抜け出すことが出来る。複雑な条件があって早い段階でループを抜け出したい場合に便利だ。
for(int i = 0; i < 100; i++) { if(i == 5) { break; } DoStuff(); }
と同じ結果になるのは:
for(int i = 0; i < 5; i++) { DoStuff(); }

foreachって何?
forループの便利な代替手段がforeachだ。通常のforループに比べてオーバーヘッドがあるので自分はゲームコードでは絶対使わない。だけどエディタコードで反復する整数が不要な場合は気にせず使用する。
foreach(Star s in targets) { s.UpdateStar(); }
と同じ結果になるのは:
for(int i = 0; i < targets.Length; i++) { Star s = (Star)targets[i]; s.UpdateStar(); }

OnSceneGUIはどうしてtarget引数が必要?
下位互換のためとおもわれる。マルチオブジェクトのエディットはUnity3.5から導入された。その前のバージョンはtargetしか変数がなかった。

ワールド座標にどうやって変換する?
ローカル座標をワールド座標に変換するためにはオブジェクト階層のTransformマトリクスを適用する。Unityはシーンのレンダリングで自動処理してくれるが、自ら行う必要があるケースが存在する。この場合はTransform.TransformPointメソッドを使う。

ローカル座標にどうやって変換する?
ワールド座標に変換する場合とまったく逆のステップをまったく逆順序で行う。Tranform.InverseTranformPointメソッドを使う。注意点としてワールド座標の場合はさきに回転(rotate)してそれからtranformを行ったが、元に戻すためには順序を逆にしてtransformを先に行って逆変換(invert transform)をローカル座標で行う必要がある。

スナップショットって何?
もし元に戻すステップを各々のGUIイベントに用意すると、ハンドルをドラッグする操作は何十もの修正ステップに対する元に戻す操作履歴が必要になってしまう。だから代わりにハンドルはオブジェクトのコピー、すなわちスナップショットを作成してして操作に対するひとつだけの元に戻す操作履歴ををその動作が終了したタイミングで登録する。SetSnapshotTargetはどのオブジェクトを用意すればよいかを取得できる。
すべてのUnityエディタGUI要素は本質的にこれと同じで、ハンドルのドラッグ、数値スライド、テキスト入力、あるいはその他の要素であれ同様である。
-----------

Unityエディタ編集は覚えることを面倒くさがらず、うまく使いこなすと結果的に生産性があげられる、というのがポイントだとおもう。

一人でも多くUnityのエディタ編集をマスターしよう!

2012年9月27日木曜日

Unityプログラミング応用(エディタ編集)~その2

前回に引き続きプログラミング応用編として、Unityエディタの編集に関して学習していきたい。
リンク先のウェブサイトの記載と併せ、ポイント解説の翻訳を見比べてほしい:

http://catlikecoding.com/unity/tutorials/star

構造体(struct)を使用しないのはなんで?
Star.Pointが軽量でありデータは常に全てが必要であるため、構造体にすることでオブジェクトのオーバーヘッドを回避することは意味があるといえる。しかしUnityはカスタムの構造体の型をサポートしていない。だから格納したいものには、データをバンドルするクラスを使用せざるを得ない。
オブジェクトのオーバーヘッドやNullエラーの可能性が気になるのであればオフセットおよび色データを別の配列に保存することは可能である。しかし、その場合にはこれらの配列が同期していることを保証する必要がある。それも実現可能ではあるが、クラスにするアプローチがより簡単である。このデモで使用した理由はそのためである。

オーバーライド(override)は何をする?
オーバーライドは親クラスのメソッドを上書きするときに用いる手法。virtual定義されたメソッドのみオーバーライドできる。このデモのケースにおいてはUnityが型を正確に知らなくてもエディタのOnInspectorGUIメソッド呼び出しを行うことが出来る。
だとするとUnityのStartやUpdateイベントめせっどはoverideキーワードが必要なのだろうか。答えはNoでUnityは自らのイベントメソッドを機能させるためには別のアプローチをとっているためである。
じゃあOnInspectorGUIがUnityのイベントメソッドではないのはなんでだろうか?答えは分からないが何かが整合性ご取れていないかレガシーのコードなのであろう。

SerializedObjectって何?
クラスのSerializedObjectはUnityオブジェクトのラッパー(wrapper)あるいはプロキシとして機能する。ブラックボックスのように何が入っているか分からずともデータをオブジェクトから抽出するのに使用することが出来る。Unityインスペクタが自身で作成した何かに対してもデフォルトのインスペクタを表示できるのはこのためである。元に戻す機能も無償で付属する。

EditorGUILayout?って何?
クラスのEditorGUILayoutはUnityエディタで表示するための便利ユーティリティである。さまざまな描画を行うメソッドが含まれ、デモのケースではSerializedPropertyを描画するためのみにしようしている。
EditorGUIクラスも似たような便利ユーティリティであるが、この場合は自らGUIレイアウトを処理する必要が出てくる。

GUIContentって何?
GUIContentはラッパー(wrapper)オブジェクトでありテキスト、テクスチャ、ツールチップ(ToolTip)などラベルに使用するものが対象。

GUILayoutをEditorGUILayoutの代わりに使用するのはなんで?
ゲーム開発に普段使っているUnity GUIを使用するので問題ない。GUILayoutは基本的なラベルやボタンの機能を提供する一方でEditorGUILayoutはエディタ特有の入力フィールドなど保持している。
-----------

次回はいよいよ最後のまとめ!プログラミングのポイントを押さえて、Editorを使いたおそう!

2012年9月19日水曜日

Unityプログラミング応用(エディタ編集)~その1

UnityのInspectorは他の開発環境にない便利さを提供してくれる。リアルタイムで変数を変更したり、オブジェクトをドラッグしたり、さまざまな機能がありゲーム開発を効率的に作業できるようになっている。

このエディタをさらにカスタマイズすることが出来る。ただしそのための作法(プログラミング方法)を学ぶ必要がある。

なぜそこまで手を入れる必要があるのか?答えは簡単で、「さらに楽をするため」である。Inspector上でスクリプトがおもいのままに変数をリアルタイム編集できると、何度もプログラムを実行する必要がなくなる。

プログラミング応用編として、過去に紹介したウェブサイトの内容が非常に優れており、そこに書かれているポイント箇所を翻訳する形で学習を進めていきたい。併せてリンク先を参照いただきながらみていってほしい:

http://catlikecoding.com/unity/tutorials/star
メッシュ(Mesh)って何?
概念的にはメッシュはグラフィックスのハードウェアにより用いられる構造体であり複雑な描画に活用される。三次元空間の点の集合と三角形(基本的な二次元形状)から定義される。三角形はメッシュが表現しようとしている物体の表面を構成する。物体そのものはリアルに描かれるため実際には三角形の集合をみていることに気づかないほどだ。

クラスの属性って何?
クラスの属性はクラスにつけられるタグのようなもので、Unityがクラスをどう扱うか変更することができる。デモのケースではUnityに必要なコンポーネントがあるか確認させていて、このコンポーネントを追加するゲームオブジェクトに必要なコンポーネントが揃っていることを保証する。

typeofはどう使う?
演算子typeofによりクラス等の型オブジェクトを取得する。変数に対して使用することはできず、明示的な型名でしか使用できない。
クラス名をそのまま使用しない理由は明確でコンパイルエラーになってしまうためだ。あえてクラス名をそのまま使用しないのは型を変数に変換する必要があるためだ。

forループの変則的な使用法は?
for構文のなかで、複数のステートメントを反復宣言に入れて増分させることが可能。変則的な点はコンマで反復、増分それぞれの箇所に記入する必要がある点だ。
for(int iA = 0, iB = 0; iA < 10; iA++, iB++) { DoStuff(iA, iB); }
と同等の記入方法は
int iA = 0, iB = 0; while(iA < 10) { DoStuff(iA, iB); iA++; iB++ }

CGPROGRAMは何をする?
Unityエンジンからグラフィックカードにデータフローがあり、頂点ごとに処理される。次に頂点間の補間データが個々の頂点から個別のピクセルの描画までのデータフローの処理がある。デモのケースではポジションおよび色データのデータフローが処理される。このケースではさらに、頂点のポジションをワールド座標からスクリーン座標に変換するという点が追加処理となる。
CGPROGRAM文の上にある構文はデフォルトのライティング、Zバッファともにオフにする命令文である。カリングもオフにしているため三角形の両面(正面のみならず)を見ることが出来る。Blend SrcAlpha OneMinusSrcAlphaはデフォルトのアルファブレンドであり、透明を扱うことが出来る。

固定機能シェーダがないのはなんで?
固定機能シェーダは現在では使用されていない。またCGPROGRAMを使うことでUnityのスクリーンピクセルの変換が明示的になる。

Nullとサイズの両方をチェックするのはなんで?
新規作成されたとき、スターのコンポーネントはまだ配列がない。技術的にも配列を後でNullに設定することも可能である。エラーを未然に防ぐためにもその点は良く注意しておく必要がある。配列が存在する場合だけサイズをチェックする必要がある。
--------

繰り返しになるがリンク先ではエディタのプログラミングがより詳細が書かれており、ステップごとに丁寧に画面操作が一から書かれているので時間ある際に必ず併せて見てほしい。

次回も引き続きエディタのプログラミングについてみていきます!

2012年9月17日月曜日

NGUI ゲームのコンフィグを簡単保存!

ゲームを作成するとき、音量のオンオフやいくつかの設定をコンフィグとしてあらかじめ準備することが多い。

この際、UnityでNGUIを活用する場合はUIPopupListで「EASY, NORMAL, HARD」としたり、UICheckboxでチェックボックスなどコンフィグに使いやすい。

しかし、次回にもゲームを起動したときにその設定は保存しておきたいもの。セーブデータほどのものでない場合はPlayerPrefsというところに簡易に保存できるが、NGUIにはスクリプト記述せずに保存できる方法がある。

http://www.tasharen.com/forum/index.php?topic=88.0

September 09, 2012, 05:23:16 PM



質問のまとめ
PlayerPrefsに各種設定を保存して、Awake()のなかでUICheckbox.isCheckedをTrueやFalseをPlayerPrefsから読み込む方法をとっているんだけど正しいやり方かな?

回答のまとめ
それでも出来るけど、UISavedOptionのスクリプトをアタッチするだけで自動的にチェックボックスの値は保存できるよ(ラジオボタンのグループも同様)。
ちなみにラジオボタンについてはグループのルートアイテム(radio root)にアタッチする。それ以外の場合は個別のチェックボックスにアタッチする。
-----

コンフィグ設定を保存するにはコードいらず。アタッチするだけ。便利だね!

細部まで覚えてコードいらずにしよう ! NGUI!

2012年9月15日土曜日

NGUI 【ちょっと息抜き】作者がiPadもってない!

今日は土曜日なので息抜き。

NGUI公式フォーラムの質問のやりとりで、薄々は気づいていたものの、すっかり分かってしまった。。。。作者はiPadを持っていなかった!!

まあ他の色んな回答をみてたら、そうかもなとはおもってたけど、iPad3も出てかなりたつ現在、たしかカナダに住んでいるはずの作者ならiPadぐらい持っているんじゃないかとおもってたが、動かぬ証拠があったので、ちょっと翻訳。

http://www.tasharen.com/forum/index.php?topic=1635.0
September 13, 2012, 08:38:29 PM

質問のまとめ
キーボードを表示/隠すためのAPIを探してたんだけど、UIInput.csの200行目から250行目のコードで表示はうまく行くけどキーボードを閉じる時に問題がある。タップが終わった後にDoneボタンを押すと、onSubmitを使って適切にイベントをキャッチしてくれる。(291行目のonSubmitのデリゲート)だけど右下のボタンでキーボードをクローズするとうまく動作しないんだ。

どうやったらこのイベントをキャッチできるのか、それからキーボードを閉じる時にいつでもOnSelectを使うの?うーん、テストした限りでは閉じるとキーボードからフォーカスがなくなるとOnSelectが呼び出されるんだけど、必ずしもキーボードを閉じるのとは連動してない様子。

作者回答
え?良く分からないなー。どうやってソフトキーボードでSubmitせずに閉じるの?右下のボタンって自分はEnterキーだよ?

親切な通りがかりの人(の続き)
iOSキーボードはキーボードを閉じるためのボタンがあるけど、NGUIのSubmitと連動しないんだ。iPadだけかも知れないけど、この画面コピーに右下をみてよ。


作者回答(の続き)
おおーー!面白いなー、画像つけて有難う。で、そのボタンを押すとどんなイベントが通知されるのかなぁ?
-------

ちなみに、回答はまだ途中で作者の名誉のためにいうと、対応はまだ検討中。イベント名分かったら修正するんだろうね。Tasharenの中の他の人のiPadでテストちゃんとやってくれるんだよね???

早くiPad買ってよ ! NGUI作者!

2012年9月5日水曜日

NGUI画面サイズを取得する場合の注意


皆さんはゲーム開発のときに画面サイズを取得したスクリプト書いていたりしますか?

マルチプラットフォーム対応する場合はハードコードせずに対応したいもの。

その際に注意すべきフラグなどもあることが分かったため、今回は作者サイトから関連FAQを翻訳した:
http://www.tasharen.com/forum/index.php?topic=1214
July 31, 2012, 05:07:51 PM

質問
NGUIでのUI作成を順調に進めている。そのなかで悩んでいることがあるんだけど、状況としてはカメラをプラットフォームの解像度に合わせるなかで、今は解像度の異なる画面サイズにあうように自分でオブジェクトの大きさを手動指定している。

問題はScreen.widthをコールして画面横幅を取得してるが、Unity Editorの画面サイズしか値が取得できてないがために、カメラの座標系とずれちゃっていること。(つまり、カメラは1280×720でUI Rootになっているんだけど、Unity Editorが16:9の小さい画面にしているような状況とか)NGUIが相対サイズを計算してくれることは分かっているんだけど、どうも自身で変更できる方法がわからず、読取り専用なので困ってます。どうやったらカメラの表示範囲での画面サイズを取得できるんでしょう?pixelHeightもpixelWidthを使ってもエディタの画面サイズの各々の高さ、幅の値を取得してしまっている様子。

回答
UIRootのautomaticチェックボックスを外してみて。それだけで画面サイズが読取り専用でなくて手動指定できるようになるよ。
-----

知らなかったけど画面サイズを取得するだけでもオフにすべきパラメータがあるのか。これは盲点だね。

勉強してマスターしようぜ!NGUI。

2012年9月2日日曜日

NGUI 連続押下イベント

今回はボタンの連続押下イベントから。 スペースキーを押している間は何度もスペースが押されますよね?あれはNGUIでどう実現するのでしょう。

http://www.tasharen.com/forum/index.php?topic=1407


2012/8/19 at 03:43:23 AM

質問
ボタンを押している間、一定間隔で繰り返し押下イベントを発生させるにはどうしたら良いですか?

回答
スクリプトをボタンにアタッチすれば一発解決です~



using UnityEngine;

public class RepeatButton : MonoBehaviour
{
    public float interval = 0.25f;

    bool mIsPressed = false;
    float mNextClick = 0f;

    void OnPress (bool isPressed) { mIsPressed = isPressed; mNextClick = Time.realtimeSinceStartup + interval; }
    
    void Update ()
    {
        if (mIsPressed && Time.realtimeSinceStartup < mNextClick)
        {
            mNextClick = Time.realtimeSinceStartup + interval;

            // Do what you need to do, or simply:
            //SendMessage("OnClick", SendMessageOptions.DontRequireReceiver);
        }
    }
}
--------

NGUIフォーラムで投稿された質問ですが、驚くべきことにわずか5分以内にスクリプト付きで回答が返信されてました。

うーん、おそるべし ! NGUI!

2012年9月1日土曜日

NGUI Unity4 New GUIに対抗、大幅変更を予定?


NGUIのUnity4対応だが、これまではマイナーバージョンアップを繰り返しているのみの印象である。

しかし、つい数日前にUnite2012のNew GUI Systemビデオが公開され、ユーザからは「NGUIはいつどうするの?」という声がNGUI公式フォーラムであがるようになっている。

これに刺激を受けてかどうかは分からないが、どうやらNGUI作者は10月にいくつか大きな変更を予定しているようである。

公式フォーラムでのNGUI作者コメントを翻訳する:

http://www.tasharen.com/forum/index.php?topic=1534.0
August 31, 2012, 02:27:15 PM

NGUIについて、いくつかの新しい機能を10月にリリースすることを考えていて、その時期はバカみたいに忙しくないんだよ(IGFコンペティションが10月期限で今は頭が一杯で)。皆さんも安心してほしいけど、NGUIは引き続き開発を継続するしさらに拡張をしていくつもりで、10月のリリースではユーザビリティや大規模プロジェクト(およびサイズの大きいAtlas)にも対応させるつもりだ。

今は10月といってるけど微妙なところ。もしかするとそれよりも早くできるかもしれないけど、まあ見ていてよ。
---------

いつものことだがUnity4での大幅変更を期待しているぞ!NGUI!

2012年8月30日木曜日

NGUI Flashビルドのメモリリーク


今回はNGUIのFlashビルドでのメモリリーク報告について。

公式フォーラムの投稿より翻訳します:



http://www.tasharen.com/forum/index.php?topic=1471

August 24, 2012  at 05:16:46 AM

質問
ゲーム開発においてUnityの標準UIコンポーネントからNGUI2.1.4に切替をしている。残念ながらFlash開発に課題がある。内容はFlashで実行するときに発生して、アイドル状態でもメモリが膨れ上がり続けるものだ。
たとえばプレイヤーが何もせず、メインのゲームオブジェクト作成が行われていないにも関わらず。使用メモリは1GBを10分で超えてしまうんだ!同一条件(ゲームがアイドル状態)でNGUIを外すと(シーンから全ての
NGUIゲームオブジェクトを外す)メモリ使用は安定していてメモリリークは見られない。

短時間の調査(TheMinerプロファイラ)でNGUIがUINode.HasChanged()メソッドを頻繁に使用していてこれがUnityエンジンのコード内部でメモリをコピーしているようだ。テスト目的でこのボディ部分をコメントアウトしたところ
メモリ使用は抑えられたようだ。UINode.HasChanged()以外で同様にNGUIコンポーネントでUnityエンジンのメモリコピーにつながるものがある様子。

まだまだNGUIは愛してやまなくて、使用し続けたいのだけど、何か良いアドバイスないですか?

回答
FlashバグだからUnityに知らせてもらうしかないね。HasChanged関数ではいくつかのイコールチェックのほかないよ。
コードをつけるね:

#if UNITY_3_5
    bool isActive = mGo.active && (widget == null || (widget.enabled && widget.color.a > 0.001f));
#else
    bool isActive = mGo.activeSelf && (widget == null || (widget.enabled && widget.color.a > 0.001f));
#endif

    if (lastActive != isActive || (isActive &&
        (lastPos != trans.localPosition ||
         lastRot != trans.localRotation ||
         lastScale != trans.localScale)))
    {
        lastActive = isActive;
        lastPos = trans.localPosition;
        lastRot = trans.localRotation;
        lastScale = trans.localScale;
        return true;
    }
------- 
んー。Flashでメモリリークかー。Unity仕様といっているけどもうちょっとNGUI側でも調べてもらいたいものだけど仕方ないのかな。

 バグフィックスされたらちゃんと知らせてね!NGUI!

2012年8月20日月曜日

NGUI UIの配置変更と注意事項


今回はNGUIでのボタン配置に関する話。簡単なようで思い通りにいかない場合ありますよねー

http://www.tasharen.com/forum/index.php?topic=1367.0
August 14, 2012, 03:28:00 PM

質問
1)ボタンの右寄せ、左寄せは可能ですか?
 画面の例では:Settingsボタンをスクリーン右端に設定し、残りは相対的に右寄せにしたい
2)ボタンの衝突(Collider)判定は動的に変更できますか?
 たとえば:ボタンを一個だけ作成してラベルのテキストを変更して2倍の大きさになった場合、衝突(Collider)判定がそのままの大きさなのですが、
 どうすれば良いですか?



回答
1)UIAnchorをアタッチすることでアンカーが横にくっつくように指定できるよ
2)NGUITools.AddWidgetCollider関数をテキストの大きさを更新した後に呼び出すだけで衝突(Collider)判定の大きさは修正できるよ
----

衝突判定の動的変更が必要とは気づかなかった。テクニックを磨こうぜ!NGUI!

2012年8月15日水曜日

NGUI ドラッグパネルのパフォーマンス

今回はドラッグパネルのパフォーマンスに関するディスカッションから。



http://www.tasharen.com/forum/index.php?topic=1338

質問(常連メンバーAさん)
NGUIをしばらく使ってみてNGUI/Unityで悩んでいることがあって他の人も同様の
状況がないか教えてほしい。

1.Draggable PanelがiPhone4で遅い。iPad2, iPhone3, iPhone4Sは大丈夫。でもDraggable panelがひとつあるだけ、それもiPhone4だと遅い。それしかシーンにないのにパフォーマンスが激重。何か間違えた?でも実際問題、私が重く感じている。シェーダの問題?iPhone4のFillrateが悪いと聞いたことあるけど関係ある?
2.メニューをオブジェクト名、カメラ、パネル、アンカー等で作成してメニューを独自で作成する場合。質問はカメラのことで、たとえば「タイトルスクリーン」ってメニューをひとつのオブジェクトに格納したとして、カメラはひとつだけ使用したとする。もしゲームのメニューとチャットウィンドウに別アセットを容易したらパフォーマンスに悪影響出る?
カメラを3つか4つあると確実にパフォーマンスが激重になる?だとしたらUnityの仕組みがよく分からないし、もし複数カメラがあった場合、それぞれ別のコールが行われて、Draw Callを余分にコールするのとどんな違いがあるのか。
(とくにカメラが別レイヤーでレンダリングされてるのであれば)
3.UIDraggablePanel
ドラッグパネルのリストにて使用オブジェクトが1000あるけど画面表示されるのが10個の場合、1000オブジェクトをあらかじめ生成するのと動的に生成するのとどちらがよいのか?iphone 4でUIDraggablePanelパフォーマンスが落ちる点と連動して関係あるのかなと考えているのですが。

コメント(初心者Bさん)

んー、UI Root配下にひとつのレイヤーでひとつのカメラがベストじゃなかったかな?あと画面外に大量の非表示オブジェクトがあっても配置(geometry)が変わらないならパフォーマンスに何の影響もないんじゃないかな?(パネル全体を動かすのは配置変更に当たらないとおもっているし)

ただ、動的に生成するのがパフォーマンスに悪影響は作者さんに回答おまかせですー。

回答
Draggable Panelは正しく設定することで十分なパフォーマンスを発揮するので、実際にデモのパフォーマンスを見てほしい。その時にパネルの中のものをドラッグするときには配置情報を更新し直す必要あるのでパフォーマンスは当然に落ちる。パネルそのものあるいはUIDraggablePanelのドラッグは実際には何も動かす必要ないためレスポンス早い。

パフォーマンスをさらに早めるにはstaticにすることでウィジェットの大きさ、色、位置が変わらない。これは無駄なチェックを外すのでパフォーマンスが向上する。

賢くやるなら、デフォルトでstaticにしておいて、パネル変更が必要なときにstaticeを外す方法がある(ボタンクリックの時に外す、等)。次のフレームでまた元に戻せば良い。

あと複数カメラはひとつのカメラより確実にリソース消費する。私自身が作成してるWinwardでもカメラはひとつであり、その下に必要なウィンドウがアンカー付でたくさんついている(必要なときまで無効化)。

追加質問(常連メンバーAさん
Bさんの指摘は認識している。確かにUIPanelは別の配置(geometry)を必要としておりDrawCallを余分に消費するので、複数のUI Panelをさらにパネルのなかに入れ込むことは遅くなる要因だ。自分の場合にはUIDraggablePanelではNGUIデモと同じ設定にしてて、パネルだけ動かしてオブジェクトは動かしていない。

ところで、UIPanelをネストしてUIPanelの中にあり、かつ片方がstaticで片方がstaticでない場合は結局static扱いになるのだろうか?
たぶん親が優先されると考えているのかな?自分のプロジェクトでパフォーマンス低下の要因として説明つくのはUIPanelにあるDraggablePanelしか考えられず、ただ二つ目のUIPanelはドラッグ可能であるにも関わらず一つ目をドラッグ不可能としていることである。

追加回答
ネストされたパネルはすべて別エンティティとして扱われる。staticも子が優先され(親から子への)継承は行われない。
----

パフォーマンスに関する議論はケースバイケースだと認識している。ただし、色々なケースにおいて実際の利点・欠点の情報が共有されることで、個々のプロジェクトについて正しい判断が出来るものだ。Unityは日本でも勉強会やセミナーが活発なので、そういった所で議論されたうえでさらに情報の公開が進むことを強く望む。

もっと活発な議論をしようぜ! NGUI!

2012年8月14日火曜日

NGUI 背景をボヤかすテクニック


今回の記事はゲームで開発しているウィンドウを表示したときにその背景をボヤかすテクニック。百聞は一見にしかず、次のようなケースです。よく見かけるでしょ?



NGUIを使う場合にどんなディスカッションがなされているか、公式フォーラムの回答を翻訳します:

http://www.tasharen.com/forum/index.php?topic=243
May 02, 2012, 01:55:55 PM

質問
今作っているゲームにはUIが何種類かあって、どれかのUIにフォーカスを当てたときには背景のゲームをボヤかすようにしたいんだけど、誰か簡単な方法分かりませんか?巨大スプライトをGUIの後ろに配置するようにして作成して、iTween.FadeToを使うことはフェードイン・アウトどっちも
試したことあるけどうまくいかない。どうしたらいい?

回答
Winwardsでやった方法を紹介するのでいいかな?画面と同じ大きさの背景を作ってUIStretchとColliderを貼り付けるんだよ。それによって画面全体をカバーできる。あとはZを-50に設定して必ずすべてのオブジェクトより前にあるようにすることだ。それのさらに上にウィンドウなどがさらにそれらのオブジェクトの前にあるようにするんだけど、そのときはZを(-50よりも)さらに低い値にすることがポイントだね。
---

なるほどねー。最近の家庭用ゲームも確かにウィンドウを表示すると、その背景画面はわざとボヤかすのが良くあるよね。

クールなUIにしようぜ!NGUI!

2012年8月9日木曜日

NGUI パーティクルでも活用すべき?


今回はゲームで必須のパーティクル生成とNGUIの関係に関する記事。一般にNGUIはパーティクル生成を標準的にはサポートする機能がないけど

http://www.tasharen.com/forum/index.php?topic=393.0

August 08, 2012, 03:47:08 AM

質問
NGUIでメニューを作るのは向いているけど、パーティクル生成とメニューに連結してないスプライトに活用する使い方はアリですか?

作者回答
理屈上はAtlasテクスチャ(スプライト)の一部しか使用しない複製されたマテリアルをパーティクルい使うことは可能だね。
だけど今はマテリアルのUVオフセットを自分で指定しないといけない。でも出来ることは出来る。

フォーラムのディスカッション

新米Aさん
自分ではNGUI描画で全部のパーティクルや効果にいているけど、何も問題はないね。良いのは1Draw Callで出来る
ってところ。画面に何千っていうパーティクルを描いたとしてもね。

考慮すべきはDepthのソート方法。もしオブジェクトの前か後ろに表示したい場合は複数のパネルが必要になってくる。
自分で作成してるシーンはアーケードボードゲームなので静的(Static)だから3パネルのみに抑えられている。1つが前、1つが後ろ、1つがUI。

他に考慮すべきはAtlasの個数。これはマテリアルがどんな種類かによって作成が必要な数が決まってくる。

常連Cさん:
自分のゲームは別のtk2dライブラリで使いたいパーティクル・効果を描いている。気になるのはNGUI作者自身がパーティクル向きにエンジンを作成しているかどうか。現時点では玉石混淆ってところだけど、NGUIが本当にイケていることを鑑みてもNGUIでパーティクル・スプライト・メニュー
全部に活用することは検討してる。

新米Bさん:
実際どうやってやるの?Draw Callは是非減らしたいけど?

常連Cさん:
それはやり方が一杯あってひとことでは言い表せない。だけどUnityのパーティクルシステムはパーティクルごとにDraw Callを必要としてるものの、シーンの3次元空間に含まれているものなんだ。
一方でNGUIでパーティクルを作成するってことはゲームに2次元空間で表面に乗せることになる。ボクが作るならコードを全部書いて特定パーティクルのイメージを画像から引っ張ってきて同じコードのなかで3次元座標のどこにマップするからトラッキングするクラスを作るね。

何をいっているかサッパリっていうならUnityのパーティクルシステムを使ったほうが楽チンだし、それもいいと思うね。
----------

今回は作者コメントよりもフォーラムの常連さんコメントが気になったところ。

NGUIは2Dだからパーティクルも2次元なのはそれは当たり前。だけどそれが自分のゲームに合うか?うーん、自分にはサッパリ分からん。

Depthが関係ないなら行けるのかな。

色々実験してみようぜ! NGUI!

NGUI Unity4.0での動作状況


今回は話題のUnity4.0にアップグレードするときの注意点から。

http://www.tasharen.com/forum/index.php?topic=1083
July 19, 2012, 10:03:58 PM

質問:
Unity4.0にアップグレードしたがNGUIのUIPanel属性がクリックできないものがある(Normal, Depth Pass, Static)がどうしたら良いか?

回答:
まだUnity4.0は未サポート。ベータ版だしね。ただUnity4.0でNGUIがベースにしているエディタ機能自体に変更かけている可能性が高いね。
ほとんどのチェックボックスでの一般的な問題のようでいてUI Panel独自の可能性もある(例 UISlicedSpriteで中央埋め(Fill Center)のチェックを外すことは出来るけどプレビューボックスはチェックを外せない)
----

Unity 4.0でエディタに変更が入っているのでNGUIの対応はまだこれからですね。まだ検証作業の方がほとんどとおもいますが、エディタ自体が動かないものがあるとのことなので注意ですね。
※2.1.5からUnity4.0プリオーダーベータ版をサポートしているとの情報があります

正式版出たらちゃんとサポートしてねNGUI!

ブックマークに追加

このエントリーをはてなブックマークに追加

自己紹介

自分の写真
Unity3D公式マニュアル翻訳やってる人がスマホ(iPhone, Android)のゲーム開発しています。気軽に面白く初心者が遊べる内容がモットー。Blogでは開発情報をひたすら、Twitterではゲーム作成の過程で参考にしている情報を中心につぶやきます

ページビューの合計

過去7日間の人気投稿