Jump to content
Unity Insider Forum

MaZy's Blog

  • entries
    14
  • comments
    32
  • views
    45,345

Eine "kurze" Erläuterung, warum ich doch NGUI oder DF vermieden habe zu kaufen.


MaZy

588 views

 Share

[color=#666666][font=tahoma, helvetica, arial, sans-serif][size=3]Herzlich Willkommen zu meinen ersten Blogeintrag überhaupt. Als erstes möchte ich mich für mein Deutsch entschuldigen. Ich bin hier in Deutschland zwar groß geworden, jedoch bei den Leuten, die einen Migrationshintergrund haben und selbst kaum die deutsche Sprache beherrschten. Das hatte natürlich ein wenig Einfluss auf mich. Jedoch bemühe ich mich verständlich zu gestalten. Zum Glück habe ich fast keine Rechtschreibfehler, aber grammatikalischen Fehler werdet ihr viele finden ^^. Auch begrüße ich sehr herzlich, wenn ihr euch ein Fehler auffällt irgendwie zu benachrichtigen, da ich dadurch lernen kann.[/size][/font][/color]

[color=#666666][font=tahoma, helvetica, arial, sans-serif][size=3]Ich habe schon mich oft gefragt, ob ich irgend ein System wie NGUI oder DF benutzen muss und kaufen müsste. Ich habe schließlich gemerkt. Ich brauche das gar nicht. Wie ich meine GUIs nun zusammen stelle zeige ich euch.[/size][/font][/color]


[color=#666666][font=tahoma, helvetica, arial, sans-serif][size=5][b]Wie ich meinen GUI selbst zusammen stelle[/b][/size][/font][/color]

[color=#666666][font=tahoma, helvetica, arial, sans-serif][size=3]Ich habe neulich meinen System was GUIs angeht verändert. Ich programmiere fast die GUIs nicht mehr sondern stelle sie zusammen. Na klar ohne Scripts kommt man nicht drum rum, aber diesmal habe ich etwas entdeckt, was mir gefällt.[/size][/font][/color]

[color=#666666][font=tahoma, helvetica, arial, sans-serif][size=3]Bei meinem neuen Spiel lerne ich erste mal neue Seiten was GUIs angeht.[/size][/font][/color]

[b]1. GUI Elemente[/b]

[color=#666666][font=tahoma, helvetica, arial, sans-serif][size=3]Ein Beispiel dafür wie sich ein "Levelbox" entwickelt habe.[/size][/font][/color]
[img]http://puu.sh/8w5hI.jpg[/img]

[color=#666666][font=tahoma, helvetica, arial, sans-serif][size=3]Hier sieht die Entwicklung eines "Levelboxes" von Links nach Rechts als Level_Done und Level_Locked.[/size][/font][/color]
[color=#666666][font=tahoma, helvetica, arial, sans-serif][size=3]In diesem Beispiel verwende ich dafür die Assets von JNA Mobile[/size][/font][/color]
[color=#666666][font=tahoma, helvetica, arial, sans-serif][size=3]Quelle: [/size][/font][/color][url="https://www.assetstore.unity3d.com/#/content/7987"]https://www.assetsto.../#/content/7987[/url]
[color=#666666][font=tahoma, helvetica, arial, sans-serif][size=3]Ebenfalls verwende ich ein Textmesh für die Texte (logisch :) ) mit anderem Schriftart als Arial.[/size][/font][/color]

[color=#666666][font=tahoma, helvetica, arial, sans-serif][size=3]Die Komponenten[/size][/font][/color]
[img]http://puu.sh/8w4BW.png[/img]
[color=#666666][font=tahoma, helvetica, arial, sans-serif][size=3]Wie ihr sieht bestehen die Objekte aus Sprites. Man sieht auch, dass ein [b]BoxCollider2D [/b]eingefügt wurde. Damit kann ich mit [b]OnMouseDown() [/b]events abfangen. Das Schöne daran ist, dass es auch für [b]Touchsysteme [/b]funktioniert. Somit hätte ich schon ein Button für Levelauswahl fertig. [/size][/font][/color][color=#666666][font=tahoma, helvetica, arial, sans-serif][size=3]Alles wurde dann als Prefab gespeichert. [/size][/font][/color][color=#666666][font=tahoma, helvetica, arial, sans-serif][size=3]Ebenfalls habe ich ein Script eingefügt. [/size][/font][/color]

[font=tahoma, helvetica, arial, sans-serif][color=#666666][size=3]Der Script ist geschrieben in C# hilft mir die Texte zu verändern. Es gibt noch einen Script der mir verhelft, die Objekte zu spawnen angepasst an den Levelanzahl. Kommen gleich dazu.[/size][/color][/font]

[color=#666666][font=tahoma, helvetica, arial, sans-serif][size=3]Ein bissel Code:[/size][/font][/color]

[color=#666666][font=tahoma, helvetica, arial, sans-serif][size=3][CODE]
public class LevelboxBase : MonoBehaviour {
public TextMesh levelname;
public TextMesh levelnumber;

public void ChangeProperties(string lvlname, string lvlnumber) {
levelname.text = lvlname;
levelnumber.text = lvlnumber;
}

}

public class LevelboxDone : LevelboxBase {
public GameObject star;

public void SetDone(bool leveldone) {
if(star) {
star.SetActive(leveldone);
}
}

void OnMouseDown() {
Application.LoadLevel("lvl" + levelnumber.text);
}
}
[/CODE][/size][/font][/color]

[font=tahoma, helvetica, arial, sans-serif][color=#666666][size=3]Es ist nicht perfekt gelöst jedoch funktioniert es :D. [b]LevelboxBase [/b]hat die Standardeigenschaften für ein Levelbox. Diese wird erweitert mit einem neuen Script [b]LevelBoxDone[/b]. In anderen Worten: Er wurde speziell für [b]LevelBoxDone-Prefabs[/b] gemacht, da dort ein Stern dazu kommt. mit [b]SetDone(bool leveldone) [/b]kann ich später den Stern nämlich anzeigen oder auch ausblenden. Die Sterne stehen dafür, ob man diesen Level geschafft hat oder noch zu machen hat. Bei meinem Spiel wäre das eigentlich nicht nötig, da man eigentlich immer schaffen muss um den nächsten Level freizuschalten. [/size][/color][/font][color=#666666][font=tahoma, helvetica, arial, sans-serif][size=3]Beim [b]Levelbox_Locked[/b] benutze ich einfach den [b]LevelboxBase[/b]. Da bauche ich kein Stern ;).[/size][/font][/color]



[b]2. GUI Elemente anzeigen.[/b]

[color=#666666][font=tahoma, helvetica, arial, sans-serif][size=3]So jetzt kommen wir zu einem Teil, was auch wichtig ist :).[/size][/font][/color]
[color=#666666][font=tahoma, helvetica, arial, sans-serif][size=3]Ich habe um die GUI Elemente anzuzeigen ein Script geschrieben. Damit lass ich diese Elemente spawnen.[/size][/font][/color][color=#666666][font=tahoma, helvetica, arial, sans-serif][size=3] Ich werde nicht alles frei wild posten, sondern, versuche mit ein bissel Code einfache Gedankenanstoße zu abzugeben. [/size][/font][/color]

[color=#666666][font=tahoma, helvetica, arial, sans-serif][size=3]Hierbei habe ich einen GameObject genommen und ihn ein Script verpasst. Die Prefabs habe ich ja bereits erledigt.[/size][/font][/color]
[color=#666666][font=tahoma, helvetica, arial, sans-serif][size=3]So sieht es nun aus.[/size][/font][/color]
[color=#666666][font=tahoma, helvetica, arial, sans-serif][size=3][img]http://puu.sh/8w6qe.png[/img][/size][/font][/color]

[color=#666666][font=tahoma, helvetica, arial, sans-serif][size=3]Und genau diesen LavalMainMenu erkläre ich gerade. Dort ist einfach folgendes enthalten.[/size][/font][/color]
[color=#666666][font=tahoma, helvetica, arial, sans-serif][size=3][img]http://puu.sh/8w6qG.png[/img][/size][/font][/color]

[color=#666666][font=tahoma, helvetica, arial, sans-serif][size=3]Hier merke ich gerade, dass ich start offset gar nicht benutze :). Nur so nebenbei. Wichtig ist einfach nur die ersten 3 (nach Debugging On). [/size][/font][/color][list]
[*][color=#666666][font=tahoma, helvetica, arial, sans-serif][size=3]Levels Count: Dort haben wir stehen wie viele Levels überhaupt wir habe[/size][/font][/color]
[*][color=#666666][font=tahoma, helvetica, arial, sans-serif][size=3]Level Open GO und Level Closed Go: Hie tun wir einfach die jeweiligen Prefabs rein.[/size][/font][/color]
[/list]
Der Rest sind einfache Berechnungen zum Zentrieren und Größeneinstellungen. Man kann etwas vorgeben oder es wird automatisch berechnet ( Je nach angaben. Eingabe x > Eingabe y dann berechne automatisch oder nehme Eingabe X als Wert)

Ein bissel Code?

[CODE]
void InitializeGuiElements() {
levelsCount = Mathf.Clamp(levelsCount, 1,99999);
spawnedLevelbox = new GameObject[levelsCount];
spawnLevelboxCounter = 0;
for(int i = 0; i < levelsCount; i++) {
int levelno = (i+1);
Debug.Log(levelno);

if(IsLevelDone(levelno)) {

instantiateLevelbox(2, "Level", levelno.ToString());

} else if( IsLevelOpen(levelno) ) {

instantiateLevelbox(1, "Level", levelno.ToString());

} else {

instantiateLevelbox(0, "Level", levelno.ToString());
}
} // position update
UpdatePosGuiElements();
}
[/CODE]

Dieser Teil erstellt die ganzen GUI Elements. Es wird gecheckt, ob man diesen Levelteil schon abgeschlossen hat, noch zu machen hat oder gar nicht freigeschaltet hat. Je nach dem wird ausgewählt welcher GUI Element gespawnt wird.
UPdatePosGUIElements(): Damit positioniere ich sie noch einmal. Ich habe es extra getrennt gemacht, da ich eine Funktion habe die sich OnPropertiesChange() Event habe. Damit kann ich dann später im Inspector etwas herumspielen und gucken ob es so gut aussieht.

So der Teil hier spawnt sozusagen die richtigen Prefabs
[CODE]
/// <summary>
/// Instantiates the levelbox.
/// </summary>
/// <param name="boxtype">Boxtype 0 = closed, 1 = open, 2 = done</param>
void instantiateLevelbox(int boxtype, string name, string number) {

GameObject levelPrefab;
if(boxtype > 0) {
levelPrefab = levelOpenGO;
} else {
levelPrefab = levelClosedGO;
}

GameObject levelGO = (GameObject)Instantiate(levelPrefab, Vector3.zero, Quaternion.identity);
levelGO.name = (1+spawnLevelboxCounter).ToString();
spawnedLevelbox[spawnLevelboxCounter] = levelGO;
spawnLevelboxCounter++;

levelGO.transform.parent = transform;

if(boxtype > 0) {
LevelboxDone levelproperties = levelGO.GetComponent<LevelboxDone>();
levelproperties.ChangeProperties(name, number);
levelproperties.SetDone(boxtype == 2);
} else {
LevelboxBase levelproperties = levelGO.GetComponent<LevelboxBase>();
levelproperties.ChangeProperties(name, number);
}
}
[/CODE]
Hier lasse die richtigen Prefabs spwnen und packe es in eine liste rein. Damit kann ich später etwas anfangen, aber fürs Debuggen reicht das erst mal ^^. Das ganze sieht dann so aus.

[b]VIDEO Demonstration[/b]: [url="http://puu.sh/8w8pH.mp4"]http://puu.sh/8w8pH.mp4[/url]

Und ein Bild :):[img]http://puu.sh/8w8pP.jpg[/img]

[b]Fazit:[/b]
Natürlich ist das hier nicht mit NGUI vergleichbar, aber warum gleich soviel Geld ausgeben, wenn man das selbst machen kann. Gut keine Animationen zur Zeit da. Keine Progression Bar. Aber diese Dinge kann man langsam und langsam dazu machen. Irgendwann hat man seine Scripte zusammen, wo man fast eigentlich immer wieder die selben Sachen verwendet. Vorhin habe ich zum Beispiel Buttons erstellt. Als Prefab gespeichert. Nun ziehe ich es raus und ändere nur den Text. Dazu kommt noch ein Script.

Ein EventSender mach ich noch aber muss nicht sein. Hauptsache ein Event wie OnMouseClick() ist dabei :).

Ich hoffe dieser Blogeintrag hat euch Spaß gemacht zu lesen :)

EDIT: Nachtrag wie das nun mit GameOver Dialog aussieht (außerdem habe ich doch die Farben verändert.) Knapp 10-20 Minuten arbeit (hab nach fonts gesucht :D).

[img]http://puu.sh/8wgbn.jpg[/img]

[img]http://puu.sh/8wglV.png[/img]
Achtet hier auf die Prefabs. Kann man imme wieder Verwenden. Buttonprefab ist in DialogboxGameover auch enthalten. Der einzige Nachteil ist, dass ich "5 of 10" in einem Text habe. Ich wollte es jetzt getrennt machen, da ja vielleicht dazu kommt dass da 5 of 100 steht. Dann müsste man ja "5 of" mit verschieben. Als einzelne Objekte wäre das schwerer. Aber man hat ja viel Platz. könnte ja alles etwas verschieben
 Share

0 Comments


Recommended Comments

There are no comments to display.

Guest
Add a comment...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...