CreatorsAboutArticlesMembersNewsWorksAltseed1向けのUI生成ツール「UIGenerator」の紹介Altseed1向けのUI制作ツールの紹介記事です。AltseedUIGeneratorとはUIGeneratorは,私Funny_Silkieが制作したAltseed1×C#におけるUI自動生成GUIアプリケーションです。ゲームでメニュー画面などのUIを作る時はウィンドウやテキストなどの位置関係や色の微調整が大事になります。確認するためにはいちいちコンパイルしてexeファイルを生成して起動しなければなりません。それだとめんどくさい!という事で,実際に状態を見ながらUIを制作できるこのアプリケーションを作成しました。1.どんな事が出来るのかざっくり言うと,作りたいUIを編集できるリソースを読み込めるC#のコードを自動生成できるといった感じです。こんな感じになります。詳しくは事項にて説明します。2.機能紹介2-1.メインウィンドウアプリケーション”UIGenerator.exe”を起動するとこのように3つのウィンドウが開きます。コンソールウィンドウでは一部処理の成否が通知され,Altseedのウィンドウでは編集中のUIが表示されます。メインウィンドウは”UIGenerator”と表示されているウィンドウです。このメインウィンドウからは様々な機能にアクセスする事が出来ます。上のメニューのファイル,編集,ツールのそれぞれの機能は以下の通りです。要素を追加/削除する:UIオブジェクトを追加/削除を行うフォントを編集する:使用するフォントの追加/削除を行う(テキストオブジェクトなどで使用できる)テクスチャを編集する:使用するテクスチャの追加/削除を行う(テクスチャオブジェクトなどで使用できる)ファイルパッケージの管理する:ファイルパッケージの追加/削除を行うツールファイルの有無をチェック:指定したファイルパスが存在するかどうか検証できる(ファイルパッケージ導入時の確認など)オプション:Altseedウィンドウのサイズやプロジェクトの名前を変更できる2-2.UIオブジェクトについてUIオブジェクトには,asd.Object2Dを継承したText,Texture,Windowがあります。Windowは枠線などを設定できるテクスチャの発展形です。Textでは登録したフォントが,Textureでは登録したテクスチャを使用する事が出来ます。それぞれが専用のフォームから設定をする事が出来ます。TextTextureWindowこんな感じでフォームが有りますが,ここでModeとかNameってなんだ?ってなるのではと思います。Modeはint型で表される値です。UIオブジェクトが登録されているレイヤー自体にもModeという変数が定義されており,レイヤーのModeの値と一致しているMode変数をもつUIオブジェクトのみが描画されます。TextのModeを0に,WindowのModeを1に設定してみます。現在のレイヤー全体のModeは0なので,Textのみが表示されています。全体のModeを1にすることで,Textが表示されなくなりWindowが表示されるようになりました。このような感じでModeは使われます。NameはそのUIオブジェクトの名前です。UIオブジェクトの検索(内部処理で行われる)はModeとNameの組み合わせで行われるため,その為の物です。その為,ModeとNameの組み合わせが重複する場合は登録できません。UIオブジェクトにはasd.Layer2Dから呼び出せる追加描画メソッド関連の物も含まれています。Arc,Circle,Line,Rectangle,RotatedRectangle,Sprite,Text,Triangleが使用可能です。追加描画系もModeとNameを持ちますが,asd.Object2D派生の物とは別枠で使用されるためそちらとの重複は可能です。2-3.エクスポートエクスポート時にはこのようなウィンドウが開かれます。出力はasd.Layer2Dの派生クラスとして定義されるため,その型名と,所属名前空間を設定します。あとは保存先のファイルパスを設定してExportボタンを押すと出力可能です。今は文字エンコードの設定も実装したいなーと思っています。言語は現在はC#しか選択できません。好事家の皆さん!C++とかJava対応してみてください!生成結果がこんな感じです。3.最後に操作に関する説明はこちらから。Altseed2ができるため風前の灯火ですが,よろしければ使ってみてください。改造したい場合はプルリク送ってください。バグや要望などはissue立てといてください。