Grafikprogrammierung II: Generative Kunst Animation

1. Trailer: Hallo. Ich bin Joshua Davis. Ich bin der Media Arts Director hier in der schönen Sabrosa, wo ich eine Menge von diesem Code, den Sie in dieser Klasse lernen werden, um dynamische interaktive physische Erlebnisse zu schaffen. Diese Klasse ist offensichtlich eine ausgezeichnete Erweiterung der ersten Klasse, die ich lehrte, Programmierung von Grafiken und Einführung in generative Kunst, aber speziell mit einer Bibliothek, die ich erstellt habe, namens Hype Framework. Nun, das bringt uns in die zweite Klasse, die Programmierung von Grafiken generative Kunstanimation ist . Jetzt werden wir all das Zeug nehmen, das wir in der ersten Klasse gelernt haben, immer noch mit Hype Framework, immer noch mit Verarbeitung, sitzen auf Java, aber jetzt werden wir tatsächlich lernen, wie man das Zeug auf dem Bildschirm animiert 2-dimensionale und 3-dimensionale. Ich bin draußen. 2. Einheit 1, Video 1: Was? Worum ging es denn? Wir sollten mit dieser Party beginnen. Was sagst du? Ja. Wollen wir diese Party starten? Ja. Lasst uns diese Party starten. Ja. 3. Einheit 1, Video 2: Willkommen zurück. Zweite Klasse. Erstaunlich. Ich muss Ihnen allen danken, dass Sie die erste Klasse genommen haben, um diese zweite Klasse sogar möglich zu machen. Ich werde nicht mal zögern. Ich werfe jetzt eine riesige Warnung aus. Riesige Warnung, und das heißt, diese Klasse ist erstaunlich. Wenn Sie jedoch nur diese Klasse besucht haben und Sie nicht meine erste Klasse genommen haben, was heißt, werde ich einen Link dazu bereitstellen, aber es ist Programmiergrafik und Einführung in die generative Kunst. Wenn Sie diese Klasse nicht genommen haben, wird diese Klasse kläglich scheitern, und das liegt daran, dass ich Sie in dieser ersten Klasse in das Hype Framework eingeführt habe, das eine Bibliothek ist, an der wir arbeiten , die all das Zeug, das wir lernen, möglich. Also, das lernst du in der ersten Klasse, richtig? Sie lernen also, wie Sie Sublime Text 2 in Verbindung mit der Verarbeitung verwenden, und wir greifen auf diese Bibliothek zurück, die uns hilft, Dinge schneller zu skizzieren. Also, das ist die riesige Warnung. Die große Warnung ist, dass, wenn Sie diese Klasse nehmen und Sie nicht meine erste Klasse, das allererste Video, genommen haben , wenn wir anfangen, HRotate zu decken, Sie nicht wissen werden, wovon wir reden. Es ist also am besten, dass Sie diese Klasse pausieren und tatsächlich die erste nehmen. Mit anderen Worten, Sie werden nicht auf Geschwindigkeit über alle Funktionen, die das Hype Framework Ihnen ermöglicht, geschnitten worden sein. Ok. Also, das ist Programming Graphics Two: Generative Art Animation. Verstehen Sie mich nicht falsch. Ich liebte diese erste Klasse, aber hier passiert meiner Meinung nach der Spaß. Ich denke, der Spaß passiert hier, weil Sie sehen werden, wenn wir in eine Menge der späteren Dateien bekommen , unerwartete Ergebnisse. Hoscillator, erstaunlich. Es wird Dinge tun, die du einfach nicht geglaubt hast. Also verbringe ich viel Zeit damit, kleine Aspekte der Programme zu optimieren , um Dinge zu entdecken, die ich nie wusste, dass ich bekommen konnte. Also, liebe die erste Klasse. Diese Klasse ist fantastisch, weil wir im Grunde die Animation abdecken. Also werden wir uns eine Menge der Dinge ansehen, die wir in der ersten Klasse behandelt haben, in Bezug auf die Verwendung von Pools und das Anbringen von Dingen auf dem Bildschirm. Aber jetzt werden wir uns mit den Verhaltensweisen von Hype beschäftigen, die sich nur mit bewegten Dingen beschäftigen. Ok. Also, ich werde dieses Video einpacken. Wenn Sie mit dem nächsten fortfahren, werden wir nur eine kurze Einführung in einige der Dinge, die Sie lernen werden, sowie prüfen, wo viele dieser Animationsklassen sich innerhalb des Hype Framework-Ordners befinden , das , die Sie zuvor für GitHub heruntergeladen haben. Wir sehen uns im nächsten Video. 4. Einheit 1, Video 3: Also wollte ich mir nur ein wenig Zeit nehmen, nur einen Überblick über das Hype Framework zu machen , das Sie von GitHub heruntergeladen haben. Wenn Sie tatsächlich den Hype Processing Staging-Ordner öffnen, wieder nur eine schnelle Aktualisierung, gibt es einen Ordner namens pde, und innerhalb des PDE-Ordners befinden sich alle Klassen, die derzeit in Hype verfügbar sind . Sie können sehen, ich habe ein paar, die hervorgehoben werden, die wir tatsächlich decken werden. Beispiel: HFollow, Hoscillator, HAnDOMTrigger, HRotate, HSWarm, HTimer, HTWeen. Dabei geht es darum, Dinge über das Verschieben von Dingen zu animieren oder Dinge zu bewegen, basierend auf einem System wie HSWarm. Vergessen Sie nicht, dass es innerhalb von Beispielen immer Tonnen von Beispielen gibt, es tatsächlich einen HTWeen-Ordner gibt, es gibt tatsächlich einen HSWarm-Ordner. Die Dateien, die tatsächlich für diese Klasse erstellt haben, versuche ich jedoch von diesen Beispielen abzuweichen, so dass ich einige der Klassen etwas tiefer vertiefen kann und vielleicht einige neue Dinge präsentieren kann, die ich nicht wirklich ganz veröffentlicht habe zwei Beispiele noch. Während es Beispiele für einige der Dinge gibt, die wir innerhalb des Beispiel-Ordners lernen werden, ist ein Großteil der Inhalte, die wir tatsächlich in dieser Klasse lernen werden, nicht online. Also, du bist nicht High-Five, wir mögen Exklusivität. meiste von diesem Zeug, das ich mit dir in dieser Klasse durcharbeiten werde , ist das meiste Zeug, das dieses Projekt war, das ich auf Tumblr gemacht habe. Also, wenn Sie tatsächlich auf pre-station.tumblr.com gehen, das ist dieses Experiment, das ist, dass ich mir einige Regeln gegeben habe. Ich habe gesagt: „Okay, es muss nur Animation enthalten, jeder Clip ist 30 Sekunden lang, ich habe mir aus irgendeinem Grund gegeben, dass es schwarz und weiß sein muss, also verwende ich keine Farbe für dieses Projekt, und cool. Ich bin etwa 50 Jahre so Akten von Animationen, die ich auf Tumblr geteilt habe.“ Also, wenn ich Ihnen nur einige dieser Stücke zeigen würde, sind nur einige der abstrakten Studien, die ich mit Hype herumbasteln und wieder auf Tumblr veröffentlichen. Also werden wir einige davon durcharbeiten und darüber reden, wie einige davon gemacht werden, und dann werden wir uns darauf einlassen, wie wir das ausgeben können. Genau wie die erste Klasse können wir das tatsächlich noch ausgeben, um zu drucken, wenn wir uns tatsächlich entscheiden, aber wir werden nicht viel Zeit damit verbringen, dies zum Drucken auszugeben. Wir werden darüber sprechen, dies für die Animation auszugeben. Also, ich werde Ihnen zeigen, wie Sie dies in ein Filmformat bekommen, wie Sie es in ein mp4 einfügen, eine Software, die ich verwende, um mir bei diesem Prozess zu helfen. Unser letztes Projekt wird sehr dynamisch wie dieses sein, es wird Spaß machen, es wird spannend, wie man wirklich gut reflektiert aussieht. Nun, die meisten von diesem Zeug haben tatsächlich in der neuen Phantom Graham Musikvideo verwendet, so mein ko-geleitetes Musikvideo für Phantom Graham genannt fallen in wirklich erstaunliche und talentierte Crew unter der Leitung von Timothy Cicenty. Ich werde Ihnen zeigen, wie ich eine Menge dieser Programme genommen habe, verwenden Sie sie für das Musikvideo, und wieder, wir können dies jetzt in einen Film stellen, einige von Ihnen wollen vielleicht kürzere Clips machen und sie an animierte Gif ausgeben, ich weiß, Tumblr liebt animierte Gif, aber ich habe diese 30-Sekunden-Rips gemacht, also MP4 war das Format, zu dem ich gegangen bin. Also, schau dir die playstation.tumblr.site an, die ich dir einen Geschmack von all diesen kleinen verschiedenen Animationen geben werde , die ich ausschließlich mit dem Zeug gemacht habe , das wir tatsächlich in dieser Klasse lernen werden. Aktualisieren Sie sich mit der Hype Verarbeitung, Staging, schauen Sie sich den PDE-Ordner an oder schauen Sie sich den Beispielordner an, wieder gibt es einige Dinge, die wir in dieser Klasse nicht behandeln werden. Also, das schließt diesen ersten Abschnitt, der nur eine Übersicht ist, die nur Einführungen ist, gibt Ihnen einen Geschmack von einigen der Dinge, die wir in dieser Klasse behandeln werden. Im nächsten Abschnitt werden wir jede Drehung abdecken. Also, wir werden wieder, beginnen sehr langsam und langsam werden wir diese Dateien aufbauen. Dies ist eine Zwischenklasse, die bedeutet, dass alle so einfach wie möglich beginnen, am Anfang, wir zu Hoscillator und Combos kommen, bin ich ziemlich sicher, dass ich deine Seele rausgerissen haben und deine Augen bluten werden. Es wird kompliziert, aber ich werde Sie durch die Schritte der Erstellung dieser komplexen Systeme mit sehr einfachen Schritten führen. Also atmen Sie tief durch, gehen Sie mit mir, ich verspreche, es wird Spaß machen, aber es wird kompliziert und für einige von Ihnen Zwischenverarbeitung Leute da draußen. Hoffentlich ist dies die Klasse, die Sie gesucht haben, für Sie Leute, die neu in der Verarbeitung sind, ich liebe dich, ich bin so froh, dass Sie auf dieser Reise mit uns sind, aber ich werde Ihre Hand halten, gehen Sie langsam. In Ordnung. Auf das nächste Video, HRotate. 5. Einführung in HRotate und Anker: Hier sind wir im ersten Abschnitt, HRotate und Anker. Also haben wir Anker ein wenig in der ersten Klasse abgedeckt, was diese Idee war, ein Objekt zu haben und einen bestimmten Ankerpunkt für dieses Objekt angeben zu können . In diesem Abschnitt wird das sehr gut mit HRotate funktionieren, da HRotate uns erlauben wird, ein Objekt um diesen Rotationsanker zu drehen. Wir werden uns also alle Aspekte von HRotate ansehen. Wir haben die Möglichkeit, einige Konstanten für die Verankerung anzugeben, oder? So gibt es neun mögliche Positionen, Mitte, oben links, unten rechts, zum Beispiel, oder wir können mit Anker arbeiten, wo wir eine X- und Y-Position angeben, und diese Ankerposition wird in Verbindung mit HRotate funktionieren . Nun möchte HRotate ein paar Dinge wissen. Es will wissen, wer es rotiert und mit welcher Geschwindigkeit sollte es dieses bestimmte Objekt drehen. Geschwindigkeit kann in zwei Ereignisse unterteilt werden. Sie können Grad oder Bogenmaß verwenden. Sie können also sagen: „Okay. Ich möchte, dass sich jedes Mal etwas positiv um zwei Grad dreht, oder ich möchte, dass etwas negativ um zwei Grad dreht.“ So können wir angeben, ob sich etwas im Uhrzeigersinn oder gegen den Uhrzeigersinn dreht. 6. Einheit 2, Video 1: In Ordnung. Machen wir uns bereit für Magie. Dies ist der erste Abschnitt, wenn wir anfangen, Code abzudecken. Dieser Abschnitt ist HRotate und Anker. An dieses Video angehängt, sollte es eine ZIP-Datei geben, die Sie herunterladen möchten. Diese Zip-Datei wird alle Beispiele für HRotate und Anker enthalten. Wenn Sie also die ZIP herunterladen und entpacken, werden Sie feststellen, dass es 10 Beispiele in diesem Ordner gibt. Wieder, wir werden ganz einfach anfangen. Dann werden wir diese Dateien weiter hinzufügen, um zu sehen, welche Arten von Ergebnissen wir erhalten. Wenn Sie also voran gehen und sich Beispiel eins ansehen, EX 1, werden Sie feststellen, dass es eine build.pde gibt und es Hype.pde gibt. Auch hier ist Hype.pde eine verkleinerte Version jeder einzelnen Klasse, die sich innerhalb des PDE-Ordners befindet, den Sie von GitHub heruntergeladen haben. Hype.pde enthält also das gesamte HYPE-Universum. Sie sollten also niemals dieses bestimmte Dokument öffnen müssen. Wir werden build.pde eröffnen. Nun, wenn Sie es öffnen, sollten Sie diesen Code hier sehen. Wir gehen einfach durch, als Auffrischung, wir gehen durch, was das tut. Dann werden wir es ausführen und dann fügen wir HRotate hinzu. Jetzt hat jede Verarbeitungsdatei zwei Funktionen. Sie werden feststellen, dass der erste hier Setup ist. Das ist wieder unser Konstruktor. Es läuft einmal. Hier haben wir alle unsere Setup-Informationen aufgestellt. Dann ist unsere Draw-Funktion die Schleife. Es ist, was immer und immer wieder läuft. Nun, Sie könnten in der ersten Klasse bemerkt haben, dass wir nie die Draw-Funktion oder diese H.DrawStage verwendet haben , die, wenn Sie sich erinnern, Farben der Bildschirm war immer innerhalb des Setups. Also wollten wir ein paar Sachen machen und dann einfach den Bildschirm malen, aber wir mussten den Bildschirm nur einmal malen. Da wir animieren, werden wir tatsächlich die h.drawStage in die Draw-Funktion verschieben , so dass sie immer und immer wieder läuft. Also schauen wir uns einfach an, was wir hier tun. Aus der Setup-Perspektive werden unsere Filme eine Breite und eine Höhe von 640 haben. Wir gehen weiter und fügen HYPE Konstruktor, H.init (this). Erinnerst du dich an das aus der ersten Klasse? Wir werden einen Hintergrund setzen. Die Farbe wird ein dunkelgrau von 20, 20, 20. Ich werde voran gehen und sagen, glatt. Ich möchte jetzt etwas auf den Bildschirm anhängen. Also werde ich einen HRect anbringen. So erscheinen oben. Ich sagte hRect r1, für Rechteck eins. Hier unten in den Zeilen 8 bis 13 werde ich einige Informationen über dieses bestimmte Rechteck hinzufügen. Zum Beispiel, wie groß ist das Rechteck? Nun, ich will, dass es ein Quadrat ist, das sind 100 mal 100. Aber ich möchte auch abgerundete Ecken mit einer Rundung von 10. Nun, in Zeile neun, sagen wir: „Okay, ich möchte dieses Rechteck zu H hinzufügen, H ist HYPE, so dass HYPE weiß, dass dieses Rechteck existiert und es das Rechteck hinzufügt, so dass, wenn h.Draw Schritt läuft, es Informationen über r1. Nun, wo wollen wir dieses Rechteck anhängen? Ich sage Standort, .loc. Ich werde sagen, Breite geteilt durch 2, Höhe geteilt durch 2, was bedeutet, dass es dieses Rechteck in die Mitte unseres Bildschirms setzen wird. Linie 11, ich will keinen Schlaganfall. Linie 12, eine Füllung, eine schöne orange Farbe. Beachten Sie, dass wir an diesem Punkt überhaupt keinen Anker abdecken. Wenn Sie sich von der ersten Klasse erinnern, wenn Sie keinen Anker angeben, drehen Sie sich von 0, 0, oder? So legt es es in die obere linke Ecke. Jetzt gehen Sie nach unten zur Auslosung. Wir werden eine Schleife machen H.DrawStage jetzt immer und immer wieder zeichnet. Dann habe ich in den Zeilen 22 und 23 nur etwas Verarbeitungscode eingefügt, um zu visualisieren, wo der Anker ist. Also wirst du bemerken, ich sagte: „Hey, mach keine Füllungen, so dass es die Füllung von Orange in Zeile 12 tötet. Gib mir ein Strichgewicht von 2 und gib mir eine Strichfarbe eines blaugrün, 0095A8.“ Dann, wieder nur mit einem grundlegenden Verarbeitungscode, sagte ich nur: „Ich möchte eine Ellipse machen. Die x- und y-Position der Ellipse ist, naja, was ist die x- und y-Position von r1?“ So bemerken Sie, dass ich sagte, dass das x r1.x offen parenth close parenth ist. So erhält es die x-Position von r1, und dann erhält es die Position von r1 auf der y-Achse und die Breite und Höhe dieser Ellipse ist 4 mal 4. Jetzt werden Sie feststellen, dass ich diesen Code hier auskommentiert habe , weil wir noch nicht ganz bereit dafür sind. Aber wenn ich voran und testen Sie die Skizze, Sie sollten sehen, dass es uns tatsächlich eine Datei gab, die 640 von 640, die Hintergrundfarbe ist grau. Es hat unser Rechteck befestigt. Es hat um die Ecken getan. Es ist orange. Wir haben diesen kleinen blauen Punkt direkt in der Mitte hinzugefügt , damit wir wissen, wo der Ankerpunkt ist. Sie werden also feststellen, dass sich dieser Punkt genau in der Mitte der Breite befindet , geteilt durch 2, Höhe geteilt durch 2, und dass das Kunstwerk von unten rechts hängt , weil die obere linke Ecke der Ankerpunkt ist, ist die Registrierung. Nun, glauben Sie es oder nicht, das ist eine Animation. Die Draw-Funktion auf Linie 19 feuert immer und immer wieder, aber was passiert ist, ist, dass sich keine Positionen geändert haben. Es bewegt sich also nicht seine x-Position oder y-Position oder Skalierung oder Rotation, aber es malt dieses Ding schnell immer und immer und immer wieder. Es kommt vor, dass es vorher genau am Ort ist. Es passiert also eine Animation. Das ist sehr konzeptionell. Es gibt keine Schleife, aber nichts ändert sich visuell auf dem Bildschirm. Es ist nur, alles an der exakten Stelle neu zu streichen, immer und immer wieder. Jetzt möchte ich das Ding drehen. Drehen von Sachen und Verarbeitung für mich war schon immer ein bisschen wackelig, weil Grad versus Bogenmaß, wo ist der Ankerpunkt? Was drehe ich um? Also ehrlich gesagt, ich hoffe, dass, wenn Sie Dinge drehen möchten, Sie lieben werden, HYPE zu verwenden, um Dinge zu drehen, weil ich denke, es ist ein wenig einfacher, als eine Push-Matrix, eine Pop-Matrix und dann drehen Sie damit und bla bla bla. Also lasst uns voran gehen und die Umrisse 15 und 16 auskommentieren. Dies ist nur ein Beispiel dafür, wie Sie HRotate verwenden können. Eigentlich wird dieser Code ein wenig einfacher, wenn wir vorwärts gehen, aber lassen Sie Babyschritte hier machen. Also in Zeile 15 sage ich einfach, dass ich eine HRotate machen möchte und ich werde es hr1 nennen. Also HroTate1. Es ist eine neue HRotate. Zeile 15 steht also: „Okay. Cool. Hype, du hast dir ein Rotationsverhalten hinzugefügt, aber ich muss einiges wissen.“ Das Zeug, das es wissen muss, ist, wer es dreht und eine Geschwindigkeit. Jetzt wird die Geschwindigkeit ein wenig schwierig, weil das eine positive oder eine negative Zahl sein kann. Positiv im Uhrzeigersinn, eine negative Zahl ist gegen den Uhrzeigersinn. Schauen Sie sich Zeile 16 an. Ich sage: „Hey, HRotate1, dein Ziel ist dieses Rechteck, r1. Das ist also der Typ, den du drehen willst. Deine Geschwindigkeit ist 2.“ Beachten Sie, dass ich kein Bogenmaß angeben muss. Ich gebe ihm nur eine Nummer. Nun, wie es passiert, HYPE standardmäßig Grad. Wenn ich diese Datei tatsächlich ausführe, werden Sie jetzt feststellen, dass sich das Rechteck um zwei Grad gleichzeitig dreht. Also wieder, die Geschwindigkeit kann eine positive Zahl sein. Es ist ein Schwimmer. Also, wenn du das wirklich verlangsamen wolltest, könntest du 0.5 sagen und du könntest es ausführen und du würdest bemerken, dass es langsamer wird. Sie könnten dies in eine negative Zwei ändern und das würde einfach gegen den Uhrzeigersinn gehen. Also, da gehen wir, wir haben etwas animiert. Wir drehen unser Rechteck um einen Ankerpunkt. Nun, ich gehe weiter und schließe die Datei und ich werde uns unseren Ordner hier an Beispiel zwei ansehen. Auch in Beispiel zwei gibt es nur eine build.pde und eine hype.pde. Wenn Sie nun Beispiel zwei öffnen, ist Code immer noch der gleiche. Ich möchte nur zeigen, dass, wenn Sie zufällig ein Liebhaber von Bogenmaß zu sein, Sie tatsächlich tun können.Speedrad, anstelle von.speed. So.Speed wird Grad zu tun, .Speedrad wird Ihnen diese Rotation im Bogenmaß geben. In Beispiel zwei ist dies das einzige, was anders ist, die Angabe von SpeedRAD anstelle von Geschwindigkeit. Das ist also der einzige Unterschied in Beispiel zwei. Auch wenn Sie ein Liebhaber der Verwendung von Bogenmaß wie negative 2 Pi geteilt durch 90 sind, dann können Sie es natürlich so tun. Also, das ist Beispiel zwei. Schließlich möchte ich in diesem Video nur über Beispiel drei sprechen, bevor wir zum nächsten Video übergehen. Auch in Beispiel drei gibt es nur eine build.pde und hype.pde. In Beispiel drei können Sie hier entweder in Beispiel ein oder zwei sehen , eine Drehung erstellen, erstellt zwei Codezeilen. Sie mussten eine Instanz von HRotate erstellen und ihr dann Ziel und Geschwindigkeit mitteilen. Aber auch hier möchte ich die Dinge schnell machen. Ich möchte in der Lage sein, meine Ideen schnell zu skizzieren , ohne viel Code zu schreiben. Also ist es eigentlich eine Datei drei, die mein Favorit ist, weil sie die minimalste Menge an Code verwendet. In diesem Fall müssen Sie nur eine Codezeile sagen. Auch dies ist die Art und Weise, wie ich es gerne mache. Zeile 21 kann man einfach sagen: „Hey Hype, ich möchte eine neue HRotate machen.“ HRotate kann zwei Argumente übergeben werden. Das erste ist das Ziel, das zweite ist die Geschwindigkeit. Zeile 21 ist also die Änderung an Datei drei aus Dateien eins und zwei. Es vereinfacht zwei Codezeilen bis zu einer Codezeile. Auch wenn Sie nur die Skizze ausführen, werden Sie feststellen, dass wir immer noch die Rotation erhalten. Wir drehen immer noch um diesen Ankerpunkt, aber ich schreibe weniger Code. Am Ende des Tages möchte ich weniger Code schreiben. Ich möchte Ergebnisse erhalten und weniger Code schreiben. So Linie 21, neue HRotate, r1, das Ziel, 0.5, die Geschwindigkeit. Wieder können Sie hier reinkommen und dies zu einer negativen Zahl machen und es wird dann gegen den Uhrzeigersinn animiert. Nun, das endet dieses Video. Wir haben uns überhaupt nicht mit Anker auseinandergesetzt. Im nächsten Video werden wir uns die nächste Spanne von HRotate-Dateien ansehen, die über die verschiedenen flexiblen Dinge sprechen, die wir mit Anker tun können. So sehen wir uns im nächsten Video. 7. Einheit 2, Video 2: In Ordnung. In diesem Video möchte ich die nächsten vier Dateien durcharbeiten, die Beispiel vier , fünf, sechs und sieben sein werden , weil sie alle zusammengefasst sind, weil sie sich mit Anker beschäftigen, sehen Sie hier in einem Moment. Also, schauen wir uns Beispiel vier an und lassen Sie uns durch, was ich hier eingerichtet habe. Anstatt ein Rechteck zu drehen, werde ich eigentlich drei drehen. Also, schauen wir uns einfach einige der Anpassungen an. Oben oben haben wir hRect r1, r2, r3, da wir drei Rechtecke anhängen werden, und alles, was ich im Grunde getan habe, war das Kopieren und Einfügen eines Rechtecks zwei weitere Male und machte einige leichte Anpassungen. Also, r1, r2, r3 kopiert nur, und das einzige, was geändert wurde, ist, dass die Farben eine Abstufung von Orangen machen werden . Du hast also eine dunkle Orange, mittlere Orange und eine hellorange. Dann ändere ich offensichtlich ihren Standort. Also, da ich drei Rechtecke habe und ich möchte, dass das mittlere in der Mitte des Bildschirms ist, wenn Sie d2 betrachten, sagt die Position Breite geteilt durch zwei Höhe geteilt durch zwei. Wir wissen also, dass r2 in der Mitte des Bildschirms sein wird. Nun, wenn Sie sich r1 ansehen, sagte ich nur, hey, Breite geteilt durch zwei, Höhe geteilt durch zwei. Aber wenn Sie diese Breite durch zwei geteilt machen, subtrahieren Sie einfach 160. Also, es beginnt in der Mitte und bewegt dann 160 Pixel von der Mitte. Natürlich ist r3 plus 160. Also, wenn Sie sich die Position für r3 ansehen, ist es Breite geteilt durch zwei plus 160. Nun, der Grund, warum ich drei Rechtecke in dieses Stück gelegt habe, ist, dass wir wirklich beginnen könnten , die verschiedenen Facetten der Verwendung von Verankerungen zu erforschen. Nun, wir haben das ein bisschen in der ersten Klasse abgedeckt, aber wieder ist das eine nette Auffrischung. Schauen wir uns die Zeilen 29 bis 31. Wir haben drei separate HRotate, und wieder können Sie mehrere HRotate aufrufen. Was passiert, ist, dass ich im Grunde drei Rotationsverhalten registriere und verschiedene Ziele spezifiziere. Die erste HRotate zielt also auf r1, die zweite Instanz von HRotate r2, die dritte Instanz von HRotate r3. Nun, wenn wir in unsere Zeichnung schauen, habe ich gerade noch ein wenig mehr Verarbeitungscode hinzugefügt, um anzugeben, wo der Ankerpunkt der Rotation ist. Also, lasst uns voran gehen und diese Skizze testen und sehen, was passiert. Also, wir haben drei Rechtecke. Wir lassen sie mit unterschiedlichen Drehzahlen bewegen , weil wir drei verschiedene HRotates registriert haben. Wieder sehen wir uns den Ankerpunkt hier an. Also, wenn kein Anker angegeben wird, haben wir die 00 und die drei dieser Jungs bewegen sich. Großartig. Also, nehmen wir das jetzt und speichern Sie es einfach noch ein paar Mal und beginnen, die Arbeit mit Ankern zu erkunden. Also, damit werde ich zu Beispiel fünf gehen. Ich werfe das hier rüber auf den Bildschirm. In Ordnung. Also, wenn Sie jetzt Beispiel fünf öffnen, ist dies ein Duplikat von Beispiel vier, außer dass wir ein Verankerungssystem hinzugefügt haben. In Ordnung. Also, wenn man sich r1, r2 und r3 anschaut, kann man sehen, dass wir eine Konstante eingesteckt haben. Also, das ist eine Hype Konstante, und wir werden Konstanten hier in ein wenig erkunden. Die Konstante hier ist H.CENTER. Also, wir sagen, dass das Rechteck 100 mal 100 ist, also, auf den Zeilen 10, auf den Zeilen 18 und auf den Zeilen 26, sagen wir großartig, finden Sie den Mittelpunkt basierend auf der Breite und Höhe des Objekts. Da also die Rechtecke 100 mal 100 sind, endet das AnchoRat H.CENTER 50-50, und lasst uns voran gehen und diese Skizze testen und Sie sollten sehen, dass wir immer noch die Rotation bekommen, aber wir haben in der Tat geändert, wo der Anker der Rotation tritt auf. Also, jetzt, wieder unsere kleinen blauen Punkte sind Darstellungen der Anker haben sich nicht geändert, Sie können sehen, dass sie sich immer noch in den gleichen exakten Positionen befinden. Aber jetzt bekommen wir diese schöne Rotation auf diese Weise, weil wir AnchoRat gebeten haben, H.CENTER zu sein. Nun, wenn Sie wollten, könnten Sie den HYPE Processing-Ordner öffnen, und wenn Sie tatsächlich in pde gegangen sind, würden Sie sehen, dass es eine HConstants.pde gibt. Wenn Sie dies tatsächlich öffnen würden, würden Sie viele der verfügbaren Konstanten sehen, die sich in Hype befinden. Wir haben Dinge wie links, rechts, Mitte, Farben. Also, Sie können hier sehen, wir haben Zentrum, und natürlich ist es mit einigen Standardnummern gefüllt, aber diese werden basierend auf Ihrer Asset-Größe überschrieben. Also, sieh dir das an. Wir haben andere Konstanten wie oben links, oben rechts, unten links, unten rechts, so weiter und so weiter. Also, diese H.Constants.pde ist schön, weil Sie dies durchschauen können und alle verschiedenen Arten von Konstanten sehen können, die wir innerhalb der Höhe ausgespült haben. Also, Zentrum, großartig. Wir haben diesen zentralen Drehpunkt. Nun, gehen wir weiter und gehen Sie zu Beispiel sechs, weil es beginnt einige dieser anderen Konstanten zu erkunden, die wir innerhalb des Hype Frameworks haben. Also, wieder, Beispiel sechs ist das gleiche wie vier und fünf, wir haben gerade die AnchorAt -Konstanten geändert. Also, schauen Sie sich r1 an. Auf dieser einen, auf Zeile zehn, sagten wir gut, okay, ich will Anchorat, aber dieses Mal lassen Sie uns Center-top tun. Wenn wir also ein Kunstwerk hätten, würde es nach oben gehen, aber dann würde es sich auf die Breite dieses Objekts zentrieren. r2, einfach H.CENTER wieder tun, r3, um zu sehen, was unten rechts tun würde. Wenn wir also diese Skizze testen, fangen wir an, die verschiedenen Arten von verfügbaren Ankerpunkten zu betrachten, die wir haben. Nun, der einzige, der wirklich anders aussieht, ist r1, weil Sie gesagt haben, center-top. Es ist schwer zu sehen, dass das eigentlich r3 unten rechts ist , weil es keinem AnchorAt sehr ähnlich aussieht, was 00 ist. Man muss sich also bewusst sein, dass manchmal einige dieser Anker, die wissen würden, dass das eigentlich unten rechts ist weil es einer Rotation von 00 sehr ähnlich aussieht. Also, diese Konstanten existieren, es stellt nicht unbedingt auf dem Bildschirm dar, dass hey es nicht 00 ist, es ist eigentlich, dass wir tatsächlich unten rechts verankern. Sie würden es visuell unten rechts verankert sehen, wenn wir tatsächlich drehen würden, vielleicht ein Kunstwerk, das wir einen Illustrator oder eine Schrift gemacht haben, und so dass Sie sehen konnten, wie es um diesen Anker drehte , war nicht oben des Buchstabens a, aber vielleicht die untere rechte des Buchstabens a, wenn wir etwas mit Typ tun würden. Nun, AnchoRat ist nett, aber wir fangen an, in einige viel interessantere Dinge zu kommen, wenn Sie einfach Anker verwenden. Also, AnchoRat will immer eine Konstante zugeführt werden, Anker will Koordinaten kennen. Also, ich werde voran gehen und schließen Beispiel sechs und ich werde zu unserem letzten Beispiel für dieses Video gehen , das Beispiel sieben ist. Nun, wenn Sie Beispiel sieben öffnen, wie Sie vielleicht vermutet haben, dass es das gleiche wie vier, fünf und sechs ist, außer anstatt AnchorAt zu verwenden, verwenden wir Anker. Nun, ich mag es, in Anker zu bleiben, weil ich in der Lage sein mit den Zahlen zu verwirren und verschiedene Arten von Ergebnissen zu sehen. Anker können Sie nun eine beliebige x- und y-Koordinate angeben. Also, wieder, wenn wir hier in Zeile 10, in Zeile 18 und in Zeile 26 schauen , können Sie jede x- und y-Position als Ankerpunkt für die Rotation angeben, und hier ist, wo Hype wirklich glänzt. Um dies in der regulären Verarbeitung zu tun, wird es mir ein wenig schwieriger, ein Objekt tatsächlich so einfach um eine angegebene Ankerposition drehen zu lassen, wie es bei der Verwendung von Hype ist. Sehen wir uns jetzt r1 und r2 und r3 an. Wir alle wissen, dass das Kunstwerk 100 mal 100 ist. Also, wenn wir uns r1 ansehen, schauen wir uns die erste Ankerposition an. Wir haben gesagt, dass das x 50 ist und dass das y 25 ist. Also, was uns das sagen würde, ist, dass, wenn dies unser Kunstwerk ist , wir wissen, dass die Exposition die Mitte ist. Denn 50 ist die Hälfte von 100, so dass wir wissen, dass es auf der X-Achse halb so weit ist. Aber das y ist jetzt 25, was bedeutet, dass es nur 25 Pixel von oben heruntergefallen ist. Wenn wir r2 betrachten, können wir sehen, dass sein x auch 50 ist, aber es ist y ist negativ 25, was bedeutet, dass der Ankerpunkt tatsächlich außerhalb des Artworks liegt und etwas darüber 25 Pixel. r3, wieder ein wenig ungewöhnlich, die Ankerposition ist Null für das x, aber 150 für das y. Also, es ist auch außerhalb des Artworks. Nun, lassen Sie uns diese Skizze testen, und wir werden beginnen, diese verschiedenen Arten von Rotationen zu sehen. Also wieder, ich bevorzuge wirklich Anker, denn wenn ich beginne, Dinge zu bewegen oder Dinge auf dem Bildschirm zu animieren, neige ich dazu, mehr überrascht zu sein, wenn ich Anker verwende und vor allem wenn ich Anker mit Zahlen verwende, die außerhalb der Kunstwerke. Also, das Kunstwerk fegt herum und so. Also, das schließt dieses Video ein, in dem wir wirklich diese vier Dateien, die uns zu Anker und Anchorat vorstellen, abdecken . Das letzte Video behandelt die letzten drei Dateien und den Abschnitt, der nur einige Verbesserungen und Möglichkeiten bei der Verwendung von HRotate zeigt. Außerdem werden wir wahrscheinlich einige Dinge vorstellen, die wir nicht bis ein paar weitere Abschnitte behandeln aber ich denke, es ist schön, einige Dinge zu zeigen, die kommen werden. also daran, dass Anker nicht nur mit Rotation ist, sondern mit jedem Verhalten. Es ist mit HTWeen, seinem Hoscillator. Also, Anker werden super wichtig, wenn wir anfangen, Dinge auf dem Bildschirm zu bewegen, weil es wirklich die Art der Animation diktiert, die wir sehen. Ist es etwas, das fixiert ist und um einen Mittelpunkt wirbelt, oder bekommen wir diese feurigen Bewegungen, weil wir tatsächlich den Anker des Artworks abgesetzt haben. Also, denken Sie daran, wie Sie beginnen, Ihre eigenen Anpassungen zu versuchen, wenn Sie Dinge animieren , die verankern kann diese Sache sein, die Sie viele verschiedene Zahlen ausprobieren können und wir werden viele verschiedene animierte Ergebnisse erhalten. Ok. Drei weitere Akten sind übrig. Wir sehen uns im nächsten Video. 8. Einheit 2, Video 3: Okay, also werden wir die letzten drei Dateien im Abschnitt von HRotate abdecken. Es gibt nur ein paar Tricks. Ich liebe nur einige dieser Features hier wirklich. Also, lassen Sie uns mit Beispiel acht beginnen. Beispiel acht behandelt die Idee der Verschachtelung und was passiert, wenn ein Objekt in einem anderen Objekt verschachtelt ist, diesem Hauptobjekt jedoch ein HRotate zugewiesen ist. Also, liebe das, und das ist so ein großer Trick, den du hier verwenden kannst. Also, lassen Sie uns Beispiel acht aufschlüsseln. Ich möchte zwei Rechtecke zeichnen. Also, ich habe r1 und ich habe r2. R1 ist ein 100 mal 100. Es hat einen Anker von negativem 50. Wir wissen also, dass das Kunstwerk zentriert sein wird. Aber warum die Position 50 Pixel von der Grafik darüber negativ sein wird, okay? Wir können auch sehen, dass r1 eine Farbe von Orange hat. Hier ist der wichtige Teil. Sehen Sie sich das an, genau hier, Zeile 9 ist H.add (r). Also fügen wir der Bühne hinzu, wir sagen Hype, dass wir dieses Rechteck namens r1 hinzufügen. Lassen Sie uns jetzt einfach r2 für eine Sekunde vergessen, denn hier unten in Zeile 23 können Sie sehen, ich habe es kommentieren, aber es sagt neue HRotate (r1), also wissen wir nur von diesem Codeblock, dass die Rotation auf r1 angewendet wird. Jetzt führe ich r2 ein. R2 hat einige leicht unterschiedliche Einstellungen. Zunächst einmal ist das Kunstwerk nur 50 mal 50, so dass es ein kleineres Rechteck ist und man sieht, dass es einen anderen Ankerpunkt hat. Es hat einen Anker von 25, was natürlich die Hälfte von 50 ist, so dass wir wissen, dass es zentriert sein wird, aber es ist negativ 25 von seinem Y also wissen wir, dass es 25 Pixel höher ist. Sie können hier an der Füllung sehen, dass es sich auch um einen Blaugrün handelt. Jetzt ist Zeile 17 die Magie. Zeile 17, fügen wir r2 zu H hinzu? Nein! Wir werden tatsächlich das r2-Rechteck innerhalb des r1-Rechtecks setzen. So können Sie dort in Zeile 17 sehen, sagen wir r1.add (r2) und so wenn ich diese Skizze testen würde, was Sie sehen würden, sind zwei Rechtecke. Aber was Sie visuell zumindest noch nicht wissen, ist, dass r2 tatsächlich innerhalb von r1 ist, aber weil es später Sekunde hinzugefügt wird, befindet es sich darüber. Es hat also eine höhere Tiefe, weil wir es an zweiter Stelle hinzugefügt haben. Aber wenn Sie sich r1 als nur dieses Objekt vorstellen könnten, das unendlichen Raum hat, endet es, dass r2 innerhalb von r1 ist, aber darüber schwebt. Jetzt ist die beste Analogie, die ich vielleicht finden könnte wie eine Gruppierung in Photoshop oder Illustrator. Wenn Sie also zwei Ebenen hatten, könnten Sie sie in einem Ordner oder so etwas gruppieren. Wenn Sie also diesen Ordner tatsächlich verschoben haben, würden Sie alle Assets verschieben, die sich in dieser bestimmten Gruppierung befanden. Jetzt ist der Grund, warum das großartig ist, weil, wenn ich Zeile 23 auskommentiere und r1 sage, wie Sie vielleicht erraten haben, dreht es sich tatsächlich r2. Also die einfache Tatsache, dass ich eine HRotate auf ein Asset anwende, aber dann ein anderes Asset innerhalb dieses Assets investiere, ja, es wird sich damit drehen. Also, ich mag diese Idee des Verschachtelns weil es meinen Code ein wenig schlanker macht, weil ich nur eine HRotate angeben muss und r2 nur innerhalb von r1 ist , also vergiss nicht, dass du diese Art von Verschachtelung machen kannst. Also, jedes Mal, wenn Sie h.add, es fügt dieses Objekt zur Bühne hinzu. Sobald jedoch ein Objekt hinzugefügt wurde, können Sie mit der Verschachtelung beginnen. Wie in den vorherigen Dateien hatten wir eine r1, r2, r3, Sie könnten r1 zu H hinzufügen und dann r2 könnte in r1 sein, r3 könnte in r1 sein, r3 könnte in r2 sein. Sie können jede Art von mehrstufiger Verschachtelung so durchführen. Wieder brauchen wir nur eine HRotate, weil die anderen Objekte darin sind, so dass sie natürlich als Gruppe gedreht werden. Hübscher Mörder. Etwas zum Nachdenken. Lassen Sie uns zum Beispiel neun gehen. Öffnen Sie jetzt Beispiel neun und ich werde ein paar Dinge vorstellen. Auch hier zeige ich gerne eine Vorschau auf Sachen, die gekommen sind. Hier unten wirst du sehen, dass wir HoScillator zeigen werden. Hoscillator decken wir nicht bis ein paar weitere Abschnitte aber wieder ist es nur die Macht der genial. Ich werde es dir zeigen. Also, lasst uns das ausarbeiten. Das erste, was ist, bevor wir zu Hoscillator kommen , schauen wir uns einfach einige der Änderungen an, die passiert sind. Zuerst habe ich ein Auto klar falsch gesetzt, so dass dies etwas ist, das ich glaube nicht, dass wir wirklich in der ersten Klasse abgedeckt , weil wir wieder nichts animiert haben. Aber wenn Draw immer und immer wieder läuft, wenn es eine Schleife ist, ist auto clear true Standard, was bedeutet, dass, wenn Sie das automatische Löschen nicht angeben, es standardmäßig wahr ist, was bedeutet, dass ich den Hintergrund löschen werde, bevor ich etwas malte wieder. Also, im Falle all der anderen Dateien, die wir gezeigt haben, sieht es wie ein einzelnes Objekt aus, das sich ganz von selbst bewegt hat und es keine Rückstände hinterlassen hat, weil wir tatsächlich die Anzeige gelöscht haben, bevor wir die -Anzeige. Nun, indem wir hypes Konstruktor ändern, um Auto Clear falsch zu sagen, sagen wir, hey Mann lösche den Bildschirm nicht einfach halten , das Ding für immer und immer und immer zu malen , das Ding für immer und immer und und wischen Sie den Bildschirm überhaupt nicht und wir werden sehen, was das tut. Einige andere Änderungen. Wir haben einen Strich hinzugefügt und der Strich auf allen drei davon ist dunkelorange und wir haben eine Füllung hinzugefügt. Die Füllung hat die gleiche Farbe wie der Hintergrund und hat unterschiedliche Ankerpositionen. Also, 50,150 für r1, 50, 200 für r2 und 50, 250 für R3. Also, es gibt ein paar verschiedene Alter rotiert Parameter hier. Also, positive eins, positive zwei und negative drei. Also, lassen Sie uns einfach voran und schauen, was diese automatische Falsche tut. Wenn ich diese Skizze hier ausführe, werden Sie sehen, dass wir die Anzeige nicht löschen, bevor wir die Anzeige erneut malen. Also, wieder, Auto Clear ist standardmäßig in Hype wahr, wenn Sie es nicht angeben. Also, in einer der anderen Dateien, die wir gesehen haben, ist es immer die Anzeige gelöscht, bevor es das Display gemalt wird. Nun, jetzt sage ich, tu das überhaupt nicht. Warum malst du das Ding nicht einfach weiter, während es umgeht? Also, jetzt beginnt es interessant zu werden, weil ich hier nur eine einfache Drehung benutze und wir malen die Spur dieses Dings, während es sich um seine Rotation bewegt. Also, lustig. Nun, gehen wir weiter und schließen das und schauen Sie sich das an. Ich habe einen kleinen H-Oszillator hinzugefügt und ich werde nicht bis später in dem Abschnitt, wenn wir diesen Abschnitt behandeln, ausführlich über jeden Oszillator gehen . Aber beobachten Sie, was passiert, wenn ich diese Skizze mit drei Oszillatoren ausführe, und der ganze Oszillator mit diesen drei Rechtecken macht, verändert die Skala. Es wird also die Skala nach oben und unten oszillieren. Also, ich gehe weiter und führe diese Skizze und Sie können sehen, dass ich die Rotation um ihren Anker bekomme, und ich verlasse eine Spur, weil ich AutoClear falsch sage, aber Oszillator oszilliert die Skala nach oben und unten basierend auf einigen -Einstellungen. Also, Sie können nur von dieser einfachen Menge an Code sehen, wir können beginnen, einige ziemlich interessante Muster zu bekommen, und offensichtlich ist dies nur ein Rechteck, wenn wir einige svg oder andere Assets einfügen, können Sie sich vorstellen, wie ich ein Blütezeit auf Tumblr mit diesem Zeug erschaffen diese Art von kleinen Animationen auf Tumblr. Nur mit diesen sehr einfachen Eigenschaften. Unser Beispiel neun, eine Vorschau auf die genial kommen. Wir haben eine letzte Akte hier. Ich wollte nur rotierende SVG zeigen. Also, in den anderen Dateien, haben wir nur einige Rechtecke gedreht. Wenn ich den Ordner Beispiele 10 öffnen würde, könnte man sehen, dass ich einen Datenfehler habe, also richtig, es gibt eine build.pde, es gibt Hype.pde, aber jetzt gibt es einen Datenordner und in diesem Datenordner habe ich zwei svgs. Ich habe ein kleines Zahnrad und ich habe ein großes Zahnrad. Also habe ich diese gerade in Illustrator erstellt und sie als SVG-Assets ausgegeben. Was ich tun möchte, ist, diese Zahnräder zu animieren. Also, sieh es dir an. Ich, im Grunde, das ist das Hinzufügen des Artworks und das Drehen des Kunstwerks. Also, Sie können hier sehen. Ich sage, ich möchte ein SVG importieren. Bitte geh und hol das kleine Zahnrad. Ich möchte Stil false aktivieren. Also, wenn Sie sich von der ersten Klasse erinnern, die eine der Farben tötet , die innerhalb von Illustrator angegeben wurde, habe ich nicht in der Mitte verankert, weil ich möchte, dass sich dieses Zahnrad um seinen Mittelpunkt dreht. Ich gab es einen Standort zu 223 auf dem x, 413 auf dem y, und bekam es als dunkles Orange und dann schauen, was ich hier getan habe. Ich sagte: „H rotieren, hey, ich möchte svg1 negativ 0,5 drehen.“ Dann, dieser nächste Block hier, habe ich gesagt: „Okay, svg2, geh, hol die große svg.“ Erneut, aktivieren Sie Stift false, wieder, Ich möchte ein Zentrum. Ich setze dies bei einem x und y von 690 bis 60 und die Füllung ist eine mittlere Orange, und ich habe gesagt, HRotate svg2 0.3333. Nun, wenn ich diese Skizze ausführe, würden Sie sehen, dass ich eine Animation dieser beiden Zahnräder habe, die sich gegeneinander drehen. All dies wird verwendet, ist HRotate. Das Schöne ist, wenn ich das hier einfach zur Seite schiebe und ich werde nur einen neuen Browser öffnen , weil HYPE keine JAR-Datei ist. Ich möchte Ihnen nur hier zeigen, dass, wenn ich zu movabletype.com gehe, Sie sehen können, dass ich das tatsächlich in JavaScript veröffentlicht habe. Also, das ist eigentlich die Animation , die hier im Hintergrund der beweglichen Typ-Website läuft. Ich bin in der Lage, diese Animation mit Leinwand zu erstellen. Also, ich habe das in der Verarbeitung geöffnet, ich habe den Modus auf JavaScript gewechselt und dies tatsächlich mit der Verarbeitung von JS ausgegeben, was eine Leinwand macht und Sie sehen jetzt diese Animation in Canvas an. Also, schauen Sie sich diese 29 Zeilen Code an. Ich war in der Lage, diese Animation für diese Website in etwa 11 Minuten zu produzieren und das ist, was HYPE macht, hilft mir, Ideen sehr schnell zu Prototypen und zu skizzieren , ohne viel Code schreiben zu müssen. Also, ich konnte HYPE verwenden, um die Formen zu ziehen und HRotate zu verwenden, um diese Zahnräder gegeneinander zu animieren, die schön im Hintergrund sitzen würden, und wieder läuft dies auf Tablets und den meisten modernen Browsern. Ehrfürchtig. Damit wird der HRotate und ein Ankerabschnitt abgeschlossen. Wir gehen nun zur nächsten Reihe von Videos über, die sich mit jeder Leinwand befasst und wie man etwas anderes als nur auf die Bühne malt. Also, siehe im nächsten Abschnitt. 9. Einführung in HCanvas: Jetzt, großartig. Wir haben etwas gedreht, aber das Objekt, das wir in diesem vorherigen Abschnitt gedreht haben , sowie die allererste Klasse, alles wurde auf der Bühne gemalt. Also, wir brauchen ein Backup für eine Sekunde und wir werden jetzt HCanvas abdecken. Was ist HCanvas? HCanvas verarbeitet die P-Grafik. Also, denken Sie daran, wie Sie ein Bild erstellen , und wir werden tatsächlich zu diesem Bild malen. Nun, warum ist das besser, als auf die Bühne zu malen. Nun, wir können mehrere HCanvasen übereinander stapeln. So, ähnlich wie Photoshop oder Illustrator, können wir HCanvas verwenden, um Layering zu machen, oder? So können wir bestimmte Dinge auf einer unteren Ebene malen lassen und bestimmte Dinge auf einer oberen Ebene gemalt werden. Also, der andere Vorteil, diese Art von Leinwand-Schichtung zu haben, ist darüber nachzudenken , ob wir malen, um Bühne und wir haben eine Art von Verhalten wie Verblassen oder Unschärfen. Dieses Verblassen oder Unschärfen würde jedem einzelnen Ding passieren , das auf der Bühne gemalt wurde. Ein weiterer Vorteil bei der Verwendung von HCanvas ist, dass wir Arten von Fading oder Unschärfe angeben können , die nur auf einer pro Canvas-Layer passieren. So kann zum Beispiel eine Animation auf unserer obersten Ebene passieren , die überhaupt keine Art von Fading hat, aber wir könnten ein Schwarm Verhalten auf der Unterseite haben, das wir Spuren verlassen wollten. In diesem Abschnitt werden Sie sehen, dass die Verwendung von HCanvas größere Vorteile bietet , als nur direkt auf die Bühne zu malen. 10. Einheit 3, Video 1: Ok. Wir sind jetzt in HCanvas. Auch hier ist an den Abschnitt eine ZIP-Datei für jede Arbeitsfläche angehängt, und es gibt sechs Beispieldateien in diesem Ordner. Jetzt, in der ersten Klasse und bis zu diesem Punkt, haben wir Objekte auf der Bühne gemalt. Ja, also haben wir gesagt, H.add und was passiert ist, ist, dass alle Objekte, mit denen wir zufällig malen, ob sich um Drawables wie Ellipsen oder Rechtecke handelt, oder wenn es sich um Bilder oder Pfade oder SVG handelt, all dieser Inhalte wurde auf die Bühne gemalt. Also, in einigen Szenarien wäre dies nicht günstig. Lassen Sie uns herausfinden, was diese Szenarien sind. Schauen wir uns das erste Beispiel an. Das erste Beispiel ist wie ein Hrotate-Beispiele. Es sieht so aus, als würden wir einen HRect anbringen, der R1 heißt. R1 ist ein Quadrat, das 100 mal 100 ist. Es hat eine Rundung von 10. Es hat einen Anker von 50 und 125. Die Lage ist die Mitte des Bildschirms mit Division durch zwei, Höhe geteilt durch zwei. Dieses Rechteck hat keinen Strich, und es ist eine Füllfarbe von Orange. Sie können sehen, dass wir eine Hrotation haben, und es dreht sich R1 und es dreht sich mit einer Geschwindigkeit von zwei Grad jedes Mal. Jetzt werden Sie in Zeile fünf feststellen, dass ich AutoClear false einrichte. Also, ich will nicht, dass es das Display abwischt, ich will, dass es ständig die Spuren malt. Sehen Sie sich an, was passiert, wenn wir diese Skizze ausführen. Sie werden feststellen, dass das Rechteck beginnt, und voila. Da wir AutoClear falsch machen, malt es das Rechteck um die Rotation und offensichtlich, sobald es eine vollständige 360-Grad-Drehung macht, haben Sie keine Ahnung, dass tatsächlich eine Animation hier stattfindet. Aber in der Tat gibt es eine, die Boxen langsam eine Rotation um diesen Pfad machen. Also, was, wenn ich das ausblenden wollte? Was wäre, wenn ich wollte, dass diese Kiste eine Spur hinterlassen, aber dann langsam den Weg in den Hintergrund verblassen? Nun, ich werde Ihnen einen Nicht-Hype Trick zeigen, um das zu tun. Sie werden dies wahrscheinlich in einer Menge von Verarbeitungsskizzen sehen. Also, Beispiel eins ist ein Problem, das wir beheben müssen. Also, lassen Sie uns zu Beispiel zwei gehen. Nun, wenn Sie in Beispiel zwei gehen, werden Sie feststellen, dass es diese Kopie eines Beispiels ist, aber ich habe etwas etwas schwierig in der Auslosung gemacht. Auch hier können Sie dies in anderen Verarbeitungsskizzen sehen, aber es hat einige Einschränkungen. Nun, der Trick ist innerhalb der Zeichnung, bevor ich tatsächlich das Rechteck in einer Rotation zu malen, sage ich okay, ich möchte eine Füllung erstellen, und diese Füllung ist 20, 20, 20, 20, dieselbe Farbe wie der Hintergrund, Aber anstatt das Alpha 255 ist, ist das Alpha nur 10. Also erstellen wir eine Füllung, gleiche Farbe wie der Hintergrund, aber es hat eine Alpha von 10. Sehen Sie sich Zeile 21 an. Hier ist der lustige kleine Trick, den die Leute benutzt haben, was ist, wenn wir die Bühne hätten und was wenn wir ein Rechteck mit der gleichen exakten Größe der Bühne machen, aber dieses Rechteck hatte die Füllung von 20, 20, 20 bei einem Alpha von 10, und wurde auf der Oberseite der Bühne gemalt? Dann würde das Rechteck gezeichnet werden, dann würde die Schleife wieder laufen. Also, es schmettert ständig dieses riesige Rechteck, die gleiche Größe wie der Hintergrund, aber mit einer Füllung und einem Alpha von 20. Indem man das immer wieder tut, scheint es im Hintergrund die Spur zu verbrennen. Wenn Sie diesen Trick jedoch verwendet haben, wissen Sie, was als nächstes passieren wird, das heißt, es hat eine kleine Einschränkung. Wenn wir also die Skizze testen, würden Sie sehen, dass, ja, es tatsächlich beginnt, sie auszubrennen, aber weil die Füllung nur ein Alpha von 10 ist, baut sie aus irgendeinem Grund nicht genug auf, um sie tatsächlich zu verbrennen zurück bis in den Hintergrund. Sie könnten also feststellen, dass es tatsächlich einen grünen Geist eines Kreises hinterlassen hat, er brennt ihn tatsächlich nicht vollständig in den Hintergrund. Also, ein bisschen eine Einschränkung dort. Also möchte ich diesen Effekt erzielen, aber ich möchte nicht, dass dieser Rückstand im Hintergrund bleibt. Also, in diesem Abschnitt möchte ich das Video kurz halten, damit ich hier aufhören werde, dann gehen wir zu Beispiel drei, die dieses Konzept der Leinwand verwenden wird. Also werde ich das Video hier stoppen, wir gehen zum nächsten und ich werde in die Muttern und Bolzen der Verwendung jeder Leinwand. Wir sehen uns im nächsten Video. 11. Einheit 3, Video 2: Ok. Wir sind in Beispiel 3, die diese Idee von HCanvas veranschaulichen wird. Jetzt ist jede Leinwand innerhalb der Verarbeitung eine P-Grafik, was im Grunde bedeutet, dass es ein Bild ist. Was ich tun möchte, ist, auf dieses Bild zu malen, nicht auf die Bühne. Ok. Also, eine gute Analogie wäre wie Photoshop. Wenn Sie Photoshop starten und mit der Erstellung von Bildmaterial beginnen, sich in der Regel eine Ebene in der Datei Ihrer Ebene, und diese Ebene wird als Hintergrund bezeichnet. Und du sagst, ich will eine neue Ebene, und das fügt eine neue Ebene oben hinzu und dann fängst du an, Grafiken innerhalb dieses Dings zu machen, und es hat nichts mit dem Hintergrund zu tun. Also, das gleiche genaue Konzept, das heißt, wir haben unsere Bühne und wir werden jede Leinwand über der Bühne hinzufügen und wir werden dazu malen. Sie werden in einigen dieser späteren Dateien sehen, dass enorme Vorteile hat. Also, werfen wir einen Blick auf diese Datei. Oben oben hier, Sie sehen HCanva c1, Leinwand eins, und Sie werden hier auf Zeilen sehen, und noch wichtiger, ich möchte nur auf Zeile 6 hinweisen. Sie werden feststellen, dass ich AutoClear entfernt habe (falsch), richtig? Wenn ich zum Beispiel zu Beispiel 1 zurückgehe, sehen Sie, dass ich AutoClear (false) setze. Also habe ich AutoClear (false) aus Zeile 6 entfernt , weil das die Bühne ist und ich nicht auf die Bühne malen werde. Sie können also voran gehen und die Bühne frei denn das einzige, was ich darauf malen werde, ist diese Leinwand. Ok. Sie werden also feststellen, dass ich AutoClear (false) aus Zeile 6 entfernt habe. Nun sind die Zeilen 9 und 10 neu. Es sagt, „c1 = new hCanvas“ und hier ist, wo wir die AutoClear (false) setzen. Ich will das Bild, auf das wir malen, ich will das nicht klären, bevor ich wieder male. Also, jetzt verlasse ich die Spuren auf der Leinwand. Sieh dir Zeile 10 an, du sagst: „H.add (c1)“. Also, Sie haben Ihre Bühne und dann über Ihrer Bühne, fügen Sie diese HCanvas hinzu. Jetzt gehen wir weiter und schauen uns das Anbringen des Rechtecks an. Also, hier ist unser Rechteck und Sie werden feststellen, dass es aus Beispiel 1, Beispiel 2, mit Ausnahme von Zeile 13. Zeile 13 sagt, füge dies nicht der Stufe H hinzu, füge dies zu dieser Leinwand hinzu, die wir gerade mit dem Namen c1 erstellt haben. Also, erinnern Sie sich an das Verschachtelungsbeispiel, das wir in HRotate gemacht haben Gleiches exaktes Konzept. Also, wir haben unsere Bühne, wir haben unsere Leinwand und wir malen tatsächlich das Rechteck in die HCanvas, richtig? Also verschachteln wir. Ok. Also wieder, kein h.add (r1), es ist c1.add (r1). In Ordnung. Wieder machen wir eine kleine Rotation auf r1 und in der Auslosung malen wir nur h.DrawStage. Sieh dir jetzt an, was passiert. Nun, Sie werden feststellen, dass meine Datei eine Sache fehlt, dann die Zip und ich mache das aus einem Grund. Pass zu, wie passiert! Was für Josh! Testen Sie den Film. Sofort, sofort. Ok. Führen Sie die Skizze aus und schauen Sie, es sieht genau aus wie Datei 1 in dem Sinne, dass es überhaupt nicht verblasst, oder? Es brennt nicht aus. Aber wieder, wir haben unsere Bühne, wir haben unsere Leinwand, und wir haben unser Rechteck, das sich innerhalb der Leinwand dreht. Alles, was ich tun muss, wieder siehst du es in deiner Akte, genau hier oben, kann ich Fade setzen und dann eine Nummer übergeben. In diesem Fall möchte ich eine vier verblassen. Also, wenn ich fortfahre und diese Skizze jetzt ausführe, werden Sie jetzt sehen, dass es im Grunde tut, was Beispiel 2 getan hat, außer für sein perfektes Pixelverblassen, dass es diesen grünen Geist tatsächlich nicht in dieser Datei zurücklässt. Also, genial. Ok. Also hoffentlich verstehen Sie, was hier passiert, ist, dass unsere Bühne unsere HCanvas hält und unsere HCanvas ist das, was unser Rechteck hält, und indem wir dieses Fade Vier einfügen, brennen wir dieses Ding aus. Also, offensichtlich, die niedrigste Zahl, die Sie setzen können, ist ein Fade von eins und das würde langsam, richtig. Das würde also langsam ausbrennen. In der Tat, so langsam, dass es keine Chance es auszubrennen, bevor die Schleife wieder beginnt. Lassen Sie mich das auf vier zurücksetzen, damit es Ihre nachahmt. Also habe ich diese Analogie von Photoshop verwendet und hier scheint HCanvas wirklich, weil wir uns ein anderes Problem ansehen würden, auf das wir stoßen würden, wenn wir HCanvas nicht verwenden würden. Ok. Also werde ich zu Beispiel 4 übergehen. Nun, Beispiel 4 hat HCanvas wieder entfernt. Ich habe es rausgeholt, weil ich ein weiteres Problem darstellen möchte, was ist, wenn wir drei Vermögenswerte haben, richtig? Also, wenn wir das nur sehr schnell abhauen, würden Sie sehen, dass dies eine Mimik von Beispiel 2 ist, außer in Beispiel 2 wir nur eine Sache malen und in Beispiel 4 malen wir drei Dinge, richtig? Also, ich habe drei Anrufe, um einen HRect zu tätigen. Ich habe r1, r2 und r3, und wieder drehe ich sie. Wieder zeige ich Ihnen diesen Trick, nur eine Füllung mit einem Alpha von 10 zu erstellen und dann ein sehr großes Rechteck darauf zu malen. Nun, der Grund, warum ich das nochmal zeige, ist, dass wenn ich diese Datei wieder ausführe, Sie feststellen werden, dass es nicht perfekt ausbrennt und wir dieses Geister bekommen, aber wir bekommen dieses Geister jetzt in drei verschiedenen Farben, weil wieder, es kann nicht perfekt auf der Rückseite brennen. Also, großartig. zeigt jetzt diese Idee, oh mein Gott, was ist, wenn ich drei Dinge male? Wie ist Leinwand der Liebhaber, den ich mir immer gewünscht habe? Denn wie diese Photoshop-Analogie kann ich 3 HCanvases haben, und ich kann jedes dieser drei Rechtecke bitten, um ihre eigene separate HCanvas zu malen. Wenn sie auf ihre eigene separate HCanvas malen, können wir alle möglichen verschiedenen Effekte auf diese einzelnen Leinwände tun, wie: „Hey, auto-clear true, malen Sie nicht die Spuren.“ Oder: „Machen Sie diesen einen Fade von vier und machen Sie diesen zu einem Fade von acht.“ Also, ich denke buchstäblich an jede Leinwand wie Ebenen und Photoshop, und ich kann verschiedene Behandlungen auf diese Leinwände anwenden. Also, lassen Sie uns gehen und schließen Sie diese Datei, und lassen Sie uns die Korrektur in Beispiel 5 sehen. Also, in Beispiel 5, ich repariere, ich komme zurück zu Beispiel drei, aber mit Beispiel vier Struktur. Also, ich möchte drei Dinge malen. Jetzt sieh dir das an. Oben oben habe ich jede Leinwand c1, c2, c3, Leinwand eins, Leinwand zwei, Leinwand drei. Sie werden bemerken, dass ich die Leinwände auf den Zeilen neun bis 11 eingerichtet habe, wo ich sage: „Okay, c1 ist ein HCanvas, c2 ist ein HCanvas, und c3 ist ein HCanvas, aber ich werde ihnen verschiedene Einstellungen geben. Die c1-Leinwand wird automatisch true löschen, so dass sie keine Spuren malen wird. Die c2 wird eine Fade von acht machen, und die c_3 wird ein Fade von zwei machen. Also, wieder ist es, als würde man drei Ebenen oben auf der Bühne einrichten und ihnen verschiedene Animationsfiltereigenschaften geben . Ja. Sehen Sie sich die Zeilen 13 bis 15. Das ist die Reihenfolge, in der sie gestapelt werden. Also, du hast Bühne, dann c1, dann c2, dann c3. Also, das ist die Bestellschicht, denn das ist die Reihenfolge, in der ich sie in den Code einfüge. Also, Stufen zuerst, c1, dann c2, dann c3. Entschuldigen Sie mich. Nun, jeder der r1, r2 und r3, werden sie mit ihren c1, c2, c3s sprechen. Also, in Zeile 18, c1, r1, Zeile 25, c2 bis r2, Zeile 32, c3 bis r3. So wird jedes Rechteck auf seine eigene separate Leinwand gemalt. Wieder haben wir unsere Rotationen hier drin, und bei der Auslosung bitten wir sie nur, eine Bühne zu zeichnen. Ehrfürchtig. Lass es uns laufen. Also, ich werde voran gehen und das ausführen, und Sie werden feststellen, dass wir genau das bekommen, was wir erwartet hatten, ist die Schaffung von drei Ebenen, drei Leinwänden, die unsere Rechtecke auf jede dieser Leinwände malen und eine anders aussehen, etwas, das man nicht erreichen konnte und die Verarbeitung nur dadurch. Ein Rechteck-Burnout-Trick innerhalb der Ziehung, weil er es auf alle drei anwenden würde. Also, Beispiel fünf beginnt wirklich zu, ich denke, dass ich jetzt auf all diese großartigen Dinge hinweisen kann, die wir mit HCanvas tun können , das heißt: „Oh, mein Gott, ich werde mir HCanvas als Ebenen vorstellen, und vielleicht auf einer Ebene habe ich Typ und ich will das nicht Typ, um Trails zu verlassen, aber dann habe ich diese andere Ebene, die einige Animationen haben könnte , die Spuren hinterlassen.“ Also, Sie beginnen, sich jede Leinwand wie Ebenen wie in Photoshop zu denken und Sie wenden nur verschiedene Effekte auf jede dieser HCanvasen. Also, dann dachte ich, ich würde Ihnen nur eine letzte Datei geben bevor wir den Abschnitt beenden, der Beispiel sechs ist. Beispiel sechs wird nur diese drei Rechtecke übereinander setzen. Also, wenn Sie zum Beispiel sechs gehen, werden Sie feststellen, dass wirklich das einzige, was sich geändert hat, und insbesondere dieses, ist, einen Blick auf die Fades, die ich in einem Fade zwei setzen, ein Fade vier, und ein Fade Eight für jeden der Leinwände. Aber jetzt, schau, was ich in den Zeilen 13 bis 15 gemacht habe, habe ich die Reihenfolge umgekehrt, in der sie angehängt werden. Also sagte ich: „Hey, ich will die Bühne, dann will ich Leinwand 3, dann Leinwand 2 und dann Leinwand 1.“ Also, ich habe die Stapelreihenfolge geändert, weil das sich auf das Fade bezieht. c3 wird viel langsamer ausbrennen, also will ich es tatsächlich auf dem Boden. c2 wird ein wenig schneller ausbrennen, ich will es in der Mitte, und c1 wird tatsächlich am schnellsten mit einem Fade von acht ausbrennen, und ich will das eigentlich oben. Also habe ich tatsächlich die Stapelreihenfolge der Ebenen umgekehrt. Das Letzte, was ich getan habe, ist in Zeile 19, in Zeile 26 und in Zeile 33, ich habe sie einfach alle in der Mitte der Leinwand. Also, es ist mit geteilt durch zwei, Höhe geteilt durch zwei. Wenn Sie das tatsächlich ausführen, weil sie drei verschiedene Farben sind, und weil sie auf drei verschiedenen Leinwänden sind, und weil sie mit drei verschiedenen Raten ausbrennen, schafft es dieses wirklich hübsche Farbverlauf. Also, Sie können diese Tricks tun, bei denen wir HCanvas konzeptionell wie das Erstellen von Ebenen verwenden, und wir können jede dieser Ebenen mit verschiedenen Effekten behandeln, wie, bitte löschen Sie den Hintergrund, oder löschen Sie nicht den Hintergrund, gehen Sie voran und fügen Sie ein Fade hinzu. Ehrfürchtig. Wir werden HCanvas viel verwenden, denn wieder, wenn ich über die Erstellung von Animation nachdenke, möchte ich eine Ebene von Dingen auf unsicheren Ebenen, und HCanvas ermöglicht es uns, das zu tun. Also, wieder passiert nichts auf der Bühne, alles geschieht auf diesen HCanvas-Layern. Süß! Das schließt diesen Abschnitt ein. Wir werden HCanvas eine Tonne in den restlichen Abschnitten verwenden. Als nächstes werden wir auf HFollow übergehen, was zu diesem Zeitpunkt Rotation wirklich keine Eingabe hatte. Jede Leinwand hatte keine Eingabe. HFollow ist also das nächste Animationsverhalten, das die Eingabe der Maus verwendet. Es wird also folgen, wo wir Mausbewegungen machen. Also, wenn ich jede Leinwand einschließe, sehe ich dich in einem HFollow. 12. Einführung in HFollow: Also, in diesem Abschnitt werden wir abdecken H-folgen, okay.h-Follow wird in diesen Beispielen die Maus als Eingabe verwenden. Also, in einigen der späteren Abschnitte werden wir lernen über Verhaltensweisen und Verhaltensweisen können unabhängig ausgeführt werden, aber in diesem speziellen Fall wird H-Follow tatsächlich die Maus als Eingabe verwenden. Also, wenn wir anfangen, unsere Maus über den Bildschirm zu bewegen oder tatsächlich eine Geste auszuführen, werden wir etwas haben, das tatsächlich dieser Gestenbewegung folgt. Nun, H-Follow hat eine Reihe von verschiedenen Parametern, die wir tatsächlich auf diese anwenden können. Wenn ich zum Beispiel ein Objekt auf dem Bildschirm male und dann sage, dass ich dieses Objekt H-folgen möchte, ist es ein Eins-zu-Eins-Verhältnis, was bedeutet, dass überall, wo ich meine Maus bewege, dieses Objekt an dieser bestimmten Mausposition geklebt wird. Aber wir können dieses Verhalten tatsächlich erweitern, indem wir ein paar weitere Argumente einführen. Also, ich kann sagen, Dinge wie diese H-Folgen hat eine Leichtigkeit oder eine Feder, und wenn ich sagte, dass H-folgen Lockerung hat, wie ich meine Maus bewegen würde das Objekt einen langsamen Übergang zur Maus machen. Also, als ich mich bewegte, würde es irgendwie langsam hinter sich gehen. Also, du würdest diese nette sanfte Bewegung reinkriegen. Wenn ich eine Feder implementiere, erhalten Sie Elastizität oder Gummibanding. Also, ich könnte anfangen, meine Maus zu bewegen und das Objekt würde tatsächlich Gummiband um diese bestimmte Mausbewegung. Also, mit dem Ende dieses speziellen Abschnitts werden wir lernen, wie man Maus bewegt, ausgeführt Geste, die eine großartige Kombination mit Pixel-Coloristen ist, richtig? Also, diese allerletzte Datei, an der wir arbeiten werden, werden wir tatsächlich ein Foto laden und wir können die Maus tatsächlich wie einen Pinsel bewegen und tatsächlich Farbe von einem Foto aufnehmen. Also, Es wird eine interessante Möglichkeit sein, tatsächlich ein Porträt von jemandem zu machen , weil Sie diese Porträtinformationen von diesem Foto verwenden und H-folgen verwenden, um wie ein benutzerdefinierter Pinsel auszuführen. 13. Einheit 4, Video 1: Hallo. Willkommen bei HFollow. In den ersten Beispielen haben wir Animationen verwendet, die von keiner Eingabe gesteuert wurden. Also, mit HFollow, werden wir behandeln, wie man die Maus verwendet, um tatsächlich Eingabe zu steuern. Also, wir werden Geste ausführen und etwas wird unserer Maus folgen. Nun, wenn Sie die ZIP-Datei herunterladen, die mit diesem Video verbunden ist, sollten Sie das entpacken, öffnen Sie sie und sehen, dass es sechs Dateien mit HFollow verbunden sind. Jetzt habe ich ein Beispiel, das jetzt geöffnet ist und Sie werden feststellen, dass ich einige Kommentare in diese Datei hinzugefügt habe, so dass Sie einige der Funktionen von HFollow sehen können, einige der Argumente, die es unterstützt, sowie lernen, wie man sich registriert Registrierung, fügen Sie ein Verhalten hinzu oder entfernen Sie es. Also, wenn Sie ein Zwischenprogrammierer für die Verarbeitung sind, zeige ich nur einige der Feature-Sets von HFollow. In Ordnung. Also, lassen Sie uns diese erste Datei aufschlüsseln. Sie können hier oben sehen, ich erstelle eine Instanz von HFollow namens mf für Mausfolgen. Ich habe r1, hRect wo Auto Clear hier nicht vorhanden ist , also wissen wir, dass das den Hintergrund klären wird. Wir haben unser Rechteck, es ist 100 mal 100 mit einem Viertelradius von 40. Wir wenden keinen Schlaganfall auf r1 an. Die Füllung wird ein heller Grauton ECECECEC sein. Der zu beginnende Ort befindet sich in der Mitte der Leinwand, wobei dividiert durch zwei, die Höhe durch zwei geteilt wird. Der Ankerpunkt wird in der Mitte sein und ich werde einfach dieses Rechteck um 45 Grad drehen. Also, durch Drehen bei 45 Grad, sollte wie ein Diamant aussehen. Ich gehe voran und füge r1 zur Bühne hinzu und dann genau hier gebe ich Maus-Follow-up an. Also, ich sage Maus folgen, du bist ein neuer HFollow und das Ziel ist r1. Natürlich, vermeiden Sie ziehen einfach genauso wie H.DrawStage. Wenn ich diese Skizze ausführe, werden Sie feststellen, dass es im Grunde ein Verhältnis von 1 zu 1 ist. Also, wohin die Maus geht, die r1 an dieser Position stecken. Es gibt also keine Latenz. Ich ziehe das einfach herum und wo immer ich hingehe, geht es hin. Im Grunde ist HFollow ein Weg, als Abkürzung für die x- und y-Position der Maus. Nun, Sie könnten sich diese Kommentare ansehen und erkennen,, oh, okay, es gibt einige andere Funktionen hier. Also dachte ich, ich würde diese Funktionen zwei separate Beispiele ausblasen. Also, lassen Sie uns voran und schauen uns Beispiel zwei an. Nun, das einzige, was in Beispiel zwei anders ist , ist die Anwendung von etwas „Leichtigkeit“ auf diese Folge. Also, wenn Sie auf Zeile 21 hier schauen, haben wir eine Maus folgen ist ein neues HFollow. Das Ziel ist immer noch r1, aber wir haben eine Leichtigkeit von 0.1 hinzugefügt. Es wird also kein Verhältnis von 1 zu 1 sein, wo sich die Maus befindet. Es wird sich tatsächlich in Position bringen. Also, wenn ich diese Skizze ausführe, sollten Sie bemerken, dass, wenn Sie Ihre Maus bewegen, r1 die Maus jagt, aber es hat eine gewisse Lockerung. Es handelt sich also nicht um ein Verhältnis von 1 zu 1, sondern wird langsam an Ort und Stelle animiert. Nun gibt es noch ein anderes Argument außer Leichtigkeit Wenn wir also die Skizze schließen und sich Beispiel drei ansehen, ist das einzige, was in Beispiel drei anders ist, dass wir das Attribut Frühling hinzugefügt haben. Also, wir wollen hier etwas Elastizität bekommen. Also, Sie werden sehen, dass ich immer noch Leichtigkeit bei 0.1 habe, aber ich hatte etwas Frühling auf diese HFollow angewendet und dieser Frühling macht 0.95. Auch wenn wir diese Skizze hier ausführen, werden wir sehen, dass es sich nicht um ein Verhältnis von 1 zu 1 handelt. Es macht tatsächlich einfacher, um die Maus, aber es hat auch diese Elastizität. Also, es ist ziemlich lustig, wenn du hier die Kreise machst. Du bekommst diese schönen elastischen Muster. Nun, damit konnten Sie sehen, dass dies ein ziemlich gutes System für die Herstellung von Bürsten sein könnte. Ich könnte das als Pinsel benutzen und jemand könnte Geste ausführen und irgendeine Art von Malerei könnte passieren. Also, lassen Sie uns gehen und schließen Sie das und schauen Sie sich Beispiel vier an und Beispiel vier sagt nur, Ordnung, nun, lassen Sie uns das so behandeln, als wäre es ein Pinsel. Also, das erste, was ich möchte, dass Sie bemerken, ist auf Zeile sieben, wir sagten AutoClear (falsch). wir also tatsächlich bewegen, wird es den Pfad verlassen, weil er den Hintergrund nicht löscht , bevor er das Rechteck wieder malt. Ich habe auch einen HColorPool hinzugefügt und einige Farben zur Verfügung gestellt. Also, hier in Zeile 10, erstelle ich den neuen HColorPool und gebe dann einige Farben innerhalb dieses Pools an. Werfen wir einen Blick auf r1, weil r1 ein wenig angepasst hat. In den ersten drei Versionen haben wir wirklich nichts mit dem Schlaganfall gemacht. Hier kann man sehen, ich habe gesagt, nun, ich möchte auch das Strichgewicht machen und ich möchte die Füllung zu einem sehr dunkelgrau machen ; 111111. Also, das ist die Änderung hier und r1 fügt ein Strichgewicht hinzu und ändert tatsächlich die Füllung von dieser EC auf die 11. Auch hier hat sich die Mausfolge nicht geändert. Es sieht so aus, als hätte ich die Lockerung verlangsamt. Also, die Lockerung ist 0.05 und die Feder wird immer noch wirklich elastisch sein bei diesem 0.95. Nun, die Änderung hier ist online 30 Ich sagte, okay, wie das läuft, möchte ich r1 Strich aktualisieren, um zufällig eine Farbe aus den Linien zehn Farbanordnung zu erhalten. Im Gegensatz zu 30 wird es zufällig eine dieser Farben auswählen. Nun, wenn ich die Skizze jetzt ausführe, sollten Sie wieder sehen, dass es zufällig eine Strichfarbe auswählt. Aber als ich anfing, meine Maus zu bewegen, verlasse ich den Weg, wo diese elastische Maus folgen reiste. Also wieder, ich kann mir das als einen Pinsel vorstellen, wenn ich meine Mausposition auf dem Bildschirm bewege. Also, lassen Sie uns das hinzufügen. Also dachte ich, nun, okay, das ist schön, dass wir zufällige Farbe auswählen , aber wenn man sich Beispiel fünf anschaut, sagt Beispiel fünf, nun, lasst uns die Farbe tatsächlich von einem Bild beziehen. Also, wenn Sie sich Beispiel fünf ansehen, gibt es tatsächlich einen Datenordner und innerhalb dieses Datenordners, ist dieses JPEG, das ich in Sintra Portugal genommen habe. Wir werden HPixelColorist verwenden, um tatsächlich die Farbe aus diesem JPEG zu stehlen. Also, wenn Sie sich Zeile drei hier ansehen, anstatt Farbpool zu verwenden, verwenden wir HPixelColorist und dann in den Zeilen 10 bis 14 habe ich das Bild angegeben, das HPixelColorist verwenden sollte, was ist, Hey, geh get get this sintra.jpeg und Sie können sehen, dass ich auch das Argument weitergebe, dass ich nur die Färbung auf die Füllung anwenden möchte. Nicht auf den Strich, nicht auf die Füllung und Strich, sondern nur auf die Füllung. In Ordnung. Also, schauen wir uns r1 hRect an. Die einzige wirkliche Anpassung, die ich hier gemacht habe, war, dass ich eine Strichfarbe von Schwarz hinzugefügt und ein Alpha von 150 eingefügt habe. Also, der Schlag wird nicht solide 255 schwarz sein, es wird ein wenig Alpha sein. Aktualisieren Sie die Zeichnung unten auf Zeile 35 hier, Sie können sehen, dass wir sagen colors.applycolortor_1 und weil Farbe nur Füllung angegeben ist, ist es tatsächlich nur gehen, um die Füllungen zu aktualisieren. Also, wenn ich fortfahre und diese Skizze ausführe, habe ich jetzt eine Möglichkeit, einen Pinsel zu verwenden, aber ich entnehme tatsächlich die Farbinformationen aus dem bereitgestellten JPEG. Also, die X- und Y-Position meiner Maus stiehlt die x- und y-Position auf dem JPEG und betrachtet die Farbe des Pixels an dieser spezifischen x- und y-Position. Also, das ist ein Trick, den viele von uns Eric Netsky verwendet haben, wo er diese Systeme hat, die tatsächlich malen und die Farbe von Fotografien abtasten, die er nimmt. Also, bis zu diesem Punkt haben wir fünf Prüfungen gemacht, aber Sie haben vielleicht bemerkt, dass wir unseren guten Freund HCanvas nicht vorgestellt haben. Also dachte ich, ich würde ein Beispiel sechs hinzufügen und innerhalb von Beispielen sechs habe ich acht HCanvas c1 in den Zeilen 11 bis 12 hinzugefügt. Ich sage, hey, ich möchte eine HCanvas machen, das Auto klar ist falsch auf der HCanvas. Also, ich entfernte es von Zeile acht zog es hier unten, so dass ich nicht automatisch die HCanvas lösche und ich setze in diesem schönen Fade von vier und dann H.addc1 und dann, wenn Sie nach unten auf Zeile 25 schauen, sage ich eher als h.add Ich sage bitte fügen Sie r1 zur Leinwand C1 hinzu. Abgesehen davon ist alles andere immer noch gleich. Wenn Sie fortfahren und die Skizze ausführen, sollte sie genau wie Build 5 aussehen. Abgesehen davon , dass wir das schöne perfekte Pixel Fading der Geste mit unserem guten Freund HCanvas haben. Ehrfürchtig. Also fangen wir jetzt an, einige dieser Verhaltensweisen zu betrachten. Das ist ein nettes, weil es Geste ist. Wir können anfangen, Pinsel zu bauen, und es spielt keine Rolle, ob wir einen hRect für den Pinsel verwenden oder SVG verwenden. Also, hier ist eine perfekte Gelegenheit, einige der Kunstwerke zu nehmen, die wir in der ersten Klasse gezeichnet haben , und Sie könnten Ihre SVG tatsächlich als Ersatz für diesen hRect verwenden , so dass Sie jetzt beginnen können, diese benutzerdefinierten Pinsel mit HFollow zu bauen . Nun, der nächste Abschnitt, das ist wie ein perfekter Fortschritt. HRotate lief nur auf eigene Faust und Maus HFollow verlangte Sie, um die Maus zu hören und die Maus zu bewegen. Im nächsten Abschnitt werden wir über Timer sprechen, also wie fange ich an, Dinge basierend auf einem Tempo zu tun. Also, jeder Timer würde mir erlauben, Dinge zu malen oder Dinge basierend auf einem Tempo einzuführen. Natürlich, wenn ich etwas habe, das ein stetiges Tempo ist, würde ich wahrscheinlich auch HrandomTrigger und HrandomTrigger präsentieren wollen, wie Timer sagt, ich möchte Sachen feuern, ich möchte Dinge vorstellen, aber ich möchte nicht tun Sie es in einem sehr konstanten Tempo. Ich möchte dieses Tempo nach dem Zufallsprinzip bestimmen. Also, das ist es, was HRADOMTrigger ist. Also, dies schließt ein HFollow ein. Gehen wir zu Timern. Wir sehen uns im nächsten Abschnitt. 14. Einführung in HTimer und HRandomTrigger: Also, mit HTimer, haben wir im Grunde einen stetigen Impuls von Aktionen. Es basiert auf einem Tempo. Wenn ich also ein Intervall für alle 1.000 Millisekunden feststelle, würde das bedeuten, dass jede Sekunde eine Aktion ausgelöst wird. Ich habe auch die Möglichkeit, so etwas wie Num-Zyklen einzustellen, was ist, wie oft ich möchte, dass dieses Tempo läuft. Also, wenn dieser Puls passiert, habe ich im Grunde einen Rückruf. Also werden wir an einer Datei arbeiten, die HTimer verwendet, um Dinge sehr stetig auf dem Bildschirm zu malen. Also, während HTimer einen stetigen Puls verwendet, um etwas zu erstellen, ist ein netter Begleiter dazu HrandomTrigger, und HrandomTrigger basiert auf einem zufälligen Tempo. Es gibt also einen variablen Zufallsprozentsatz. Also, zum Beispiel, wenn ich sagte, ich wollte einen Zufallsauslöser, aber ich schrieb etwas wie 1/15, würde das bedeuten, dass der Zufallsauslöser eine Chance von 1 zu 15 hat, erstellt zu werden. Also, Sie erstellen immer noch ein Tempo, aber es ist kein stetiges Tempo, es wird ein wenig basierend auf einem zufälligen Prozentsatz versetzt. Also könnten Sie Bop, Bop Bop Bop Bop, Bop, Bop, Bop bekommen. Also, wir erstellen immer noch mit Tempo, aber es ist kein stetiges Tempo wie zuvor in HTimer verwendet. 15. Einheit 5, Video 1: Ok. In diesem Abschnitt werden wir Timer abdecken. HTimer, der, wie ich bereits erwähnt habe, etwas basierend auf einem Puls und jedem zufälligen Auslöser auslösen wird, zufällig einen Impuls auslöst, der auf Zufall, Wahrscheinlichkeit basiert. Also, in diesem Video werden wir tatsächlich an dieses Video anhängen, Sie sollten sehen, dass es tatsächlich eine ZIP-Datei gibt. Wenn Sie diese ZIP-Datei herunterladen, sollten neun Dateien in diesem Zip enthalten sein. Die ersten sieben Deal mit HTimer und dann gibt es zwei darin, die sich mit HrandomTrigger beschäftigen. In diesem speziellen Video werden wir die ersten vier Beispiele in HTimer behandeln. Nun, lassen Sie uns voran und öffnen Sie Beispiel eins, das ist HTimer eins. In diesem speziellen Beispiel wird eigentlich nichts auf dem Bildschirm gemalt. Wir werden eigentlich nur eine Ausgabe in das Ausgabefenster hier innerhalb von Sublime Text 2 drucken das Ausgabefenster hier innerhalb von , die nur Hallo Welt und einen Zähler sagen wird. Also, werfen wir einen Blick auf Timer. Es hat einige Argumente, die wir wahrscheinlich durchlaufen wollen. Die erste wird oben angezeigt. Ich sage, HTimer ist ein Timer. Vergessen Sie den Zähler für einen Moment. Nichts passiert viel in Bezug auf Größe, Hintergrund, was nicht, aber hier auf den Zeilen neun bis 20, Ich gebe tatsächlich den Timer. Also, ich sage, Timer entspricht einem neuen HTimer und wieder, schauen wir uns einige der Argumente des Timers hier an. Die erste ist NumCycles. Nun, wenn Sie diese Zeile nicht haben, dann läuft der Timer unbegrenzt. Es wird laufen, bis Sie den Film wirklich schließen. In diesem Fall zeige ich Ihnen, dass ich nur möchte, dass der Timer tatsächlich 10 Mal feuert. Eins, zwei, drei, vier, fünf, sechs, sieben, acht, neun, zehn und dann wird es heruntergefahren. Nun, wenn das 10 Mal läuft, was ist das Intervall zwischen jedem Mal, das gefeuert wird? So können Sie hier in Zeile 11 sehen, wir haben ein Intervall angegeben und es ist tatsächlich in Millisekunden. Also, in diesem Fall wird es alle 500 Millisekunden oder ungefähr jede halbe Sekunde feuern . Was passiert, wenn der Timer feuert? Das ist eigentlich unser Rückruf. Also, Sie werden hier innerhalb des Callbacks sehen, wieder, ich werde nur in das Ausgabefenster am unteren Rand von Sublime Text 2 drucken. Ich werde nur Hallo sagen, Welt und dann Zähler, Welt und dann Zähler, wie oft hat das tatsächlich gefeuert, so dass ich testen kann, dass es tatsächlich heruntergefahren wird, nachdem NumCycles 10 erreicht hat. Also, um zu zählen, hier oben, sage ich Zähler gleich eins und dann auf Zeile 15 Ich sage, okay, drucken Sie „Hallo, Welt“ plus was auch immer der Wert des Zählers ist. Dann, nachdem es damit fertig ist, sage ich einfach, plus Zähler. Plus, plus Zähler sagt, fügen Sie eins auf den Wert des Zählers. Also, eins plus eins wird zwei. Zwei plus eins wird drei. Drei plus eins wird vier, und so weiter. Also, lassen Sie uns gehen und testen Sie diese Skizze, und wieder, wir sollten nichts auf der Bühne sehen, aber Sie sollten innerhalb des Ausgabefensters bemerken , dass es tatsächlich Hallo sagt, Welt 10 mal, eins bis 10 und dann werden Sie feststellen, dass es tatsächlich stoppt. Also, wieder, HTimer ermöglicht es uns, etwas basierend auf einem Puls auszuführen und mit dem Argument von NumCycles, ich kann es sagen, wann ich wirklich will, dass es heruntergefahren wird. Sie werden ein wenig später sehen, dies wäre sehr praktisch mit Pools kommen. Denn wenn ich sage, dass ich 100 Dinge zeichnen möchte, möchte ich vielleicht, dass dieser Timer heruntergefahren wird, nachdem er alle 100 Objekte angezeigt hat. Großartig. Also werde ich voran gehen und die Datei schließen und ich werde weitermachen, um zwei zu bauen. Jetzt, bauen zwei, ich werde anfangen, ein paar Dinge zu machen, visuell auf dem Bildschirm. Also, lasst uns einfach diese Datei durchlaufen und sehen, was wir hier vor sich haben. Also, oben an der Spitze, wieder, wir haben unseren HTimer, wir haben unseren hRect, und wieder passiert nichts viel mit dem Hintergrund. Wenn wir r1 betrachten, Linien neun bis 15, sieht so aus, als würden wir ein Rechteck machen, wieder, dieses Rechteck ist 100 mal 100 mit Eckradius von 10. Ich füge es der Bühne hinzu, H.Standort hinzufügen. Sehen wir uns den Standort hier an. Der Ort sagt: „Hey, ich möchte, dass du einen Platz zufällig auf dem Bildschirm auswählst. Also, ich sage, ganzzahlige Zufallshöhe mit ganzzahliger Zufallshöhe. Das bedeutet im Grunde, dass es eine Zahl zwischen Null und 640 auswählen wird, aber weil es ein int davor gewickelt hat, bedeutet, dass es eine ganze Zahl sein wird, so dass es keine Dezimalstellen wählen wird. Also, ich bekomme 1, 45, 122, et cetera. Dieser HRect hat keinen Schlaganfall. Es hat eine Füllung von Orange, FF3300 und wieder, Ich drehte 45 Grad. Bevor wir zum Timer kommen, verstehen wir nur, dass wir unsere Bühne haben, und es wird nur zufällig eine Stelle aussuchen , und es wird das Rechteck malen. Nun, was ich im Timer mache, ist, dass ich die Position von r1 neu anordnen werde. Also, wenn Sie hier schauen, wie in der ersten Datei, gibt es keine NumCycles, was bedeutet, ich möchte, dass dies unendlich läuft. Also, wenn man sich Build zwei hier anschaut, gibt es keine NumCycles, was bedeutet, dass dieser Timer nur laufen wird, bis wir den Film tatsächlich schließen. Das Intervall beträgt alle 250 Millisekunden, also eine Viertelsekunde. Der Rückruf sagt nur: „Hey, r1. Ich möchte Ihre Position zufällige Breite, zufällige Höhe zurücksetzen. Also, jetzt, wenn wir die Skizze testen, die Sie auf dem Bildschirm sehen sollten, ist, dass alle 250 Millisekunden, ein sehr schneller Puls, es wird die Position von r1 neu zu omisieren. Also, wieder, wir haben es an diesem Punkt nicht mit Pool zu tun, wir haben nur ein Asset und basierend auf einem Tempo hier, 250 Millisekunden, werden wir die Position dieses Rechtecks neu ausmachen. Großartig. Gehen wir weiter, um drei zu bauen. Jetzt, bauen drei, wieder werde ich ein paar neue Dinge vorstellen, aber es ist wirklich nur eine Kopie von zwei. Die erste ist, dass ich einen Farbpool hinzufügen werde. Also, hier oben bemerken Sie, dass ich eine HColorPool Farben setzen und ich habe nur einige Farben hier auf Zeile 10 hinzugefügt. Nun, Zeile 17 ist ein bisschen eine Bearbeitung. Anstatt es eine Farbe zu übergeben, sage ich, hey Farben, gib mir eine zufällige Farbe von oben. Also, Zeile 17 wird es zufällig eine der Farben innerhalb unseres HColorPool auswählen. Nun, ich habe hier noch eine Sache hinzugefügt, ist, dass ich die Größe tatsächlich randomisieren wollte. Also sagte ich, okay die Größe sollte zufällig drei plus 25 sein. Also, wenn man sich das zum Beispiel dreimal 25 anschaut , wird das eine Zufallszahl Null, eins, zwei auswählen. Also, null mal 25 ist Null, ein mal 25 ist 25, und zwei mal 25 ist 50. Wir wissen also, dass diese Randomisierung uns die Zahlen Null, 25 und 50 geben wird. Aber schauen Sie, nachdem es dieses Zufallsprinzip ausgewählt hat, fügt es tatsächlich 25 hinzu. Also, welche Zahl wir tatsächlich bekommen, ist eine Größe von 25, eine Größe von 50 und eine Größe von 75. Also, wir sind nur randomisieren diese drei Zahlen: 25, 50 und 75. Also, wieder, es gibt keine NumCycles, das wird unendlich laufen. Das Intervall beträgt jetzt 50 Millisekunden, so dass es sehr schnell passieren wird. Auch hier spricht es nur mit r1. Zeile 28 sage ich ja, ich möchte den Standort randomisieren. Aber dann sage ich, hey, ich möchte auch eine neue Farbe aus dem HColorPool auswählen, und hey lasst uns wieder eine neue Größe auswählen, und wieder wird diese Größe entweder 25, 50 oder 75. Nun, hier ist die Sache, die ich möchte, dass Sie bemerken, dass Auto Clear tatsächlich auf false gesetzt ist. wir einen Moment so, als wäre das nicht da, wenn ich das wirklich ausschneide. Wenn ich die Skizze hier tatsächlich teste, nochmals bemerken, dass es r1 ist bewegen wir nur dieses eine Asset, aber wir renandomisieren seine Position, wir renandomisieren die Füllfarbe, und wir führen die Größe neu aus. Aber wieder, der Grund, warum ich in das Auto Clear ein Falsch einfüge , ist, weil ich nicht möchte, dass es den Hintergrund löscht. Wenn das jetzt läuft, werden Sie feststellen, dass es aussieht, als würde es eine unendliche Anzahl von Rechtecken malen , aber in Wirklichkeit malt es nur das eine und ändert nur seine Position, ändert seine Füllfarbe, und seine Größe ändern. Aber weil wir sagen, auto clear false, es tatsächlich nicht löscht die Anzeige. Dies wird schließlich die gesamte Bühne füllen. Großartig. So können Sie wahrscheinlich an dieser Stelle herausfinden, was ich mit Beispiel vier machen werde. Also, lassen Sie uns voran und schließen Sie das und lassen Sie uns auf hTimer vier und sicher genug, das erste, was Sie erwarten sollten, war, dass wir hCanvas hinzufügen würden. Lassen Sie uns dieses Rechteck umstrukturieren aber innerhalb einer Leinwand, so dass wir es tatsächlich verblassen können. Sehen Sie sich die Zeilen acht an. Wieder habe ich das Auto Clear true von der Bühne genommen und es den Canvas-Objekten hinzugefügt. So können Sie hier sehen, c1 ist eine neue HCanvas, auto clear false, und es wird ein Fade von zwei machen und wir fügen unsere c1 HCanvas zu H, der Bühne. Schauen Sie sich hier in Zeile 17 an, anstatt h.add r1 zu tun, machen wir c1.add r1. Also, wir malen tatsächlich das Rechteck innerhalb der HCanvas. Abgesehen davon bleibt der gesamte Code unverändert. Gehen wir weiter und speichern und testen Sie diese Skizze, und Sie sollten bemerken, dass es die gleiche Animation in drei ausführt, aber unsere schöne HCanvas brennt langsam die Rechtecke weg. Ehrfürchtig. Also, ich werde dieses Video hier beenden. Wir gehen zum nächsten Video über. Im nächsten Video beschäftigen wir uns mit HTimer fünf, sechs und sieben. Aber zumindest an diesem Punkt verstehen Sie, dass HTimer ein Weg für uns ist, etwas zu befestigen , aber basierend auf einem stetigen Puls. Wenn wir zu HTimer fünf gehen, werden wir anfangen, über Pools zu sprechen, wie wir es in der allerersten Klasse getan haben. Also, lasst uns hier enden und wir sehen uns im nächsten Video. 16. Einheit 5, Video 2: Ok. Ich bin super aufgeregt über diese nächsten drei Dateien. Der Grund, warum ich diese nächsten drei Dateien wirklich liebe, ist, dass ich das Gefühl habe dass sie sich so eng strukturweise mit den Dateien beziehen, die wir in der ersten Klasse gemacht haben. Also, es gibt hier ein paar Dinge, die Sie in der Lage sein werden, aus dieser ersten Klasse zu kopieren und einfügen und tatsächlich Dinge animieren zu lassen. Also, schauen wir uns HTimer5 an. Auch hier beginnt HTimer5 wirklich, die Struktur zu verwenden, die wir in der ersten Klasse gemacht haben. In dem Sinne, dass wir schließlich Hallo zu HDrawablePool sagen. Also, diese Datei sehr ähnlich wie die ersten mit einigen leichten Änderungen hier. Jetzt hDrawablePool Pool oben an der Spitze. Das ist großartig, und ich werde all diese Sachen hier hervorheben , die Zeilen neun bis 33 sind. Bevor wir diesen Code durchlaufen, möchte ich nur sagen, was fehlt. Was fehlt, ist das, was in Zeile 34 wäre, was ist oder tatsächlich, wäre zwischen den Zeilen 32 und 33. Es wäre dass.requestall. Also, in dieser ersten Klasse, als Sie diesen RequestAll angerufen , sagten Sie: „Gib mir alles im Pool. Malen Sie es auf den Bildschirm, weil wir drucken und ich jetzt alles brauche.“ Also, das erste, was Sie bemerken sollten, ist, dass das weg ist. Der Grund, warum das weg ist, ist, weil dies eine Animationsklasse ist und wir unser Kunstwerk animieren wollen. Also, wir werden immer noch Pool benutzen. Wir können sogar Pool in Verbindung mit einem Rasterlayout oder einem Shape-Layout oder was auch immer Sie mit der ersten Klasse gemacht haben. Aber wenn Sie diesen RequestAll entfernen und diesen Timer einschneiden, könnten Sie Ihre Raster tatsächlich animieren. Also, das erste, was Sie bemerken sollten, ist, dass der Aufruf von RequestAll tatsächlich weggenommen wurde. Jetzt gehen wir weiter und schauen uns diesen Pool an, den wir hier haben. In Zeile neun sage ich, Pool ist neu HDrawablePool und, hey, ich möchte hundert Dinge malen. Es sagt pool.autoaddToStage, so dass wir wissen, dass es auf die Bühne malen wird. Nun, was malen wir? Nun, wir malen unseren guten Freund, HRect, und er hat einen Viertelradius von 10 Rundungen. Wir rufen einen Coloristen an. Ich bin mir nicht sicher, ob wir dies in der ersten Klasse behandelt haben , um die Verknüpfung zu erstellen, anstatt einen HColorPool zu sagen, kann HDrawablePool als Colorist-Methode bezeichnet werden. Innerhalb der Colorist-Methode erstelle ich einen neuen HColorPool und übergebe die Farben und gebe an, dass sie nur die Füllungen färben sollen. Nun können Sie sich an die erste Klasse erinnern, Sie diese onCreate-Methode hier haben, und diese onCreate-Methode passiert dass Sie diese onCreate-Methode hier haben, und diese onCreate-Methode passiertmit jedem einzelnen hRect mit allen hundert unserer hRects, die auf dem Bildschirm erstellt werden. Also, ich sage: „Okay, cool. HDrawabled, was möchte ich mit diesem Drawable machen?“ Der Drawable ist der HRect. Warum, ich würde sagen: „Okay, ich will StrokeWeight zu vier. Ich möchte, dass der Strich schwarz ist und dass der Alpha 75 statt 255 ist. Wie die ersten vier Dateien, ist die Position zufällige Breite, zufällige Höhe. Ich drehe die Drehung um 45 Grad. Wieder mache ich hier eine zufällige Größe, also wird die Größe 50, 100 und 150 sein, weil wir dreimal 50 zufällig machen, plus 50, und der Anker bei ist H.CENTER. Also, diese Zeilen hier, neun bis 33, richten den Pool ein und was möchten Sie mit jedem der einzelnen Elemente innerhalb dieses Pools tun ? Aber wieder, RequestAll ist weg. Also, was machen wir hier? Nun, wir haben unseren Timer. Wenn Sie sich unseren Timer hier ansehen, sage ich: „Nun, ich möchte jedes dieser 100 Objekte animieren, anstatt sie alle auf einmal zu sehen.“ Also, schauen Sie sich Zeile 36, NumCycles. NumCycles ist pool.NumActive. NumActive wird zählen, wie viele Dinge auf dem Bildschirm auf einmal gemalt werden, bis es zu hundert kommt. Also, pool.numactive ist eine Möglichkeit für uns herauszufinden, ob wir alle unsere 100 Assets auf dem Bildschirm angehängt haben . Wenn wir alle 100 Assets auf dem Bildschirm haben, dann wird diese NumCycles den Timer herunterfahren. Das Intervall beträgt alle 100 Millisekunden und wenn dieser Timer alle 100 Millisekunden auslöst, was werden wir tun? Das ist unser Rückruf. In unserem Rückruf sagen wir: „Hey Pool, ich möchte einen deiner Typen anfordern.“ Wenn Sie pool.request sagen, geht es bis zum Pool. Es steht: „Hey cool, du fragst nach dem ersten, ich kann dir hundert auf erstellen geben“, und es feuert das onCreate. Also, dieser Timer macht immer eine pool.request, bis wir bis zu hundert sind. Sobald wir bis zu hundert sind, wird die NumCycles den Timer herunterfahren und pool.request wird nicht zum 101. Mal ausgelöst. Es wird nur hundertmal feuern. Die Draw-Funktion, es hat nur eine h.DrawStage. Ehrfürchtig. Sie gehen voran und führen diese Skizze, und was passieren wird, wird animieren. Dies ist nicht das gleiche Rechteck, das sind hundert verschiedene Rechtecke. Das ist, wo es vom ersten, na ja, zum Beispiel HTimer4 variiert . In HTimer4 haben wir uns nur um ein Element bewegt. Hier, was wir auf dem Bildschirm sehen, sind 100 separate Elemente. Also, wie ich schon sagte, können Sie etwas von diesem Code nehmen und tatsächlich das Timer-Zeug ausschneiden, es in die Dateien einfügen, die wir in der ersten Klasse gemacht haben, und Sie könnten tatsächlich Ihre Gitter animieren lassen, weil Sie RequestAll nicht mehr sagen, Sie verwenden tatsächlich einen Timer, um das Kunstwerk zu animieren, ein Bit nach dem anderen. Stellar. Nun, lassen Sie mich Ihnen sagen, warum das stelllar ist, weil schauen Sie sich an, was passiert, wenn wir zu HTimer sechs gehen. Lasst uns einfach ein paar Sachen durchschrubben, die sich geändert haben. Also fünf und sechs sind Kopien voneinander mit einigen Editionen. Htimer sechs, wir haben unsere HCanvas, das ist großartig. Also, wir haben eine Leinwand da drin, Sie können auf den Zeilen 11 und 12 sehen, wir fügen die Leinwand zur Bühne, genau wie ich erwartet habe, AutoClear ist falsch und Josh hat ein Fade zu fünf gemacht. Also, wieder, es wird diese Animation verbrennen. Entschuldigung, ich mache nur eine wirklich schnelle Bearbeitung, weil ich merkte, dass ich etwas übersprungen habe und das ist Zeile 17. Zeile 17, wieder, ist eine neue Ergänzung, die in der vorherigen Datei von HTimer vier ist, sagten wir pool.AutoAddToStage, was bedeutete, dass die HRectangle-Assets wurden auf die Bühne hinzugefügt. Aber weil HTimer six tatsächlich eine HCanvas hat, schau dir die Bearbeitung in Zeile 17 an, sage ich: „Hey, pool.Autoparent in c1.“ Damit der Code geändert wird, weil wir die HRectangles nicht auf die Bühne bringen möchten, möchten wir sie tatsächlich innerhalb des Elternteils von c1 verschachtelt setzen. Okay, schnelles Bearbeiten, zurück zu dem, was ich als Nächstes gesagt habe. Anders als das, ist nicht viel anders, außer für Linie 35. Sieh dir das an. Wenn OnCreate also 100 eindeutige HRectangles erstellt, erstellt Zeile 35 eine eindeutige HRotate mit jedem einzelnen Asset. Also, was das bedeutet, ist, dass es jetzt 100 Rechtecke auf dem Bildschirm gibt, sie alle werden separat animiert, und sie haben ihre eigene einzigartige HRotate. Schau dir an, was ich hier gemacht habe, ich habe nur ein wenig zufällig gemacht. Ich sagte: „Hey, gib mir einen Bereich, von negativen zwei bis positiven zwei.“ Also, einige werden sich im Uhrzeigersinn drehen und einige werden gegen den Uhrzeigersinn drehen, aber das Drehen im Uhrzeigersinn und gegen den Uhrzeigersinn wird nicht mehr als positive zwei Grad oder negative zwei Grad gehen . Nun, kriegen wir ein paar Nullen? Ja, was bedeutet, dass sich einige der Vermögenswerte überhaupt nicht drehen. Das ist durchaus möglich. Testen Sie also die Skizze und schauen Sie sich an, was passiert. HTimer, alle 100 Millisekunden fordert ein neues HRectangle aus dem HDrawablePool. Es fügt das HRectangle an und fügt dann eine HRotate mit diesem Asset an. Eine Sache, die ich vergessen habe zu erwähnen, ist, lassen Sie mich das hier schließen, ich habe tatsächlich den Anker geändert. Ich habe das Negative 25 gesetzt, damit du das Kunstwerk hast. Der Drehpunkt geschieht also negativ 25 über dem HRectangle. Also, sieh dir das an. Wenn ich zum Beispiel das Intervall auf 1.000 ändere, wäre das jede Sekunde. Wenn ich die Skizze hier testen würde, würden Sie bemerken, dass es eins gibt, es zwei, drei, vier, fünf, sechs, sieben, acht, neun. Siehst du, es passiert im Tempo und es wird das tun, bis alle 100 Rechtecke aus dem Pool gemalt werden. Aber wieder, und das fängt an, auf den Abschnitt der Combos zu verweisen, was ist, oh mein Gott, der Timer führt die Elemente auf den Bildschirm, aber wie sie eingeführt werden, erstellen wir eine einzigartige HRotate mit jedem einzigartigen Asset. Also, diese animieren alle separat und sie bekommen ihre eigene einzigartige HRotate, was schön ist. Es ist eine schöne Akte. Nun, natürlich, werde ich tun, was ich getan habe in einigen dieser anderen kleinen Sneak Peek Szenarien, die auf HTimer 7 schauen. HTimer seven ist eine Kopie von HTimer sechs, aber ich konnte nicht anders, als diesen Hoscillator-Code einzufügen, und dieser Hoscillator-Code wird die Skala ändern. Also wieder, hier habe ich den Pool gewechselt. Ich befestige diesmal nur 50 Gegenstände statt 100. Die Rundung ist 40 auf diesem. Oszillator wird oszillierende Skala sein. Also wieder, wir werden Oszillator abdecken, ich werde das nicht zusammenbrechen, aber das Schöne daran ist, dass es oszillierend sein wird - HTimer wird ein einzigartiges Asset anbringen, das diesem einzigartigen Asset eine HRotate verleiht, und einen einzigartigen Hoscillator. Also verschwende ich nicht mehr Ihre Zeit hier. Führen Sie dies aus und jetzt erhalten wir die einzigartigen HROTates und wir erhalten auch die einzigartigen Hoscillatoren auf jedem der einzelnen 58 Rechtecke. es glauben oder nicht, Sie können diese Datei in Verbindung mit einer Datei öffnen , die Sie in der ersten Klasse gemacht haben, und glauben Sie es oder nicht jene Raster, die Sie mit HGridLayout erstellt haben, können Sie einen HRotate und einen Hoscillator einwerfen, und Ihre Raster beginnen zu animieren. Also, lassen Sie uns das HTimer-Zeug beenden, wir werden auf HrandomTrigger gehen. Aber ich würde sagen, an diesem Punkt, versuchen Sie, diese Datei zu stoppen und zu einigen dieser Arbeit zurückzugehen, die wir in der ersten Klasse gemacht haben, und ja, nehmen Sie diese Anfrage alle, setzen Sie einen Timer, um jedes Ihrer Assets ein hinzuzufügen, indem Sie Eins. Versuchen Sie, HRotate und Hoscillator zu kopieren und einzufügen , und beobachten Sie, wie Ihre Raster zum Leben erweckt werden. Okay, dieses Video ist fertig, ich sehe dich im nächsten, was HranDom Trigger ist. Wir sehen uns später. 17. Einheit 5, Video 3: Okay, dieses Video sollte nicht zu lang sein, denn es ist nur ein Update dessen, was wir bereits in HTimer behandelt haben. Also nochmals, um zu wiederholen, verwendet jeder Timer ein konsistentes Tempo, um Dinge zu schaffen. Also, Zufallsauslöser hilft uns nur, dieses wörtliche Tempo auszugleichen. Also, lasst uns voran gehen und schauen uns HrandomTrigger eins an, und wieder, es sollte sich sehr ähnlich dem Zeug anfühlen , das wir gerade mit Timer erstellt haben. Also, lasst uns das zusammenbrechen. Hier oben oben habe ich HrandomTrigger ist ein zufälliger Timer, und der Code vielleicht ein wenig anders strukturiert in dem Sinne, dass, wie wenn ich mich anschaue und der Code vielleicht ein wenig anders strukturiert in , lassen Sie mich für eine Sekunde Build vier hier hochziehen. Also, wenn Sie sich HTimer vier ansehen, hatten wir diesen Codeblock direkt hier, der eine Instanz des Timers erstellt und dann das Intervall und den Callback zur Verfügung stellte. Also, wenn wir uns HrandomTrigger ansehen, ist es wirklich nur ein Rückruf, und was ich möchte, dass wir uns jetzt anschauen, ist Zeile 14. Zeile 14 steht also: „Okay, ich möchte eine Instanz dieses HrandomTriggers erstellen, und ich werde Ihnen eine Zahl zur Verfügung stellen, die Zufall darstellt.“ Nun, bevor ich über Zufall spreche, wieder, Zeile 14 ist, wie ich das schreiben würde, weil ich lest eingeben will. Allerdings ist Zeile 15 tatsächlich die gleiche wie oben. Sie können sagen, in Ordnung, ich möchte einen neuen HranDOMTrigger erstellen und Sie könnten dann eine.chance verketten und dann die Chance Nummer innerhalb von dort präsentieren. Also, ich mag 14, weil es offensichtlich weniger tippt. Sehen wir uns jetzt den Zufall an. So muss der Zufall auf diese Weise beschrieben werden. IF/15, also im Wesentlichen, sage ich, dass es eine von 15 Chance gibt , dass der Zufallsauslöser ausgelöst wird. Also, eine großartige Analogie ist, dass, wenn man eine Reihe von Zahlen zerschneidet, null bis 14, sie in separate Stücke Papier zerschneidet und all diese Papierstücke in einen Hut legt, in diesen Hut geriet und eine Zahl packt, wenn es Null war, dann würde Callback ausgelöst. Wenn es nicht Null ist, dann geht das Stück Papier zurück in den Hut und Sie beginnen und erneut wählen zufällig von vorne. Da es also nur 15 Stück Papier gibt, haben Sie eine Chance, tatsächlich eine Null herauszuziehen. Wenn Sie eine Null herausziehen, dann die Zeilen 25 bis 31 , wird dieser Rückruf wahr zurückgeben und es wird feuern. Nun, wenn Sie sich Zeile 28 hier ansehen, ist es sehr ähnlich zu dem, was wir in HTimer gemacht haben, alles, was ich mache, ist die Position unseres R1h-Rechtecks neu zu positionieren, das zufällige Breite und zufällige Höhe irgendwo auf dem Bildschirm ist. Also, lassen Sie uns noch ein wenig über den Zufall reden, weil Sie vielleicht bemerken , dass wir dieses F eingeführt haben. Für den Zufallsauslöser, wenn Sie eine Chance angeben , müssen Sie diese Zahl als Float übergeben, also ist das, was da passiert, lege ich tatsächlich das nachfolgende F hinter die Zahl, so dass ich das Suffix von F übergebe, dem Compiler mitteilt, dass die Zahl, die hereinkommt, ein Float ist. Also wieder, ich habe eine von 15 Chance, gezogen zu werden. Nun, lassen Sie uns diese Skizze testen, und wieder, wir ändern nur die Position von r1, aber Sie könnten feststellen, dass die Bewegung unberechenbar ist. Ich mag das, denn wieder, HTimer wird uns immer dieses konsistente Tempo geben, und ich wollte etwas, das sich nicht anfühlt „Oh, hier gibt es einen Rhythmus, ich möchte diesen Rhythmus aufbrechen.“ Also wieder, es hat eine Chance von 15, gezogen zu werden, also wenn Sie nicht herausgefunden hätten, könnten Sie offensichtlich in einem F durch zwei geteilt passieren und das hätte eine 50-prozentige Chance, gezogen zu werden. Je größer du diese Zahl machst, desto langsamer wird deine zufällige Chance, tatsächlich zu schießen. Also einer von 15, Ich mag dieses nicht-wiederholende Muster und es hat ein schönes Gefühl, es. Also, anstatt eine Menge Dateien damit aufzubauen, wenn Sie sich HrandomTrigger zwei ansehen, ist es wirklich unsere HTimer sieben Datei. Es hat HCanvas, es hat unseren ColorPool, es hat einen DrawablePool, aber anstatt HTimer zu verwenden, haben wir HAnDOMTrigger. Wieder können Sie sehen, dass ich hier einen zufälligen Timer einfüge, eine Eins-in 30. Chance, erstellt zu werden, und wieder ist dies der Callback, der tatsächlich aus dem DrawablePool gezogen wird. Also wieder, Sie werden feststellen, dass die „Anfrage all“ nicht da ist, und genau hier auf den Zeilen 45 bis 51 ist mein zufälliger Timer, also hat es eine Chance, tatsächlich eine Poolback-Anfrage zu machen. Nun, ich sollte wahrscheinlich erwähnen, dass dies offensichtlich nicht wie HTimer sieben hat, wenn ich diese Datei öffne, werden Sie feststellen, dass es hier eine Zahl Zyklen gibt, also wissen wir, dass dieser Timer tatsächlich heruntergefahren wird, nachdem er erreicht hat, in in diesem Fall, 50 Objekte. Also, zufälliger Trigger hat dieses Argument nicht, also was passiert, ist, dass diese pool.request schließlich bis zu 50 wird und dann der Zufallsauslöser tatsächlich weiter feuert, aber es sagt: „Hey Pool, kann ich einen haben?“ Pool verweigert es nur, weil alle 50 Elemente auf dem Bildschirm erstellt wurden. Wenn ich das also noch einmal ausführe, ist es nur eine Möglichkeit, das Tempo dieser Animation zufällig zu staffeln. Wenn Sie tatsächlich HTimer sieben neben HrandomTrigger zwei ausführen, würden Sie feststellen, dass der Rhythmus der Animation tatsächlich gestaffelt ist, dass Sie in HTimer sieben bemerken würden, dass es einen konsistenten Rhythmus zu diesen Dingen gibt , die oszillieren auf dem Bildschirm, da sie in einem Tempo erstellt wurden. Während HrandomTrigger zwei, weil es zufällig Dinge auf dem Bildschirm aufruft, werden Sie tatsächlich feststellen, dass die allgemeine Ästhetik der Animation chaotischer erscheint als HTimer sieben tut. Also, das schließt diesen Abschnitt auf Timer, und natürlich ist dies ein perfekter Segway, um jedes Tween abzudecken und weiter in Callback zu tauchen , weil wir jetzt diese beiden Dinge verwenden möchten, um Dinge auf dem Bildschirm zu bewegen und sie zu haben bewegen sich in bestimmte Positionen und so weiter und so weiter. Dies schließt also diesen Abschnitt ein, sehen Sie in jedem Tween und jedem Callback. Wir sehen uns später. 18. Einführung in HTween und HCallback: Nach dem Abdecken von Timern macht es wahrscheinlich viel Sinn, in diesen nächsten Abschnitt zu wechseln , der HTWeen und HCallback ist. HTWeen bewegt im Grunde ein Objekt von einem Ort zu einem anderen, also von Punkt A nach Punkt B. Einige Argumente, die HTWeen verwendet, sind Ziel, wen bewegen wir uns? Eigentum, welche Art von Eigentum twittern wir? Wir können nicht nur zwischen einem Ort zu einem anderen Ort wechseln, sondern wir könnten zwischen Null Alpha und voller Alpha. Wir könnten zwischen 0 Rotation zu 360-Grad-Drehung wechseln. Wir können kleine Skala zu größerem Maßstab übereinander setzen. Also, HTWeen will wissen, mit welcher Eigenschaft wir tatsächlich tween. Wir haben Dinge wie Anfang und Ende; was ist die Startposition, was die Endposition ist. Gibt es Lockerung und Frühling? Wie wir in HFollow gesprochen haben. Ist das eine stetige Bewegung oder hat es irgendeine Art von Sprungkraft oder Elastizität? Nun, Sie werden in diesen ersten Beispielen sehen, HTween, wir werden etwas von Punkt A nach Punkt B verschieben. Aber wir möchten vielleicht über HCallback sprechen, jetzt ist HCallback etwas, das wir tatsächlich in der ersten Klasse geschrieben haben aber wir haben nicht viel darüber diskutiert. HCallback ist ein Weg für uns zu wissen, ob wir an unserem Ziel angekommen sind. Wenn ich zum Beispiel HTWeen verwende, um von Punkt A nach Punkt B zu wechseln, möchte ich vielleicht wissen, wann es an Punkt B angekommen ist, also verwenden wir HCallback in Verbindung mit HTWeens, so dass das Objekt von einem Ort zu einem neuen Standort, und sobald es an diesem Ort angekommen ist, wird HCallback sagen: „Hey, du bist an deinem Ziel angekommen.“ Nun, warum ist das wichtig? Denn in einer Mutationsdatei, die wir erstellen werden, wir HTWeen und HCallback verwenden, um im Grunde eine Schleife zu erstellen. Also, es werden wir von Punkt A nach Punkt B animieren, wenn es an Punkt B ankommt, wird HCallback uns wissen lassen, dass es an seinem Ziel angekommen ist , und dann werden wir es zurück zu A gehen. Also, wir gehen einfach von A nach B, B bis A, A bis B und kontinuierlich. Also HTWeen, sehr spannend, weil wir jetzt anfangen, Dinge auf dem Bildschirm zu bewegen. Aber noch einmal, denken Sie daran, dass Tweening nicht nur notwendigerweise Position ist. Wir werden alle möglichen Dinge wie Alpha, Skalierung und Rotation miteinander vermischen. 19. Einheit 6, Video 1: Wow! Okay, hier ist, wo es dunkle Sterne schwer werden wird. Es wird viel mehr Beispiele geben, und ich werde wahrscheinlich eine Menge dieser Dateien in eine Menge von separaten Videos aufteilen. Also, diese letzten paar Abschnitte, HTween, HSwarm, Hoscillator Combos, das ist, wo es schwer wird. Mann, ich hoffe, Sie genießen diesen Prozess, denn hier beginnt es ein paar wirklich schöne Ergebnisse zu produzieren. Wir sind in HTWeen. Nun bewegt sich HTWeen einfach von einem Zustand in einen anderen Zustand. Ich sollte wahrscheinlich vorschlagen, dass an dieses Video irgendwo die ZIP-Datei angehängt ist. Innerhalb dieser Zip-Datei werden Sie sehen, dass es 13 Beispiele gibt, und was schön ist, ist, wenn Sie sich Beispiel 5, 12 und 13 ansehen , habe ich ein 3D daran angehängt, weil wir tatsächlich anfangen werden, über das Verschieben von Dingen in drei Dimensionen. Also, Sie werden sehen, dass ich anfangen habe, einige der Dateien zu taggen , in denen ich einige wichtige Aspekte einführe. In diesem Video möchte ich Beispiel eins und Beispiel zwei abdecken, wir halten diese Videos einfach so süß wie möglich und versuchen, sie nicht 13 Minuten wie alle anderen Videos zu machen. HTWeen, es bewegt sich von einem Zustand in einen anderen Zustand, und ich benutze diese Sprache sehr speziell, weil es nicht notwendigerweise Ort bedeutet, von einer Position zu einer anderen Position zu bewegen. Im Falle dieser ersten Dateien werden wir von einer Position zu einer anderen Position bewegen, aber Tween kann Rotation sein, es kann Maßstab sein, es kann Alpha, et cetera sein. Also, lasst uns diese ersten beiden Dateien hier langsam zusammenbrechen. Also, oben oben, habe ich, wie erwartet, unser r1, unser hRectangle. Jetzt werde ich ein paar Sachen überspringen. Kommen wir zu den Zeilen 12 bis 18. Wieder, wir überprüfen nur hier. Wir haben ein Rechteck, das 100 mal 100 ist, Rundung von 10, wir fügen es zur Bühne hinzu, der Anker ist in der Mitte, Standort hat eine Variable von StartX. Wir werden in einer Sekunde darüber reden. Die Kunst hat keinen Strich, und es hat eine Füllung von diesem dunkelorangen ff3300. Jetzt gehen wir wieder nach oben. Da ich hier einige Sachen hinzugefügt habe, möchte ich im Grunde das Rechteck von Position A zu Position B animieren Also, wir werden das mit HTWeen tun. Also, oben oben, sehen Sie, ich habe Httween t1, Tween eins. Auf den Zeilen vier und fünf habe ich die StartX-Position, die eine x-Achse von 160 sein wird, und ich habe die EndX-Position. Ich möchte, dass es auf 480 Pixel auf dem Bildschirm animiert wird, also Startposition, Endposition. Nun macht Zeile 15 wahrscheinlich ein wenig Sinn, weil Sie sagen: „Heym Ich möchte die Ausgangsposition dieses Rechtecks festlegen“, das eine x-Achse von 160 ist, StartX, und eine y-Achse von, setzen Sie mich einfach in die Mitte des Bildschirms, Höhe geteilt durch zwei. Bevor ich über das Tween spreche, kommen wir hier zur Draw-Funktion und genau wie in den Rotationsbeispielen habe ich ein wenig Verarbeitungscode eingefügt, damit ich die beiden Punkte sehen konnte. Also, Sie können hier sehen ich sagte, keine Füllung, Strichgewicht ist zwei, der Strich ist eine blaugrün Farbe und ich habe zwei Ellipsen erstellt, und die Ellipsen sind, StartX, Höhe geteilt durch zwei, EndX, Höhe geteilt durch zwei. Also habe ich zwei kleine Punkte, die mir visuell zeigen, wo die Startposition ist und wo die Endposition ist. Jetzt reden wir über das Tween. Also sage ich: „Okay, t1, tween eins, du musst etwas wissen“, und die ersten beiden sind offensichtlich die wichtigsten. Sie sind, wer ist das Ziel und was ist das Eigentum? Also, Ziel ist r1, was unser hRect ist. Wir sagen, hRect ist der Vorteil, den wir bewegen wollen, und sein Sprichwort: „Okay, was ist das Eigentum?“ Wieder, wenn Sie sich den Code hier ansehen, könnte ich den in seiner eigenen separaten Zeile haben, könnten Sie ihn auf diese Weise ausbrechen. Normalerweise lege ich diese beiden direkt hintereinander, damit ich sehen kann , wer die Handlung bekommt und was die Eigenschaft der Aktion ist. In diesem Fall, h.Location, also Josh bewegt Sachen von einer Position in eine andere Position, aber diese Eigenschaft könnte h.alpha, h.scale, h.Rotate, Konstanten usw. sein. Wir werden es von „Ja, du weißt nicht, dass wir es jetzt bewegen?“ Heiliger Mist! Manchmal bewegt sich mein Mund schneller als mein Gehirn, und ich arbeite das durch arbeite durch dieses Problem. Hallo, die Eigenschaften Lage, ich werde es von einer Position in eine andere Position verschieben. Kann ich einen Hallelujah kriegen? In Ordnung. Schauen wir uns die nächste Eigenschaft hier an, .start. Nun, ich denke, wenn man sich die htween.pde anschaut, wird Start und Ende immer eine x-, y- oder z-Position sein . Also, in diesem Fall ist der.start StartX. Also, diese x-Achse von 160, und diese Endposition wird Höhe geteilt durch zwei sein. Unsere Endposition wird endX und Höhe geteilt durch zwei sein, und wieder, Sie werden hier in Zeile 26 bemerken, ich habe nur Leichtigkeit angegeben, die 0,05 ist. Nun, wenn ich diese Skizze teste, schauen wir uns an, was passiert. Wieder, das wird sofort feuern. Also, ich gehe voran und führe das und sehr schnell, du solltest sehen, Boom, es bewegte sich von Punkt A nach Punkt B und dann stoppte. Ich habe nicht angegeben, dass es etwas anderes macht, also findet die Aktion sofort statt. Also, wieder, Sie sollten bemerken, dass es von dieser ersten Position zu dieser zweiten Position bewegt und es in diese Position gelockert. Also, bauen Sie zwei, das einzige, was ich in Build 2 gemacht habe , ist nur gezeigt, dass in Beispiel zwei, dass Sie Elastizität hinzufügen können, genau wie wir es in einigen der vorherigen Dateien getan haben. Also, in diesem Fall habe ich gesagt, dass die Leichtigkeit 0,05 ist und dass die Feder elastisch ist, also ist es 0,95. Also, wenn Sie diese spezielle Skizze testen, sollten Sie feststellen, dass es Gummibänder in Position. Also, wenn Sie dies testen, wird es sofort anfangen zu gehen und es Gummibänder in diese endgültige Position. Lassen Sie uns versuchen, diese kurz zu halten, ich werde versuchen, meinen Mund synchron mit meinem Gehirn zu arbeiten, und ich werde Sie im nächsten Video sehen. 20. Einheit 6, Video 2: Ok. In diesem Video werden wir Beispiele drei und vier abdecken. Für dieses Beispiel dreimöchte ich hier wirklich die gesamte Struktur durchlaufen, möchte ich hier wirklich die gesamte Struktur durchlaufen weil ich jetzt HTWeen in Verbindung mit Callbacks verwenden werde , um unser Asset von Position A in Position B zu verschieben und dann, wenn es angekommen ist an Position B, möchte ich es wieder in Position A verschieben und dann diese Schleife starten. So wird es von A nach B, B nach A, A nach B so weiter und so weiter gehen. Okay, also lassen Sie uns etwas Zeit nehmen, um diesen Code zu durchlaufen und einfach alles zusammenzureißen. Also, oben oben haben wir unsere r1 und wir haben unsere t1, richtig? Also haben wir unser Rechteck und wir haben unser anfängliches Tween und das Tween wird dieses Rechteck auf dem Bildschirm bewegen. Jetzt habe ich, in Zeile 3 hier, HCallback und hier ist, wo ich wirklich sicherstellen möchte , dass jeder versteht, was hier passiert. Nun, lassen Sie uns nicht vergessen, dass, wenn Sie diesen Film testen, das Tween initiiert und so wird es von A nach B bewegen Was ich passieren möchte, ist Callback, um unsere Schleife zu starten. Also wissen wir, dass in dem Moment, in dem der Film beginnt, er bereits von A nach B initiiert wird also sieh dir meine Callbacks hier an. Ich habe TweendOne1 und TweendOne2. Jetzt, nur konzeptionell, starten Sie den Film, bewegt sich von A nach B. Also, was ich möchte, dass TweendOne1 tun soll, ist, mich wissen zu lassen , dass er bei B angekommen ist und ich möchte es zurück nach A verschieben also TweendOne1 wird die Animation von B sein Dann offensichtlich, wenn es von B nach A geht, möchte ich, dass TweendOne2 mir sagt, hey, du bist wieder bei A angekommen, lass uns jetzt zurück zu B gehen also TweendOne2 geht von A nach B. zu A. Dann offensichtlich, wenn es von B nach A geht, möchte ich,dass TweendOne2 mir sagt, hey,du bist wieder bei A angekommen, lass uns jetzt zurück zu B gehen, also TweendOne2 geht von A nach B. Gehen wir zum nächsten Zeug hier. Josh liebt Pvectors. Ich liebe Pvectors. Pvectors sind ein Weg für uns, eine Position im Weltraum zu verpacken. So kann ein Pvector zweidimensional sein oder dreidimensional sein. In diesem Fall ist es ein zweidimensionaler Punkt. Zweidimensional nur ein X-Punkt und ein Y-Punkt. Aber Pvectors können auch ein xy und ein z sein. Also, was besserer Weg, um einzurichten sind unser Punkt A und unser Punkt B, als einen PVector zu verwenden. Das ist also eine Änderung von Beispiel eins und zwei. Also, ich habe gesagt, okay lassen Sie mich kurz, bevor ich darüber nachdenke, muss ich mich daran erinnern, dass meine Größe 640 mal 640 ist. Also, weil ich nur das x bewege, muss ich daran denken, dass die Y-Achse Höhe geteilt durch 2 war, aber Höhe geteilt durch 2, 640 geteilt durch 2, 320 ist. Also, wenn Sie hier schauen, für meinen Pvector sagte ich, hey Ihr erster Punkt ist 160 auf der X-Achse und 320 auf der Y-Achse, und die richtige Position ist 480 auf der X-Achse und 320 auf der Y-Achse. Also wieder, ich liebe Pvectors. Sie sind nur eine wirklich gute Möglichkeit, Punkte im Weltraum zu packen. Also sieh es dir an, unser r1, unser hRect. Wieder ist es eine 100 mal 100. Es hat eine Rundung von zehn. H.Fügen Sie hinzu, wir fügen es der Bühne hinzu. Unser AnchoRat ist die Mittelposition, aber schauen Sie sich das Update auf 16. Also, auf 16 kann ich sagen, hey Ihre Ausgangsposition, diese erste Position, ist zu diesem Pvector gehen und mir das x geben, also pt1.x, das offensichtlich 160 zurückgibt. Die pt1.y gibt die 320 zurück. Also benutze ich, auf Linie 16, den PvECtor, um die X-Achse und die Y-Achse zu greifen. Wieder hat es NoStroke und es ist eine Füllung von dunkelorange. Ok. Ich werde hier ein bisschen nach unten scrollen. Ich werde den ganzen Weg nach unten springen und nur zeigen, dass die Auslosung genau so ist, wie es im Beispiel eins und zwei war , wo es Draw-Phase macht und wir diese zwei kleinen Ellipsenpunkte erstellen und verarbeiten , so dass wir Punkt A und Punkt B. Okay. Atmen Sie tief durch, arbeiten Sie hier mit mir. Ok. Sehen Sie sich die Linien 21 bis 29 an. Dies ist das Tween und erinnern Sie sich noch einmal, das Tween beginnt sofort. Es wird sich von Punkt A nach Punkt B bewegen. Also, wenn wir hier schauen, sagen wir, t1 ist ein neues HTWeen, wieder das Ziel ist unser r1 hRect, die Eigenschaft ist Standort. Hey, sieh dir die Start- und End-Argumente hier an. Der Start beginnt bei pt1.x, beginnt bei pt.1.y, endet bei pt2.x und endet bei pt2.y. Wieder, unsere Leichtigkeit ist 0,5 Und haben ein wenig Frühling, aber ich habe die Elastizität ein wenig gesenkt, also anstelle von 0,95 wie es in eins und zwei ist, bringe ich es auf 0,7 herunter. Ok. Wenn der Film diese Brände startet, schauen Sie. Gehe, beginne Tween von links nach rechts. Also, wenn ich keinen anderen Code hier eingeschrieben hätte, würde er sich von Position A Position B bewegen . Nun brauche ich einen Rückruf, um zu wissen, dass ich an Position B angekommen bin. Wenn Sie sich daran erinnern, dass dies TweendOne1 ist, also ist es an der richtigen Position angekommen. Gehen wir zurück nach links. Also, sieh es dir an. Ich sage TweendOne1 ist ein neuer Callback, und was ich hier sage, ist hey tween eins, ich verstehe, dass Sie an der B-Position angekommen sind, die zweite Position ganz nach rechts. Wenn Sie an der B-Position angekommen sind, möchte ich, dass Sie etwas anderes feuern. Es ist immer noch das gleiche Tween, aber ich werde Ihnen einige neue Informationen geben und die neue Information ist ein neuer.start in einem neuen.end. Also, jetzt heißt es, gut dein Anfang. Wenn ich recht habe, ist die richtige Position, die du jetzt hier drüben bist. Ok. Also, der Start ist pt2.x und pt2.y und die Endposition ist wieder am Anfang. Zurück zu pt1.x und pt1.y. Sehen Sie sich diesen nächsten Codeblock hier an. Hier erstellen Sie den Link, und der Link ist, ich möchte dieses Tween registrieren und ich möchte einen neuen Callback, wenn ich an die neue Position zurückkomme. Es beginnt also bei diesem pt2 Pvector, es wird am pt1 Pvector enden und wenn es wieder bei pt1 ankommt, haben wir plötzlich einige Informationen hier hinzugefügt. Oh mein Gott, die Programmierung will wissen, wann ich wieder an diesem Ort angekommen bin. Was für ein neuer Rückruf zu feuern. Also, wenn es in die Ausgangsposition zurückgeht, wird es den Callback TweendOne2 auslösen. In Ordnung. Also hier ist der Link. Wenn wir also jetzt Code 43 bis 53 betrachten, richten wir einfach die Animation von A zurück nach B ein. Richtig. Also, wenn Sie es betrachten, sobald es wieder an der linken Position angekommen ist, möchte ich jetzt wieder nach rechts gehen, also erschaffe ich eine Schleife, die wie ein Augapfel eines Zylonen hin und her geht. Du musst ein Super-Nerd sein, um das wirklich zu schätzen. Ich habe gerade einen zylonischen Kommentar in diese Diskussion geworfen. Es ist die Liebe, es ist die Liebe, die wir teilen. Ok. Also, TweendOne2, schau es dir an. Ich habe gerade den Anfang und das Ende wieder umgekehrt. Ich sage, oh Mist, wir sind wieder links, richtig? Der Anfang ist also unsere pt1.x und y, und ja, wir wollen zurück zur B-Position gehen, die ein pt2.x und y ist. Dann ist hier die Endlosschleife. Ich sage, rate was, wenn ich dies registriere und sobald Sie an dieser neuen Endposition ankommen , gehen Sie voran und feuern TweendOne1. Also, jetzt an diesem Punkt, sollten Sie erkennen, dass diese beiden sich nur wieder hin und her rufen. Also, wenn man fertig ist, ruft es zwei auf, wenn zwei fertig sind, ruft es einfach wieder eins auf. Also, jetzt funktionieren diese Dinger im Tandem. Nun, Sie bekommen, dass eine zwei feuert, und zwei feuert eins, aber überprüfen Sie Zeile 55. Wenn ich das nicht hatte, wenn ich das auskommentiere, was wird dann dann passieren? Nun, sieh dir das an. Ich werde meine Skizze ausführen und der Film beginnt und Boom geht es von Position A zu Position B, denn denken Sie daran, ich werde nur diese hier für eine Sekunde schließen, denken Sie daran, dass, wenn Sie Ihren Film t1 testen geht. Es fängt an, es läuft, es bewegt sich von Position A zu Position B. Also jetzt, hoffentlich, verstehen Sie, dass TweendOne1 und TweendOne2 eingerichtet sind, aber wir bringen nie Dinge ins Rollen, richtig? Also, jetzt schauen Sie sich Zeile 55. In Zeile 55 hier und ganz unten sage ich einfach, hey, nachdem ich diese beiden Szenarien eingerichtet habe, möchte ich nur Tween 1 sagen, dass es sich registrieren und zurückrufen sollte, einmal Callback TweendOne1 und dann startet das die Loop.Okay. Wenn ich das nicht hatte, ging es einfach von A nach B, weil wir es nie gebeten haben , uns zu sagen, wenn es bei B angekommen ist, dannlass es mich wissen, wenn du bei B angekommen bist, weil ich dir sagen will, dass lass es mich wissen, wenn du bei B angekommen bist du etwas tun sollst. In Ordnung. Also ist die Zeile 55, die es startet, sie bewegt sich von A, es geht zu B. Sobald es zu B kommt, sagen wir es, dass es weitergeht und den TweendOne1 starten soll, dann zwei feuert, die dann einen feuert, der dann zwei feuert, die dann zwei, die dann feuert 1 so weiter und so weiter. So. Jetzt können Sie diese Skizze ausführen und wir haben jetzt eine unendliche Animation, wo sie von A nach B geht sobald sie bei B ankommt, geht zurück zu A, und so weiter und so weiter. Ok. Also, hoffentlich, haben Sie wirklich verdaut, wie wir Callback verwenden, um diesen endlosen Trigger zu erstellen, aber der Trigger wird nur ausgelöst, der Callback wird nur ausgelöst, wenn er sich in seinem Ziel niedergelassen hat, und in diesem Fall das Ziel ist eine x-Position, ein Ort. Ok. Lassen Sie uns das schließen. Lassen Sie uns zu Beispiel 4 gehen. Der Grund, warum ich auf Beispiel 4 gehen möchte, ist, weil ich eine leichte Anpassung vornehmen wollte und diese Anpassung in Beispiel 3 ist, das einzige, was wir wirklich geändert haben, war, wo ich beginne und wo beende ich. Was passiert ist, ist in Beispiel 3, ich gehe nur zurück zu ihm hier für eine Sekunde, wir spezifizierten diese Leichtigkeit und die Feder, die 0,05 und 0,7 ist. Aber du wirst feststellen, dass wir in TweendOne1 und TweendOne2 keine Leichtigkeit oder Feder angeben. Da wir nicht damit reden, wird nur das wiederverwertet, was ursprünglich festgelegt wurde. Ok. Also, ich wollte nur die Möglichkeit in vier zeigen, dass dies das ist, was anfänglich eingestellt wird, aber dann können Sie es tatsächlich ändern. Also, schauen wir uns TweendOne1 an, der von B zurück nach A bewegt. Was ich getan habe, war, dass ich die Leichtigkeit und den Frühling geändert habe. Ich sagte, hey behalte das 0.05, aber kannst du mir die Elastizität von 0.95 geben. Also, wenn es von B nach A geht, wird es sehr elastisch sein, aber sobald TweendOne2 feuert, schau es dir an. Ich änderte die Leichtigkeit und die Feder auf 0,05 für die Leichtigkeit, aber nicht jede Feder zu tun. Also wird es nur eine langsame Animation zurück sein und dann wird es springen, und dann eine langsame Animation zurück, und dann wird es springen. Also, gehen wir weiter und führen Sie die Skizze, und wieder, Sie sollten bemerken, dass es springt von B nach A, dann ist es eine langsame Bewegung zurück, und dann springt es zurück zu A. So können Sie das Tween zwischen Ihren verschiedenen Callbacks. Also, das ist stelllar. Das ist großartig. Ok. Ich werde dieses spezielle Video einschließen und im nächsten werden wir nur Beispiel 5 verdauen, das die Verwendung von 3D-Koordinaten anstelle zweidimensionaler Koordinaten einführt . Wir sehen uns im nächsten Video. 21. Einheit 6, Video 3: Ok. Dies ist das Video zum Beispiel fünf 3D. Es ist sehr ähnlich wie Beispiel vier, aber ich wollte nur eine sehr kleine Einführung in die Arbeit mit 3D-Koordinaten machen. Auch hier wird dieses Video nur dieses Beispiel sein. Also, lasst uns das einfach süß halten. Sieh es dir an. Hier ist, was anders ist, wieder, wie ich bereits erklärt habe, ein Pvector kann ein 2D-Punkt sein oder es kann ein dreidimensionaler Punkt sein. Also, in dem Fall hier, habe ich eine Z-Koordinate zu unserem Pvector hinzugefügt. Anstatt also von einer Position in eine andere Position zu bewegen, von links nach rechts, möchte ich etwas zurück und vorwärts bewegen. Also, schauen wir uns den Pvector an. Sowohl pt1 als auch pt2 haben die gleichen x- und y-Koordinaten. Also, es wird die Mitte des Bildschirms sein, 320 für die x, 320 für die y, die 640 geteilt durch zwei, oder Breite geteilt durch zwei, und Höhe geteilt durch zwei. Also wissen wir, dass das Quadrat in der Mitte des Bildschirms sein wird. Was hier anders ist, ist die Z-Koordinate, die wiederum Null für die z-Ebene ist, für die hintere Position, sage ich, negativ 400, und für die Front ist positiv 100. Also, die Änderung hier für den Pvector macht x und y beide 320, und ändert die Z-Koordinate. Also, negativ 400 für die erste Position und positive 100 für die vordere Position. Schauen wir uns Zeile 16 an. Der Startort ist x, y und z. Also, du sprichst mit diesem Pvector und bekommst das x, das y bekommen und das z bekommen. Gehen wir weiter und scrollen wir hier nach unten und schauen wir uns das Tween an. Auch hier habe ich die Start- und Endposition aktualisiert, um diese Koordinaten x, y und z einzuschließen. Nun, eine andere Sache, die ich völlig vergessen habe, habe ich ein Backup bekommen, weil dies muy importante ist, was Sie brauchen, um die Verarbeitung zu sagen, dass Sie 3D verwenden Koordinaten, und ich muss Hype sagen, dass ich 3D-Koordinaten verwende. Sehen Sie sich Zeile neun hier an. Auf Zeile neun habe ich gesagt, dass die Breite und Höhe des Films 640 mal 640 ist und dass ich P3D verwenden möchte. Also, ich möchte das 3D-Koordinatensystem der Verarbeitung verwenden. Wenn ich das nicht angegeben habe, wird der p-Vektor ein Problem damit haben, dass Sie versuchen, die Z-Koordinate anzugeben, da Sie nicht angegeben haben, dass der Renderer für die Verarbeitung überhaupt ein 3D-Koordinatensystem sein sollte. Also, es wird ein paar Fehler werfen. Nun denkt der gesamte anfängliche Code in Hype standardmäßig, dass Sie zweidimensionale Koordinaten ausführen. Also, ich muss Hype sagen , dass wir tatsächlich auch zu einem 3D-Koordinatensystem wechseln. Also, wenn Sie hier in Zeile 10 schauen, muss ich dieses Argument sagen, verwenden Sie 3D wahr. Also sage ich Hype: „Hey, wenn Sie beginnen, Ihre Klassen zu durchlaufen, gehen Sie zu den Methoden, die die z-Achse enthalten, anderen Worten wird es auch Fehler zurückgeben. Hype wird sagen: „Hey, Mann, was macht das z Geschäft, von dem du redest?“ Also muss ich Processing sagen, dass ich ein 3D-Koordinatensystem verwende und Hype mitteilen muss, dass ich ein 3D-Koordinatensystem verwende. - Sehr wichtig. kann nicht glauben, dass ich fast vergessen habe, darüber zu reden. In Ordnung. Abgesehen davon, dass dein TweendOne1 und dein TweendOne2, das wirkliche einzige Update hier ist, dass du Startenden diese Z-Koordinate aus dem Pvector verwendest. Auch hier habe ich einige Einstellungen für Leichtigkeit im Frühjahr. Nun, in meiner Akte, habe ich Zeile 62 für eine Sekunde kommentiert. Weil ich Ihnen nur zeigen wollte, dass, wenn Sie diese Skizze hier testen, tatsächlich die z-Achse dieses Rechtecks zurück im Raum und vorwärts im Raum bewegt. Als ich jedoch dieses Beispiel zum ersten Mal schrieb, dachte ich, woher weißt du, dass das eine Z-Animation ist? Wie sieht sich das jemand an? Wie konnte das skaliert werden? Ich habe keine Ahnung, dass das tatsächlich z ist, das nur den Maßstab des Rechtecks von einer kleineren Skala in einen größeren Maßstab ändern könnte . Also, ich habe diese Zeile 62 hinzugefügt, und lassen Sie mich einfach hier auskommentieren. Zeile 62 beschäftigt sich nur mit der Kamerafunktion von Processing, die ich den MouseX hinzugefügt habe, so dass Sie tatsächlich Ihre Maus bewegen und nur eine Darstellung erhalten, dass sich dieses Ding tatsächlich im dreidimensionalen Raum bewegt. Also, ich werde nicht lügen, die Arbeit mit der Kamera ist verrückt. Ich brauchte einige Zeit, um all die verschiedenen Argumente herauszufinden, die Kamera unterstützt. Wenn Sie Ihre Skizze jetzt ausführen, sollten Sie feststellen, dass, ja, es ist tatsächlich, dass es die Skizze im dreidimensionalen Raum bewegt. Also, wenn ich tatsächlich meine Mausposition hier schiebe, kann ich tatsächlich den Kamerawinkel ändern und tatsächlich sehen, dass sich unser Rechteck tatsächlich im dreidimensionalen Raum bewegt. Also, großartig. Ich denke, ich werde jetzt Beispiel fünf einpacken. Wir werden zum nächsten Video gehen, das Beispiel sechs und Beispiel sieben verdauen wird , und dann werden wir schließlich wieder mit 3D spielen, weil es ziemlich Spaß macht. Aber dies ist nur eine sehr schnelle Einführung in die Verwendung von 3D-Koordinaten mit Pvector, aber wieder, sehen Sie sich wirklich die Linien neun und 10. Sie müssen Processing mitteilen, dass Sie ein 3D-Koordinatensystem verwenden, Sie müssen Hype sagen, dass Sie das 3D-Koordinatensystem verwenden, anderen Worten, es ist nicht funktionsfähig. Wir sehen uns im nächsten Video. 22. Einheit 6, Video 4: Wie halten sich alle zusammen? Ich werde dich nicht zuversichtlich fühlen, weil es schlimmer wird. Es wird nur noch schlimmer, aber auf eine großartige Art und Weise. Es wird schmerzhaft in einer sehr angenehmen Art und Weise sein. Wir sind jetzt in Beispiel sechs und Beispiel sieben. In diesem Video werde ich durch diese beiden Dinge gehen. Nun, in Beispiel sechs, was ich Ihnen zeigen wollte, ist Verhaltensstapeln. Ich kann tatsächlich zwei Tweens aufrufen , die zu einzelnen Eigenschaften tween werden. Solange die Eigenschaften getrennt sind, sie sich nicht gegenseitig bekämpfen. Also, lasst uns hier nach oben gehen und schauen, was geändert wurde. Also, das ist, worüber ich spreche, wir beginnen mit einer einfachen Animation und wir werden sie einfach mutieren, sie etwas komplexer machen. Nun, dies wird nicht mit 3D. Wir gehen tatsächlich zurück zu Beispiel vier und fügen zu Beispiel vier hinzu. Nun, Beispiel vier ist, dass A nach B, B zu A Schleife. Es hat gerade die X-Position bewegt, hin und her. Ich möchte, dass es jetzt auch rotiert. Es wird also von Position A nach B verschoben, aber es wird auch eine Rotation ausführen. Also, lasst uns hier nach oben gehen und einige Anpassungen sehen. Also, die erste Sache ist, wir bewegen immer noch einen hRect, wir haben immer noch unsere r1, aber ich habe jetzt ein Tween eins und ein Tween zwei. Also, ein t1 und ein t2. Wir wissen, dass t1 die Position tween ist, und t2 wird die Rotation Tween sein. Also brauche ich jetzt einen neuen Satz von Callbacks. Also, Sie werden in Zeile drei bemerken, wir werden unsere TweendOne1 und unsere TweendOne2 behalten, aber ich habe jetzt den Callback für, RotatedOne1 und RotatedOne2 hinzugefügt. Also, wir wissen, dass, wenn dies beginnt, es wird eine Rotation von A nach B initiieren, Datum drehen, drehen, Datum drehen, Ihre Daten drehen, alle Ihre Daten drehen. Heiraten Sie nie, drehen Sie Ihre Daten. Sie haben es hier gehört, von Josh Davis. Ich werde wieder gesund werden. Versuchen wir es nochmal. Drehen. Darf ich Ihnen sagen, dass in der Vergangenheit, als ich an der School of Visual Arts unterrichtete, es war wie 2003, als ich anfing zu unterrichten. Die Leute würden ihre Dateien auf Zip-Disketten einbringen. Zip Disks Du musst wirklich vorsichtig mit dem hier sein. Ich hatte mehr als ein paar Slip-ups. Ich lasse dich das einfach ausarbeiten. Jeder Callback, RotatedOne1 und RotatedOne2. So rotiert RotatedOne1 von B zurück nach A, genau wie TweendOne1, und RotatedOne2 ist wieder A zurück zu B. Jetzt habe ich den P-Vektor dort eingefügt. Sie werden also feststellen, dass pt1 und pt2 160.320, 480,320 ist , das nicht geändert wurde. Schauen wir uns an, was wir hier haben. Hier ist unser r1. Da der Code ein wenig länger wird, nutze ich die Methodenverkettung und HYPE. Also, ich kann das alles einfach in eine Zeile einreihen. Also, wie ich beginne, mehr Code zu schreiben, und meine Programme beginnen, ein wenig robuster zu werden, nutze ich die Methodenverkettung und habe alles nur in einer Zeile heraus anstatt es in mehrere Zeilen zu brechen wie ich es in früheren Dateien getan habe. Ich mache dasselbe mit unserem t1. Nun, gehen wir weiter und schauen uns diesen Codeblock genau hier an, der 17 bis 31 ist. Das ist unverändert geblieben. Das heißt, zwischen Eins einzurichten, von A nach B, B nach A, die Callbacks, alles zu bewegen . Das ist genau so, wie es in Beispiel vier war. Was jetzt neu ist, sind die Drehen Tweens. Also, was ich hier getan habe, ist, ich habe gesagt, t2 ist ein neues HTWeen. Es wird auch auf r1 ausgerichtet sein, aber die Eigenschaft ist Rotation. Also, t1 beschäftigt sich mit der Lage, t2 beschäftigt sich mit der Rotation. Schau dir den Anfang an an. Beginnen Sie bei Null, enden Sie bei 180 Grad. Also, drehen Sie 180 Grad. Ich habe eine Leichtigkeit und ich habe eine Feder für diese Rotation. Auch hier habe ich einige Callbacks. Also, wenn Drehen eins fertig ist, wird es von 180 zurück auf Null gehen. Wenn es zurück auf Null ist, ruft man zwei. Zwei dann sagt: „Oh, lassen Sie uns diese Schleife erstellen. Gehen wir wieder von Null zurück auf 180.“ Wenn es bei 180 ist, feuert einer zwei. Also, nicht anders als rt1 Setup. Es ist eine Kopie. Sieh dir Zeile 50 an. Ich registriere t2 und sage: „Hey, ich verstehe, dass du von Null auf 180 feuern wirst, sobald du 180 bist , geh weiter und feuere das RotatedOne1 ab, damit du eins, zwei und zwei zu eins gehen und diese Schleife starten kannst .“ Also, wenn ich die Skizze teste, sollten Sie feststellen, dass ich zwei Tweens habe, die im Tandem arbeiten. Sie machen verschiedene Eigenschaften. Sie können so Htweens haben, wie Sie wollen, solange sie nicht versuchen, die gleiche Eigenschaft zu feuern. Also, t1 macht Position und t2 macht Rotation. Auch hier kann ich mehrere Htweens stapeln, solange sie verschiedene Eigenschaften adressieren. Lassen Sie uns dies schließen und gehen Sie zu Beispiel sieben. Nun, Beispiel sieben ist eine Kopie von Beispiel sechs. Aber, erinnerst du dich noch einmal in Hrotation, ich zeigte, dass du ein Quadrat in ein anderes Quadrat nisten könntest, und solange das passierte, war alles in Ordnung mit dem Universum. Das werde ich dir nur noch ein Mal zeigen. Also, sieh es oben oben an. Das einzige, was in Beispiel sieben anders ist, ist, dass ich jetzt drei Rechtecke habe. Ich habe einen r1, einen r2 und einen r3. Gehen wir weiter und schauen uns die Linien 14 bis 21 an. Ich sage: „R1, du bist 100 mal 100, und du bist ein dunkles Orange.“ Dann sage ich: „Hey, r2, du bist 50 mal 50, du hast eine Rundung von fünf, und ich möchte dich hinzufügen, r2, innerhalb von r1.“ Also haben wir jetzt mit der Verschachtelung begonnen. Sie werden feststellen, dass ich auch keinen Ort angeben kann. Wenn ich den Standort nicht spezifiziere, hängt er sich einfach bei Null, Null an. Gehen Sie weiter und schauen Sie sich r3 an. R3 ist 25 Pixel mal 25 Pixel. Es ist ein perfekter Platz. Es hat überhaupt keine Rundung, und r1 ist, wo ich r3 platziere. Also, r3 wird innerhalb von r1 platziert. Abgesehen davon hat sich nichts anderes geändert. Also, wenn Sie diese Datei tatsächlich ausführen, werden Sie feststellen, dass die Animation immer noch von A nach B und B nach A geht und immer noch dieses zweite Tween mit Rotation ausgeführt wird. Aber, wie Sie sehen können, tut es es für alle drei Objekte, weil alles auf r1 angewendet wird, es passiert einfach so, dass r2 und r3 innerhalb von r1 verschachtelt sind. Da diese beiden Formen innerhalb von r1 verschachtelt sind, erhalten auch sie die gleichen Animationen. Also, jetzt solltest du denken : „Oh mein Gott, ich kann in Illustrator arbeiten. Ich kann anfangen, eine Reihe von Vermögenswerten, visuelle Assets zu zeichnen. Ich kann sie gruppieren. Ich kann anfangen, viele verschiedene Dinge zu machen, und solange sie in einem Asset verschachtelt werden, mit dem die Tweens verbunden werden, wird dieses Kunstwerk einfach mit mir kommen.“ Also, cool. zeige Ihnen nur einige der Möglichkeiten dieser Tricks, die ich in HYPE verwende. Dies endet Beispiel sechs und sieben. Lassen Sie uns voran gehen und schließen Sie dies, und das nächste Video wird sich nur mit Beispiel acht beschäftigen. Wir sehen uns in der nächsten Datei. 23. Einheit 6, Video 5: Spaß. Wir sind jetzt in einem Beispiel acht, und wieder möchte ich diese Ideen einfach weiter nehmen, diese Konzepte weiter nehmen und sie einfach ein wenig mehr und robuster machen. Also, großartig. Beispiel acht wird eine Animation an vier verschiedenen Positionen zeigen. Also, es ist eine ziemlich gute Erweiterung von einigen der anderen Dateien, die wir dort gemacht haben, wo es gerade von A-B ging. Was ist, wenn wir von A nach B nach C nach D gehen und dann wieder nach A zurückkehren? Also wieder, dies wird unser Rechteck zu vier verschiedenen Positionen auf dem Bildschirm animieren, und es wird eine Schleife einrichten. Also, großartig, ich mache jetzt vier Punkte. Also oben am Beispiel acht haben wir Pvector eins, zwei, drei und vier. Sie werden feststellen, dass ich hier einige Kommentare habe, dass ich zuerst die obere linke, dann die obere rechte, dann die untere rechte, dann die untere rechte, dann die untere linke. Also, wenn Sie darüber nachdenken, in Bezug auf die Animation wird man zu zwei gehen, zwei gehen zu drei, drei gehen zu vier, vier gehen zurück zu eins. Also, das würde bedeuten, dass ich vier Callbacks cb1, cb2, cb3 und cb4 brauche . Denken Sie hier noch einmal daran, dass cb1 ein Rückruf ist, von Position eins zu Position zwei zu gehen, cb2 geht von zwei zu drei, cb3 geht von drei auf vier und cb4 geht vier zurück zu eins, und dann werden wir Erstellen Sie hier eine Schleife. Also hat sich das HRectangle wirklich nicht viel geändert, es wird an dieser ersten pt1-Koordinate pt1.x und pt1.y angehängt. Nun Zeile 19, das wird Feuer, und es wird von der Startposition des Pvector eins auf Pvector zwei Position schießen. Wenn das anfänglich startet, geht es von Position eins zu Position zwei, also wissen Sie, dass es nach dem anfänglichen Start tatsächlich in den beiden Positionen hängt. Jetzt werde ich hier nach unten scrollen, schau, ich habe die Ziehung so aktualisiert, dass sie vor verschiedenen Positionen für unseren Pvector enthalten , damit wir sehen können, wo sie auf dem Bildschirm sind. Schauen wir uns die Zeile 45 an. Zeile 45 wird davon ausgegangen, dass das Tween bereits von links oben nach rechts verschoben wurde. Also, wir sind jetzt in der zweiten Position, also werden Sie feststellen, dass ich CB2 zurückrufe. Also, ich rufe tatsächlich die Zeilen 27-31 zurück. Ich rufe cb1 nicht zurück, weil cb1 von eins bis zwei ist, und das ist tatsächlich bereits aufgetreten, wenn das Tween anfänglich gestartet wurde. Also, ich sage es, CB2 zurückzurufen. Wieder, cb1, cb2, cb3, cb4, das sind nur alle Kopien voneinander, das einzige, was sich geändert hat, ist der Pvector für Start und Ende und der Rückruf zum entsprechenden Callback. Also, es startet, es bewegt sich von Position eins zu Position zwei, hier unten auf Zeile 45 steht: „Oh hey, cool, du hast schon dein Sitzen in Position zwei bewegt, lass uns voran und feuern Position zwei Rückruf.“ Also cb2 feuert, es geht von zwei Position drei Position, sobald es kommt, dass drei Position es abfeuert cb3. Cb3 sagt: „Oh toll, ich gehe von drei auf vier, lass uns Callback vier feuern.“ Callback vier sagt: „Oh toll, ich gehe vier zurück zu eins“, und feuert cb1. Cb1 sagt dann: „Oh, direkt an ich gehe von einer Position zu zwei Positionen, lass uns voran gehen und cb2" feuern, boom, die Schleife hat geschaffen. Also, gehen Sie weiter und testen Sie die Skizze. Auch hier sollten Sie sehen, dass wir eine unendliche Animation der Bewegung zu vier verschiedenen Positionen auf dem Bildschirm haben. Also, solange Sie Ihr Tween erstellen, können Sie all diese Szenarien für Callbacks erstellen und wenn diese Callbacks ausgelöst werden, bewegen Sie sich einfach zu einem neuen Anfang und Ende. Also, ich werde dieses Video kurz halten, wir werden auf Beispiel neun gehen. Beispiel neun ist wieder eine wirklich großartige Erweiterung davon ist, die lautet : „Hey Josh, was ist, wenn ich keine Schleife will? Was passiert, wenn ich nicht mehr zwei, vier verschiedene Abschnitte animieren möchte? Was ist, wenn ich will, dass es eins bis zwei, zwei bis drei, drei bis vier, vier zu eins, eins in die Mittegeht drei bis vier, vier zu eins, eins in die Mitte und dann aufspringt und dann aufhört?“ Also, Beispiel neun wird diese Funktionalität zu veranschaulichen. Also, wir sehen uns im nächsten Video. 24. Einheit 6, Video 6: Okay, wir sind in Beispiel 9 und wieder Beispiel 9 ist nicht viel anders als Beispiel 8 außer dass, es ist keine Schleife. Es wird einige Tweens ausführen und sobald wir am letzten Tween angekommen sind, wird dieses Programm heruntergefahren, oder? Also, Beispiel 8, nur in die vier Koordinaten schleifen. Beispiel 9, Ich möchte von eins zu zwei, zwei zu drei, drei bis vier, vierzurück zu eins gehen zwei zu drei, drei bis vier, vier . Erstens wollte ich dann ins Zentrum gehen und nachdem es in die Mitte gekommen ist, möchte ich, dass es zu Ihnen skaliert. Nachdem es fertig ist, auf dich zu skalieren, kann es einfach aufhören, mehr Tweening zu machen. Also, das ist irgendwie nett, weil es eine Introanimation sein kann, aber es muss nicht Schleife. Ich wollte nur eine Sequenz ausführen, sobald diese Sequenz abgeschlossen ist, kann sie heruntergefahren werden. Lassen Sie uns also einen Blick darauf werfen, was in Beispiel 9 ein bisschen anders ist. Die erste ist Zeile zwei, wir haben zwei HTweens, wir haben t1 und t2. T1 ist das Tween, das sich mit der Verschiebung unserer Asset-Standorte beschäftigen wird. Wir wissen also, dass t1 die Eigenschaft von Standorten verwendet, also werden wir das verwenden, um sich auf dem Bildschirm zu bewegen. Es ist dieses HTWeen von t2, dass wir das Asset zu Ihnen skalieren werden. Also, es wird sich mit dem Eigentum von H.scale beschäftigen, okay? Nun, lassen Sie uns voran und schauen Sie sich die Zeilen vier bis acht, Ich habe einen fünften Pvector hinzugefügt und das ist die Fähigkeit, in die Mitte des Bildschirms zu bewegen, so dass Sie feststellen , dass Pvector pt5 320 mal 320 ist, so wird es animieren in die Mitte des Bildschirms. Nun, schauen wir uns Zeile 10 an, hier haben wir unsere Rückrufe. Wieder hatte Beispiel 8 cb1, cb2, cb3 und cb4, aber ich brauche jetzt einen Callback, um in die Mitte des Bildschirms zu bewegen, das CBCenter ist, Callback Center und ich brauche einen Callback, um dann auf Sie zu animieren, was CBScale ist, in Ordnung? Also, wir haben sechs Callbacks auf Zeile 10. In Ordnung. Rechts entlang sind r1, hRect, das sich tatsächlich nicht geändert hat, es ist genau das gleiche wie in Beispiel 8. Sieh dir Zeile 20 an, Zeile 20 hat sich nicht geändert. Es ist das gleiche wie in Beispiel 8, und das ist die Initiierung des Tweens, das sich von Position eins zu Position zwei bewegt , so dass wir wissen, dass, wenn wir unseren Film starten, es ist diese Zeile 20, die von Punkt eins zu Punkt zwei. Also, es wird jetzt in der oberen rechten Koordinate hängen, in Ordnung? Jetzt werde ich hier nach unten scrollen und ganz unten schauen, nur wissen, dass ich eine fünfte Verarbeitungsellipse hinzugefügt habe , um zu zeigen, wo dieser Mittelpunkt ist. Jetzt haben wir eine visuelle Darstellung der fünf Punkte, der fünfte ist jetzt die Mitte des Bildschirms. Okay, schauen wir uns die Rückrufe an. Sie könnten feststellen, dass cb1 auskommentiert wurde und dies aus einem guten Grund ist. Cb1 ist das, was diese Schleife geschaffen hat, richtig? Also beginnt das Programm, es bewegt sich von eins zu zwei, dann ging cb2 von zwei auf drei, dann ging es von drei auf vier, dann ging es von vier zu eins, und dann, sobald es wieder zu eins kam, cb1 feuerte wieder auf Position zwei ab, richtig? Also hat es diese Schleife initiiert. Also, ich habe tatsächlich cb1 auskommentiert, weil raten Sie was, wir verwenden es tatsächlich nicht, weil cb1 ist, was diese Schleife erstellt hat und wir keine Schleife wollen. Also, tatsächlich wird cb1 nicht in dieser speziellen Skizze verwendet. In Ordnung, also lassen Sie es uns kaputt machen. Wir testen den Film, wenn wir ihn testen, feuert Linie 20 und er bewegt sich von Position eins zu Position zwei, okay? Schauen wir uns Zeile 59 an, Zeile 59 sagt: „Wenn Sie tatsächlich feuern und Sie auf Position zwei bewegen, können Sie mich bitte wissen lassen, wenn Sie am Ziel von Position 2 angekommen sind und wenn Sie haben, feuern Sie bitte den Callback cb2 .“ Also dann, cb2 feuert. Cb2 sagt: „Okay cool, ich beginne bei zwei, ich gehe jetzt zu drei.“ Wenn es zu drei kommt, feuert es cb3, cb3 dann sagt: „Cool, ich bin in der unteren rechten Position, ich werde in die untere linke Position bewegen“, also bewegt es sich in die linke untere Position, es feuert dann cb4, cb4 sagt dann: „Ehrfürchtig, ich bin in der unteren linken Position, ich möchte wieder bis zur ersten Position animieren.“ Also geht es von Pvector 4 zu Pvector 1, okay? Nun, hier ist die Änderung, in acht hätte cb4 wieder cb1 gefeuert , was dann eins zu zwei gegangen wäre und dann boom Sie die Schleife bekommen haben. Hier ist die Pause, cb4 sagt jetzt: „Wenn Sie von Position vier zu Position eins gehen, möchte ich, dass Sie CBCenter zurückrufen“, okay? Plötzlich ist es wieder an Position eins angekommen und CBCenter Brände. Also schauen wir uns den Callback für CBCenter an und es steht: „Hey, ich muss von Position eins zu Pvector 5 gehen, was die Mitte des Bildschirms ist.“ Nun, es sind Linien 46 bis 50, die von Position eins zu Position fünf gehen, sie gleitet in die Mitte der Bühne, okay? Sobald es seinen Standort von links oben in die Mitte verschoben hat , heißt es: „Hey, ich möchte Sie wissen lassen, dass ich am Ort des Zentrums angekommen bin und sobald Sie am Ort des Zentrums ankommen, Ich möchte, dass du CbScale zurückrufst „, stimmt's? Wir sind bereit, die Skala zu Ihnen zu initiieren. Nun schauen wir uns CBScale an. CBScale sagt: „Hey Tween 1, das Tween, das sich mit allen Standorten beschäftigt hat, brauche ich dich nicht mehr, ich bewege keine Positionen mehr und da ich also keine Positionen mehr bewege, kannst du Tween 1, um die Registrierung aufzuheben.“ So werden Sie auf Linie 54 bemerken, Tween 1 stirbt ein glückliches und zufriedenes Leben. Es hat alle Orte animiert, die wir gehen mussten. Wir brauchen es nicht mehr. Zeile 54 des CbScale Callbacks sagt Tween 1 einfach, dass wir damit fertig sind. Wir bewegen keine Positionen mehr. Es ist jetzt online 55, dass wir unser neues Tween einrichten und unser neues Tween bewegt sich zu dir im Weltraum, also wirst du bemerken, dass es sagt: „Hey Tween 2, du bist ein neues Zeit-Tween. Das Ziel ist, dass unsere eine Person, die wir uns bewegt haben , aber die Eigenschaft dieses Mal ist Maßstab. Ich möchte, dass Sie mit einer 100-Prozent-Skala beginnen und ich möchte, dass Sie die 300 Prozent Skala beenden.“ Also, es wird 300 Prozent größer oder zu Ihnen und die Leichtigkeit ist 0,09 und der Frühling ist 0,9. Also, Sie gehen weiter und testen diese Skizze und beobachten, was passiert. Es geht von eins zu zwei, zwei zu drei, drei zu vier, vier zu eins, eins zum Mittelpunkt, und dann skaliert auf Sie und Sie werden feststellen, dass es tatsächlich gestoppt hat. Also, es führte unsere Tweens für die Position aus, sobald es in die Mitte kam, initiierte es das Tween für die Skalierung, und dann, sobald es an seine Endposition kam, werden Sie feststellen, dass es keinen Rückruf gibt. Ich habe nie gebeten, mich zu informieren, wenn es angekommen ist, ist es eine Skala von 300 Prozent. Die Animation stoppt also. Gehen Sie weiter und lassen Sie uns das noch einmal laufen. Wieder werden Sie feststellen, dass es alle Tweens für die Lage läuft, kommt in die Mitte, Frühling auf Sie, und wir sind fertig. Okay, damit endet das Video für Beispiel 9. Das nächste Video wird sich Beispiel 10 und Beispiel 11 ansehen und einige lustige Dinge mit Pixel Colorist machen und Sie werden es lieben. Wir sehen uns im nächsten Video. 25. Einheit 6, Video 7: Ok. In diesem Video werden wir an Beispiel 10 und Beispiel 11 arbeiten. Nun, Beispiel 10 und 11 sind tatsächlich Kopien von Beispiel acht. Ich möchte nur zu dieser Schleife zurückkehren, die immer und immer wieder läuft. Beispiel neun war großartig. Es zeigt Ihnen nur, wie Sie eine Reihe von Animationen ausführen und dann aufhören, aber für 10 und 11 möchte ich diese Schleife am Laufen halten. Beispiele 10 und 11 sind also Kopien von Beispiel acht. Sehen wir uns nun an, was sich in Beispiel 10 geändert hat. Das erste, was ist Zeile eins, wir haben unseren guten Freund HPixelColorist, und wenn ich voran gehe und zum Beispiel 10-Ordner navigiere, werden Sie feststellen, dass es einen Datenordner gibt und innerhalb dieses Datenordners ist dieser jpg. Also, ich möchte, dass das HTWeen unser Rechteck bewegt, aber ich möchte, dass es die Farbe aus diesem jpg mit HPixelColorist abtastet. Also, schauen wir uns Zeile 15, Zeile 15, AutoClear (falsch), richtig? Also, ich werde das Display nicht löschen, bevor ich das Rechteck wieder malte, also wird es eine Spur hinter sich lassen. Zeile 18, erstellt eine Instanz unseres HPixelColorist, und so heißt es: „Hey, geh in diesen Datenordner, geh weiter und schau dir color.jpg an.“ Wir werden es mit der Füllung zu tun haben, wir werden r1's Füllung zu jeder Farbe ändern, die auf color.jpg passiert. Wenn Sie sich r1 ansehen, ist das einzige, was hier geändert wurde, dass ich Rotation 45 Grad hinzugefügt habe. Anstatt ein Quadrat zu sein, ist es um 45 Grad gedreht, also ist es eine Art Rautenform. Nun hat sich nichts mit unserem Tween geändert, es wird zu den vier verschiedenen Orten animieren. Also wird das Tween von eins zu zwei gehen, zwei zu drei, drei zu vier, vier zu eins, sobald es wieder zu eins kommt, feuert es wieder auf Position zwei zurück und so hat die Schleife begonnen. Also, das hat sich nicht von Beispiel acht geändert. Nun, gehen wir weiter und schauen uns unsere Draw-Funktion an und das einzige, was ich hier als Update hinzugefügt habe , ist die Color.ApplyColor zu r1. Wenn wir diese Skizze ausführen, werden Sie feststellen, dass sie die vier Ecken ausführt, aber da sie die vier Ecken ausführt und diese x- und y-Position des Rechtecks aktualisiert, wird die Farbe aus der color.jpg innerhalb von den Datenordner, richtig? Also, es verwendet seine x und y als Blick auf die x und y des jpg und es sammelt die Farbe von dort. Also, Mörder, liebe das wirklich. Nun, lassen Sie uns fortfahren und schließen, und fahren Sie mit Beispiel 11 fort. Du weißt, dass ich es liebe, dir diese kleinen Blicke auf das Hinzufügen von Sachen zu geben. Schauen Sie es sich an, wir fügen ein paar Oszillatoren hinzu und ich füge hier zwei Oszillatoren hinzu. Wieder, ich bin wunderbar vage über Oszillator, weil wir nicht in diesem Abschnitt noch, aber wieder, ich nasse Ihren Appetit darauf, wie toll jeder Oszillator ist. Ich füge einen Oszillator für die Rotation hinzu, also wird er von negativem 180 zu positivem 180 oszillieren. Es wird auch seine Skala von 0,2 zu eins oszillieren. Also, von 20 Prozent seiner Größe bis zu 100 Prozent seiner Größe. Sie werden auch bemerken, dass ich ein kleines Update hier auf das Rechteck gemacht habe, ich bin davon entfernt, Anker bei H.center zu einem Anker von 50, negativ 50. Also, hier ist Ihr Kunstwerk, es ist auf der X-Achse zentriert, aber die Y-Achse ist 50 Pixel von der Kunst entfernt, also wird der Drehpunkt diese Art von Bewegung haben. Abgesehen davon hat sich wieder nichts in der Auslosung geändert, Ich habe gerade die Visualisierung der vier Punkte entfernt. Also, in der Ziehung, aktualisieren wir nur die Farbe und wir malen nur den Bildschirm. Also, an diesem Punkt, wenn ich diese Skizze teste, zeige ich nur, wie großartig Oszillator ist. Ob Sie es glauben oder nicht, es bewegt sich, das Tween bewegt sich von oben links nach oben rechts nach unten rechts nach unten links nach oben links. Es bewegt sich immer noch zu diesen Orten mit HTWeen, aber der Oszillator ändert seine Rotation und ändert seine Skala, so dass wir anfangen, etwas visuell interessanter zu bekommen. Da wir in Zeile 15 das AutoClear (falsch) machen, verlassen wir einfach einen Pfad. Auch hier, da wir HPixelColorist verwenden, nehmen wir die Farbe aus unserem versteckten jpg innerhalb unseres Datenordners ab. Ok. Ich werde dieses Video schließen und wir werden diesen Abschnitt mit einem letzten Video einschließen, das Beispiel 12 und Beispiel 3d ist. Es tut mir Leid. Beispiel 12 und Beispiel 13, die 3D verwendet haben. Also, das gleiche genaue System, aber tatsächlich mit einigen 3D-Aspekten, um die Skizze. Also, danke, dass du bei mir geblieben bist. Gehen wir zum letzten Video über und treten weiter in den Hintern und nehmen Namen. Wir sehen uns im nächsten Video. 26. Einheit 6, Video 8: In Ordnung. Dies ist das letzte Video für diesen Abschnitt. Ich liebe einige der 3D-Fähigkeiten von Hype. Ich genieße es einfach wirklich, in 3D-Systeme zu wechseln. Ich habe viele, viele Jahre in 2D-Systemen verbracht und bin einfach weggeblasen indem ich in 3D-Primitive und 3D-Koordinaten geriet. Ich genieße es nur wirklich, wirklich. Wenn man sich meine Tumblr sehr schnell anschaut, zog ich in 3D-Formen. Es waren Bananen, gelinde gesagt. Also, schauen wir uns Beispiel 12. Beispiel 12, wieder, ist einige 3D-Zeug. Sehen wir uns an, was sich geändert hat. Beispiel 12 und Beispiel 13 sind nur Fortsetzungen von 10 und 11. Nun, genauer gesagt ist es eine Erweiterung von 11. Also, 12 wirklich als Kopie von 11 in dem Sinne, dass ich immer noch diese Oszillatoren da drin gehalten habe. Nun, bis zu diesem Punkt, obwohl wir 3D in Beispiel fünf eingeführt haben, wurde es immer noch Interact verwendet. Interact ist eine zweidimensionale Zeichnung, richtig? Es ist kein dreidimensionales Zeichnen. Also, lassen Sie uns voran und schauen, was in Beispiel 12 anders ist. Nun, zuerst müssen wir die Zeilen 14 und 15 adressieren . Sobald Sie sich in eine 3D-Umgebung bewegen, müssen Sie die Verarbeitung wissen lassen, indem Sie den Renderer wechseln. Sie werden also in Zeile 14 bemerken, ich habe gesagt, dass der Renderer P3D sein sollte, damit Sie der Verarbeitung sagen, dass Sie es mit einem 3D-System zu tun haben. Es bedeutet auch, dass ich in Zeile 15 Hype sagen muss, dass ich auch in 3D umziehe. Sie werden bemerken, auf Zeile 15, Ich sage, verwenden Sie 3D ist wahr. AutoClear immer noch falsch, so dass es nicht wird, um die Anzeige zu löschen, es wird zu halten Malerei Spuren. Ich habe den Oszillator da drin behalten. In der Tat wird nichts wirklich code-weise geändert, außer dass ich mich geändert habe, nun, lasst uns tatsächlich zu Zeile drei zurückkehren. Sie werden feststellen, dass r1 eigentlich kein HRack mehr ist. Es ist tatsächlich eine HBox geworden. HBox ermöglicht es mir, eine 3D-Zeichnung zu definieren. Wir arbeiten immer noch an der HBox. Es gibt einige Dinge, die passieren müssen, aber Sie haben Zugriff auf HBox sowie HSphere. Also Zeile drei, anstelle von HRack, ist es eigentlich eine HBox. Gehen wir weiter und schauen uns die Linie 20 bis 27 an. Also sage ich, r1 ist eigentlich eine neue HBox, kein HRack mehr. Lass uns kurz darüber reden. Es ist diese Zeile 22, wo ich sage, dass die Größe 100 ist. Das bedeutet, dass es eine Box mit einer Breite von 100, einer Höhe von 100 und einer Tiefe von 100 ist einer Höhe von 100 . Also, es macht einen perfekten 100 mal 100 Würfel. Anders als das nicht viel anders. Nun, das stimmt nicht ganz. Ich glaube, ich habe den Oszillator hier gewechselt. Wenn du guckst, mache ich einen Oszillator für die Rotation und mache einen Oszillator für die Z-Achse. Also, jetzt werde ich diesen Würfel nehmen, und ich werde ihn auf dich und weg von dir bewegen. Das Tween-Zeug, immer noch dasselbe. Also, wenn ich diese Skizze tatsächlich ausgeführt habe, werden Sie jetzt feststellen, dass es immer noch die Positionen läuft. Also, es läuft immer noch die vier Koordinaten, aber das Zeichnen ist tatsächlich ein dreidimensionaler Würfel jetzt. Es ist keine Wohnung. Es ist kein flaches Rechteck. Es ist eigentlich ein 3D zeichnbar. Sie werden auch bemerken, dass es ein perfekter Würfel ist. Also, ich habe es wieder getan, es ist 100 mal 100 mal 100. Sie sollten bemerken, dass es tatsächlich etwas Schattierung macht. Der Grund, warum es etwas Schattierung macht, ist, naja, vielleicht, bevor ich über Schattierung spreche, bemerken Sie, dass es immer noch die Farbe von color.jpegs abtastet. Es verwendet also immer noch HPixel Colorist, um die Farbe zu sampeln, aber Sie könnten feststellen, dass sich die Farben tatsächlich ein wenig verschoben haben. Denn sobald Sie tatsächlich mit 3D arbeiten, können Sie mit dem Einrichten von Lichtern beginnen. Also, ich werde das nur für eine Sekunde schließen. Ich werde den ganzen Weg hier runter nach unten gehen. Beachten Sie, dass ich tatsächlich einige Punktlichter eingerichtet habe. Ich habe drei Lichter aufgestellt. Ich habe ein orangefarbenes Licht, ein blaugrünes Licht und ein weißes Licht eingerichtet. Lichter wollen im Grunde die Farbe kennen. Also, Sie werden bemerken, wenn Sie ein Licht betrachten, das ist rot, das ist grün, das ist blau. Sie geben also einen RGV-Wert an. Anschließend legen Sie fest, wo sich das Licht im Raum befindet. Also, nach diesem Punkt, wie ich gesagt habe, dass die X-Achse des Lichts auf Null ist, die Y-Achse ist Höhe geteilt durch zwei, und die Z-Position ist negativ 100. So ist das Licht tatsächlich auf der linken Seite zentriert, aber zurück bei negativ 100. Dann habe ich ein blaugrünes Licht aufgestellt. Dann richtete ich ein weißes Licht ein. Das Blaugrün Licht ist eigentlich Breite. Also, es ist ganz auf der rechten Seite und Höhe geteilt durch zwei, also ist es in der Mitte, aber es ist nur bei einer negativen 50 auf der Z-Achse. Das weiße Licht habe ich Breite geteilt durch zwei, so ist es in der Mitte. Aber seine Y-Position ist nur 100 Pixel von oben und seine Z-Position ist 150. Also, das weiße Licht ist eigentlich über allem, so dass es ein weißes Licht auf die Vorderseiten des Würfels wirft . Also, sobald wir anfangen, 3D zu verwenden, können wir beginnen, diese Beleuchtungskoordinaten zu tun, was wirklich Spaß macht. Sie können die RGV-Werte ändern und verschiedene Lichter auf Ihren Würfel werfen. Sie können damit beginnen, die Farbe dort zu manipulieren. Also, nicht nur bekommt es die Farbe von HPixel Colorist aus dem JPEG, sondern wir haben auch diese Lichter, die ihre eigenen individuellen Lichter auf die Würfel werfen, was nur ist, dieses Zeug ist schön. Ich bin fasziniert von diesem Zeug. Ich kann anfangen, diese Datei zu optimieren. Wirklich, die Mutation und Forschung darüber ist für mich endlos. Ich kann mir immer verschiedene Möglichkeiten vorstellen, einige der Dinge in dieser Datei anzupassen. Lassen Sie uns dieses schließen und gehen Sie einfach zu Beispiel 13 über. Beispiel 13 hat nur eine kleine Änderung daran. Ich habe die Punktlichter geändert, um grundsätzlich Grau und Weiß zu verwenden. Ich benutze keine Orange und Blaugrün wie in den ersten beiden Lichtern. Also, du wirst hier sehen, ich mache nur einen hellgrauen 204, 204, 204. Ich benutze immer noch das Weiß von 255, 255, 255. Also wieder, ich habe die Beleuchtung ein wenig geändert, um ein bisschen heller zu sein und nicht tatsächlich eine Farbe auf den HPixel Colorist zu werfen. Das zweite, was ich geändert habe, ist, wenn Sie sich die HBox ansehen, in Beispiel 12 war es ein perfekter Würfel, also hatte es eine Breite von 100, eine Höhe von 100 und eine Tiefe von 100. Es war also ein perfekter Platz. Es war ein perfekter Würfel. Schau dir an, was ich in Beispiel 13 geändert habe. Ich erstelle immer noch eine HBox, aber schau dir an, was ich in Zeile 26 mache. Ich sage: „Hey, ich möchte dich nur wissen lassen, dass du eigentlich kein perfekter Würfel bist. Ihre Tiefe beträgt tatsächlich 500 Pixel. Ihre Breite beträgt nur 50 Pixel, und Ihre Höhe beträgt nur 100 Pixel. Also, jetzt mache ich ein längliches Rechteck anstatt einen perfekten Würfel. Wenn ich diese Datei ausführe, werden Sie feststellen, dass diese Skizze dieses längliche Rechteck verwendet , anstatt einen perfekten Würfel zu verwenden. Also wieder, ich kann eine HBox machen, aber ich muss es nicht wirklich zu einem perfekten Würfel machen. Ich kann anfangen, Tiefe, Breite und Höhe anzupassen und im Grunde jede Art von Form zu machen, die ich will. Sie sollten auch bemerken, dass das Punktlicht wieder nur Grautöne und Weiß verwendet. Also, ich vergleiche nicht die Farbe, die aus HPixel Colorist entfernt wird. Das ist großartig. Dies fängt wirklich an, HTWeen abzuschließen. Wir werden zu HSwarm übergehen, das ein Verhaltenssystem ist, aber ich würde, sagen wir, eine Pause machen und anfangen, wieder über einige der Kunstwerke nachzudenken , die wir in der ersten Klasse erstellt haben. Wir könnten SVG animieren. Vielleicht willst du wirklich mit diesen 3-Dateien herumspielen und sehen, dass dies wie Spin Art ist. Das ist, als würde ich Säure Spin Art stolpern. Josh Davis, ich flippe aus. kannst du. Vielleicht ist es ein guter Zeitpunkt, auszuflippen, oder? Also, machen Sie eine Pause und experimentieren Sie mit etwas von diesem Zeug. Auch hier verwenden wir HTWeen nur, um diese vier Koordinaten zu animieren. Oszillator kümmert sich um dieses andere Zeug. Großartig. Damit wird dieser Abschnitt beendet. Wir werden in HSWarm umziehen, das sich mit einem Verhalten als System befasst , in das wir eindringen werden und ich denke, Sie werden wirklich genießen. Wir sehen uns im nächsten Abschnitt. 27. Einführung in HSwarm: Jetzt fangen wir an, uns mit den robusteren Aspekten der Verwendung von HYPE-Verhaltensweisen zu befassen. Als wir HFollow benutzten, benutzten wir Mauseingaben, wir benutzten Geste, um Dinge auf dem Bildschirm zu bewegen. Als wir in HTimer umgezogen sind, animierten wir Sachen, die auf Tempo basieren. Aber ich habe einige Verhaltensweisen zusammengepackt, die viel robustere Dinge tun. Zum Beispiel mussten Sie in HTWeen angeben, was die Animationsaktion war, den Punkt A bis Punkt B, aber wir haben viele andere Verhaltensweisen, die in HYPE existieren , die viel wildere Animationen ausführen. Die erste, die wir behandeln werden, ist HSwarm. Also, der beste Weg, um über HSwarm nachzudenken, ist ein Insektenverhalten. Stellen Sie sich Glühwürmchen vor, die im Sommer um Ihren Garten fliegen. HSwarm wird Ihnen diese Art von Gefühl geben, diese Art von Bewegung. Jetzt verwendet HSwarm einige interessante Argumente. Die erste ist, dass wir angeben, was mein Ziel ist. Also, in dieser ersten Datei, die wir wahrscheinlich erstellen werden, wird das Ziel die Mitte des Bildschirms sein. So hat der Schwarm bereits Anweisungen gegeben, wo er versuchen will, in diesem Fall die Mitte des Bildschirms zu erreichen. Allerdings verwenden wir noch ein paar Verhaltensweisen wie Rotation, Geschwindigkeit, Drehung ist, also wie viele Grad dreht sich dieses Insekt wenn es versucht, dieses Ziel zu erreichen? Und du wirst in ein paar anderen Mutationen sehen, die wir zucken werden, und zucken ist, was das Insekt vom Kurs klopft. Also, in diesen ersten Dateien, wenn wir das Ziel in der Mitte des Bildschirms setzen und nachdem wir alle Parameter für Rotation und Geschwindigkeit und so eingerichtet haben, sollten Sie feststellen, dass sich das Objekt um das dreht Ziel, weil es nicht ganz dazu kommen kann, oder? Es versucht, zu diesem Ziel zu schwärmen, aber es erreicht tatsächlich nie dieses Ziel wegen dieser Variablen, die wir in Kraft gesetzt haben. Nun, dieses Verhalten wird sehr einheitlich sein. Es ist erst, wenn wir in einer anderen Datei zucken, wo wir anfangen, diese Dinge vom Kurs zu klopfen. Wenn wir sie vom Kurs abschrecken, jedes dieser kleinen Kunstwerke, die auf dem Bildschirm entstanden sind, die Wahrnehmung geben, dass wird jedes dieser kleinen Kunstwerke, die auf dem Bildschirm entstanden sind, die Wahrnehmung geben, dasssie ein unabhängiges Verhalten haben, einen eigenständigen Geist, weil sie sich über den ganzen Bildschirm schlängeln, aber alle von ihnen versuchen immer noch, zu diesem Ziel in der Mitte fixiert zu bekommen. 28. Einheit 7, Video 1: Ok. Willkommen bei HSWarm. In diesem Abschnitt werden wir ein Verhalten behandeln, das ein System ist. Also, im Grunde werden Sie ein System einrichten, eine Reihe von Objekten in diesem System registrieren, und dieses Verhaltenssystem steuert dann alle Elemente, die erstellt werden. Sie sollten also in HSWarm sehen, dass wir sieben Dateien haben und wir werden die ersten drei durchlaufen, Beispiel eins, Beispiel zwei und Beispiel drei. Lassen Sie uns voran gehen und beginnen Sie mit unserem Zusammenbruch von Beispiel eins. Also, Beispiel eines ist wieder sehr ähnlich zu einigen Sachen, die wir in HTimer behandelt haben in dem Sinne, dass wir einen Timer in Verbindung mit einem Pool verwenden. Ok. Also, lasst uns einfach diese Aspekte dieser Datei verdauen. Ich habe einen HDrawable-Pool, ich habe einen HTimer, wir können hier sehen, dass wir einen HDrawable-Pool haben, der 40 Assets zeichnen wird, sie werden zu dieser Phase hinzugefügt werden, wir werden ein Rechteck malen, das eine Rundung von vier, und die Größe ist nur eine Breite von 18 und eine Höhe von sechs. Wir haben einen Coloristen mit einem HColor-Pool und einigen zufälligen Farben hier drin, und wir wissen, dass es nur auf fillonly angewendet wird. Ok. Wenn wir hier nach unten scrollen, haben wir einen Timer, weil wir staffeln wollen, wenn diese Dinge auf dem Bildschirm präsentiert werden. Also, anstatt eine Anfrage alle zu tun, verwenden wir einen Timer, um unsere Rechtecke zu generieren. Linie 44 hat eine NumCycles, so dass wir wissen, dass dieser bestimmte Timer wird nur 40 Mal laufen und dann herunterfahren. Wir wissen, dass es den Callback alle 250 Millisekunden auslösen wird, und wenn dieser Rückruf ausgelöst wird, wird es einfach den Pool auffordern, ein Element anzufordern. Also, wir haben pool.request. Nun, das ist ein Schwarm. Also, wenn Sie einfach hier unten mit der Auslosung schauen, habe ich H.DrawStage, und dann mache ich eine andere Verarbeitungssyntax für die Darstellung. Also, ich will dir hier nur zeigen, dass ich zwei Ellipsen mache. Die erste Ellipse, ich werde nach oben setzen und tatsächlich sagen Farbe, dass ein blaugrün, und dann werde ich eine in der Mitte des Bildschirms setzen, und ich werde das eine dunkle Orange färben. Der Grund, warum ich zwei Farben ausgewählt habe, ist, weil ein Punkt die Geburt der Objekte darstellen wird, und der andere Punkt wird den Punkt darstellen, an dem der Schwarm herumschwärmen versucht. Ok. Also, ich habe zwei Ellipsen in zwei alternativen Farben. Nun, wenn wir uns das OnCreate hier ansehen, und wir gehen voran und schauen uns unser HRectangle an, das unser Drawable ist, wenden wir keinen Strich an. Wir fügen einen Standort hinzu, und dieser Ort ist der erste Punkt. Also, schau, Breite geteilt durch zwei, also wird es die Mitte des Bildschirms sein, aber dann wird es 100 Pixel von oben sein. Wenn Sie hier auf Zeile 60 nach unten schauen, ist das genau der gleiche Punkt, Breite geteilt durch zwei, 100 Pixel von oben. Dies würde also die Position darstellen, an der die Vermögenswerte geboren werden, und die Verankerung ist H.CENTER. Also, wir haben alles abgedeckt, was nicht HSwarm ist, damit wir sehen können, was hier passiert. Jetzt bedecken wir Schwarm. Schwarm ist ein Verhalten, aber noch wichtiger ist es ein System, richtig? Es ist ein System, das das ganze Zeug auf dem Bildschirm kontrollieren wird. Also, zumindest bevor wir diese Datei überhaupt ausführen, haben wir das Verständnis, dass alle 250 Millisekunden, es wird ein Rechteck in der Position erstellen, die wir wünschenswert setzen. Ok. Also, schauen wir uns hier Schwarm an. Aber in Zeile eins, sehen Sie, ich habe HSwarm gesagt, wir werden es Schwarm nennen, und dann auf den Zeilen 10-15, erstelle ich eine Instanz dieses HSwarm. Also, ich sagte, Schwarm ist ein neuer HSwarm. Lassen Sie mich Ihnen ein paar Sachen erzählen, die Sie wissen müssen. Die erste ist, ich möchte ein Ziel hinzufügen, und das Ziel ist, Breite geteilt durch zwei, Höhe geteilt durch zwei. Also, das Ziel, das Sie versuchen, zu erreichen, ist die Mitte des Bildschirms. Also, Schwarm wird herumschwärmen mit immer dem Wunsch, zu versuchen, in die Mitte des Bildschirms zu kommen. Jetzt müssen wir dem Schwarm eine Geschwindigkeit geben. Also, in diesem Fall habe ich gesagt, in Ordnung, der Schwarm des Objekts sollte eine Geschwindigkeit von vier haben. Jetzt werden Sie sehen, dass wir Turnease haben. Also, wie viele Rotationsgrade macht es, um zu versuchen, in die Mitte des Bildschirms zu gelangen? Also, in diesem Fall habe ich 0,025f gesagt. Also, es ist ein Schwimmer. Ok. Ich habe hier auch Argument für Zucken, und Sie werden feststellen, dass Zucken auf Null gesetzt ist. Also, mit dieser speziellen Datei, ist es eigentlich kein Zucken überhaupt, was wir in Beispiel drei behandeln werden. Also, im Moment, überhaupt kein Zucken. Also, Linien 10-15 richten dieses Schwarmverhalten ein, und das Schwarmverhalten ist ein System. Nun, was ich tun muss, ist die Objekte im System zu registrieren. Sie werden also hier in Zeile 37 bemerken, da ich Assets erstelle, da der Timer alle 250 Millisekunden feuert und da er das OnCreate für jedes einzelne Assets auslöst, sagt Zeile 37: „Hey Schwarm, Ich möchte Ihnen einen anderen Spieler im System geben. Also, ich sage nur, swarm.addTarget (d), d ist unser hRect zeichnbar. Also, jetzt registriert der Schwarm Vermögenswerte, und in diesem Fall wird er 40 von ihnen registrieren. Wenn ich diese Skizze ausprobiere, fangen wir an, das Schwarmverhalten zu sehen. Also, alle 250 Millisekunden, wird ein Asset erstellt, sie werden in dieser Breite geboren, geteilt durch zwei, y100, und es setzt sie in Bewegung. Ok. Nun, es ist, sie in Bewegung zu setzen, aber hier, lassen Sie mich einfach schließen und nach oben gehen und das nochmals ausführen, so können wir den Schwarm betrachten, während er läuft. Das Ziel ist diese Breite hier geteilt durch zwei, Höhe geteilt durch zwei. Also, diese Typen versuchen, zum Zentrum zu kommen. Die anderen Dinge, die wir uns ansehen müssen, ist, okay, cool. Es ist eine Geschwindigkeit mit diesen Objekten verbunden. Also, im Moment sehen wir eine Geschwindigkeit von vier, und dann haben wir Turnease. Also, dass TurnEase ist Grad, die es dreht, um zu versuchen, in Breite geteilt durch zwei, Höhe geteilt durch zwei, dieses Ziel zu bekommen . Aber weil es eine Geschwindigkeit gibt und weil es eine Rotation gibt, können Sie sehen, dass sie irgendwie in einen perfekten Kreis fallen. Denn basierend auf der Geschwindigkeit und basierend auf der Turnease, kommen sie eigentlich nie ans Ziel. Wieder, es ist wie, denken Sie über das Fahren Ihres Autos, Sie können nur das Lenkrad so viel drehen, und wenn Sie auf einem Parkplatz waren und Sie eine Soda Dose in der Mitte des Parkplatzes, und Sie hatten Ihren Fuß auf vier Meilen pro Stunde für die Geschwindigkeit, und du drehst das Rad, du wirst nie an die Dose kommen. Sie werden nur im Grunde Kreise machen, die können. Also, wenn man sich diese beiden Variablen erneut ansieht, diktiert, wie sich dieses System verhalten wird. Nun, ich werde es noch einmal ausführen, weil dies wird bereiten wie wir uns in Beispiel zwei bewegen, das heißt, beobachten Sie die Badeanimation. Also, beachte, dass sie immer auf die rechte Seite schießen, und sie fallen alle in dieses perfekte Muster. Also, ich wollte das ein bisschen staffeln. Also, lassen Sie uns voran gehen und schließen Sie dies und gehen Sie in Beispiel zwei. Nun, in Beispiel zwei, mache ich nur eine kleine Anpassung, die heißt, ich möchte zufällig bestimmen, wie diese Dinge aus ihrer Badeposition geworfen werden. Wenn Sie sich Beispiel zwei ansehen, möchte ich nur, dass Sie nach unten scrollen und sich die onCreate-Methode ansehen. Sie werden hier bemerken, dass ich ein paar zusätzliche Dinge einfüge. Einer ist, ich sagte gerade Float-Rotation gleich zufällig (TWO_PI). Also, ich habe in diese Rotationsvariable, und dann habe ich eine kleine Anpassung an unsere HDrawable d. Auf Linie 35, sagte ich, okay, gut der Rotationsradius sollte sein, was auch immer Rotation auf Linie 30 abgefeuert wurde. Ich möchte auch nur eine schnelle Bewegung von HDrawable d zu tun , um Kosinusdrehung mal zehn für die x und Sinusdrehung mal zehn für die y. jetzt, nur mit diesem kleinen Zusatz in diesem speziellen Beispiel, lassen Sie uns beobachten was passiert. Sie werden feststellen, dass, wenn die Assets beginnen, erstellt werden, sie Art von schießen wie Feuerwerk. Statt dass sie ständig nach rechts geworfen werden, verteile ich tatsächlich zufällig, wie diese Dinge rausgeworfen werden. Das Problem mit dieser Datei im Moment ist, dass es kein Zucken gibt, und weil es kein Zucken gibt, spielt es keine Rolle, wie ich diese Dinge rausschmeiße, sie werden in diese kreisförmige Rotation fallen. Was an diesem besonders schön ist, ist das, dass man einige hat, die im Uhrzeigersinn gehen und andere haben, die gegen den Uhrzeigersinn gehen, während sie im Beispiel eines immer im Uhrzeigersinn verlaufen. Also, zumindest mit dem Hinzufügen dieses Codes in Beispiel zwei, haben wir einige Vermögenswerte im Uhrzeigersinn und einige gehen gegen den Uhrzeigersinn. Ok. Gehen wir weiter und schließen Sie das und ich gehe weiter und gehe zu Beispiel drei. Die einzige Änderung innerhalb von Beispiel drei ist, und ich würde sagen, Beispiel drei ist eigentlich eine Kopie von Beispiel eins, ich habe dieses Feuerwerk losgeworden, das Verhalten in Beispiel drei auswirft , nur weil ich die Dinge vereinfacht halten möchte. Im Beispiel drei, alles, was ich getan habe, war, dieses Zucken hinzuzufügen. Eigentlich habe ich die Geschwindigkeit auf fünf geändert, die TurnEase ist jetzt 0,05, aber sieh dir dieses Zucken an, Zucken ist 20. Hier ist es nur diese eine kleine Variable, die wirklich die Aufregung in diesem speziellen Verhalten auffällt, das heißt, was Zucken tun wird, ist, es vom Kurs zu schlagen. Also, wenn es eine bestimmte Geschwindigkeit implementiert und eine bestimmte TurnEase implementiert, ist alles zucken, dass es im Grunde vom Kurs kommt. Also, wieder, stellen Sie sich vor, zu versuchen, Ihr Auto zu fahren , um eine Soda kann sitzen in der Mitte der Straße, aber es kommt einfach so vor, dass es andere Autos, die tatsächlich in Sie zuschlagen, klopfen Sie vom Kurs. Also, das ist es, was zucken ist. Twitch weicht vom Pfad klopft sie natürlich ein wenig ab. Jetzt und wieder, das ist die einzige Änderung hier in Beispiel drei. Sehen Sie, was passiert, wenn wir diese Skizze ausführen. Wir fangen an, dieses wirklich schöne organische Verhalten zu bekommen denn jetzt scheint es, dass jeder von ihnen einen eigenen Geist hat. Also, Sie haben vielleicht in dem Intro-Video gesehen, auf das ich verwiesen habe, es ist wie ein Insektenverhalten und es nimmt wirklich diese Art von Ästhetik an, weil, wie Schwarm läuft und wie sie alle eine Geschwindigkeit von fünf verwenden, und ja, sie verwenden alle Turnease von 0,05, sie sind jeder zufällig bekommen einen Zuckerhit auf sie. Sobald das implementiert wird, scheint dieses ganze System all diese Dinge zu übernehmen , als würden sie unabhängig handeln, aber sie sind wirklich besessen davon, in die Mitte des Bildschirms zu kommen. Also, dies schließt Beispiele ein zwei und drei ein. Im nächsten Video werden wir die Ergänzungen in Beispielen von vier bis sieben abdecken . Wir sehen uns im nächsten Video. 29. Einheit 7, Video 2: Okay, das ist das letzte Video in diesem Abschnitt. Wir werden an Beispielen vier, fünf, sechs und sieben arbeiten . Dies sind Mutationen, nur um einige Verbesserungen zu zeigen, die auf diese Dateien angewendet werden können. Lassen Sie uns also voran gehen und sehen Sie sich Beispiel vier und einige der Beispiele an, einige der Anpassungen, die ich vorgenommen habe, ist die Betrachtung der Zeile sieben. Ich sagte Auto Clear Falsch. Also, gerade jetzt wird es beginnen, Spuren auf dem Bildschirm zu verlassen. Die andere Anpassung, die ich vorgenommen habe, ist, auf Zeile 11 zu schauen. In den vorherigen Dateien Anzeigenziel wurde Breite geteilt durch zwei, Höhe geteilt durch zwei. Hier sage ich nur „H.Mouse“. Also, h.mouse wird die x- und y-Position der Maus zurückgeben, während ich aktualisiere, also ist es ein weiterer Tipp zu dem, was wir in h.Follow getan haben, die Geste verwendet. Also, jetzt ist das Ziel, wo die Maus zufällig ist. Abgesehen davon ist der Code genau der gleiche mit einer anderen kleinen kleinen Anpassung hier, die auf Zeile 31 für die Größe ist, ich habe nur die Größe der H.recs zufällig gemacht, die erstellt werden. Also für die Breite tut zufällig 10, 20 und für die Höhe tut zufällig zwei, sechs. Wenn ich diese Skizze ausführe, solltest du bemerken, dass, wenn ich meine Maus wieder hier in die Mitte lege, 40 Assets in diesem Drawable sind, der Timer alle 250 Millisekunden feuert, und sie sind alles, was sie nur sind versuchen, zu meiner Maus zu kommen. Wenn ich also meine Maus hier oben in die obere rechte Ecke schiebe, hat sich das Schwarmziel geändert, also kann ich jetzt anfangen, Geste auszuführen und der Schwarm versucht ständig, die Position meiner Maus zu jagen. Denken Sie also daran, dass das Ziel nicht immer ein fester Punkt sein muss. In diesem Fall kann es tatsächlich ein Punkt sein, der sich bewegt, im Fall dieses ist h.Maus. In Ordnung, also lasst uns noch einige weitere Verbesserungen machen. Dies verwendet offensichtlich Coloristen und einen HColorPool, also dachte ich, vielleicht würde ich ein anderes Zeug ausprobieren, das, wenn Sie sich Beispiel fünf ansehen, wir das in der First-Class bedeckten, aber bisher habe ich nicht wirklich darüber gesprochen , was HColorField. Wenn Sie sich erinnern, können Sie mit HColorField Farbverläufe erstellen. Also, hier können Sie sehen, ich füge einen Punkt von Blau hinzu und füge einen Punkt von Rosa hinzu. Also verwende ich HColorField, um Farbpools zu definieren, und wenn Sie sich daran erinnern, wenn sich diese Farbpools überlappen, verschmelzen sie tatsächlich neue Farben, wo sich Überlappungen tatsächlich ergeben. Also, die einzige Änderung an diesem ist das Hinzufügen von loszuwerden, Sie werden feststellen, dass es jetzt weg ist, der.colorist HColorPool fehlt in diesem speziellen Abschnitt. Ich benutze jetzt online eins hier HColorField, und wieder in den Zeilen 11 bis 17 gebe ich zwei Farben an, ein Blau und ein Rosa und sage, dass sie nur auf eine Füllung angewendet werden sollten. Nun, es gibt ein paar Dinge, wenn Sie sich mit Pixelfarben erinnern, die wir tun müssen, ist, dass Sie eine Füllung mit Farbfeld setzen und Sie können sich vorstellen, Farbfeld ist wie ein Farbton. Wieder weiß ich nicht, ob du dich an das Gespräch erinnerst, das wir in der ersten Klasse hatten. Aber ich möchte voll gesättigte Farbe, also werde ich tatsächlich die Füllung auf schwarz setzen, 000000. Nun, weil ich H.Mouse benutze und weil ich die Maus bewege und der Schwarm der Geste folgt, muss ich ständig die Assets aktualisieren, die sich im Schwarm befinden. Also, schauen wir uns hier unten auf die Draw-Funktion, und Sie werden feststellen, dass ich ein wenig for-Schleife habe. Nun, eine for-Schleife ist wieder etwas, das eine bestimmte Anzahl von Malen ausführt. Also, was ich tun möchte, ist eine Schleife über alle 40 Assets, die auf dem Bildschirm sind, und aktualisieren jedes dieser 40 Assets aktualisieren ihre Farben. Also, ich sage für HDrawable d innerhalb des Pools. Also jetzt weiß ich, dass diese for-Schleife 40 Mal laufen wird. Wenn ich das mache, sage ich nur, dass ich mit dem Farbfeld sprechen möchte. Also, ich sage colors.applyColor und ich wende es zurück auf d.fill und wieder, die d.fill ist ein Block. Wenn ich diese Skizze erneut ausführe, werden Sie feststellen, dass ein Schwarm initiiert wird, Sie sollten in der Lage sein, Ihre Maus zu bewegen, sie laufen zu Ihrer Maus und während Sie sich bewegen, aktualisieren Sie tatsächlich die Füllfarbe damit mit diesem Farbfeld . Also, wenn ich nur in diese richtige Position bewegt, bekomme ich die volle Sättigung des Blaus und wieder, Sie werden bemerken, wie ich beginne, in die Mitte zu bewegen, ich bekomme dieses Lila, weil dort die beiden Farbfelder tatsächlich mischen. Wenn ich hier nach links gehe, dann werde ich natürlich das hellere Rosa bekommen. Da es sich um einen Farbverlauf handelt, können Sie wieder, wenn Sie sich wegbewegen , beginnen, den Farbverlauf zu sehen, wenn er sich herausbewegt. Also, wenn ich in diese Position komme, werde ich wahrscheinlich nah an diesem Schwarz wie möglich kommen. Also, wieder verwendet dies HColorField. Also, in Beispiel vier, wir verwendeten HColorPool und Beispiel fünf, wir verwendeten HColorField, also natürlich, wenn Sie zu Beispiel sechs übergehen, möchte ich PixelColorist tun. Also, wenn Sie sich HPixelColorist anschauen, haben wir unsere Farbe jpg. Also, lassen Sie uns einfach voran und schauen uns Zeile eins an. Ich sage HPixelColorist Farben in den Zeilen 11 bis 15, ich sage, hey gehe in den Datenordner und finde diese color.jpg. davon ist der Code immer noch absolut derselbe, außer hier unten auf der Unterseite der Ziehung, ich habe ein wenig eine Anpassung vorgenommen, die ich sagte: „Cool, ich muss alle Vermögenswerte im Pool durchlaufen und ich muss ihre Farbe, colors.applyColor aktualisieren“, aber beachten Sie, dass ich d.alpha 50 sage, also ändere ich tatsächlich die Alpha-Transparenz der HRectangles innerhalb des Schwarmsystems. Also, wenn ich diese Skizze tatsächlich ausführe, werden Sie feststellen, dass es die Farbe abtastet, aber wieder, ich habe dieses Alpha von 50, so dass ich anfangen kann sie Art neue Farben zu erstellen, während sie übereinander laufen. Wenn ich in einem Abschnitt bleiben würde, würde der Schwarm offensichtlich genug aufbauen, dass bestimmte Fläche ziemlich gesättigt würde mit der Farbe, die aus dem jpg gesampelt wird. Nun, wenn Sie zur letzten Datei gehen, die Beispiel sieben ist, wussten Sie, dass diese kam, fügt HCanvas hinzu, so oben sagte ich hCanvas c1, wieder ist dies nur Wiederholung, so viel Wiederholung in der Programmierung. Zeilen 12 bis 13 Erstellen eines HCanvas auto clear false. Beachten Sie erneut, dass die AutoClear false aus Zeile neun entfernt wurde, es wurde zu HCanvas mit einem schönen Fade von zwei hinzugefügt und unsere Leinwand C1 wird zur Bühne hinzugefügt. Also, weil ich das getan habe, beachte, dass ich eine Anpassung an Zeile 25 vornehmen musste. Also, anstatt es auf die Bühne hinzuzufügen, sage ich pool.Autoparent und dann übergeben Sie es die Leinwand. Also, jetzt wird jeder dieser 40 HRECTs im Gegensatz zur Bühne auf die Leinwand gezogen. Nun, wieder der Rest des Codes wurde nicht geändert. Die for-Schleife unten unten, nahm ich das Alpha weg und dann sagte einfach d.fill in und eingefügt in dieser Farbe von Schwarz. Nun, wenn ich diese Skizze ausführe, stellt dies für mich die Schönheit aller Elemente dar, die im Tandem arbeiten. Also habe ich einen wirklich schönen Schwarm passiert, ich habe die Farbe von HPixelColorist von diesem jpg, der in der Datendatei sitzt, aber wir verwenden die Macht von HCanvas, um langsam die Spur des System so dass es den Bildschirm nicht vollständig füllt, ermöglicht es mir, Bereiche der Skizze zu erkunden und dann die Trails in den Hintergrund zu verblassen. Okay, also das schließt die Erkundung von HSwarm ein und wieder, Gott, ich hasse es, immer wieder dieselben Dinge zu sagen, aber wieder, das benutzt nur einen HRect. Dies kann jede der SVG verwenden, die Sie erstellt haben. Da kommt das Experimentieren ins Spiel. Ich versuche, den Code so generisch wie möglich zu halten, damit Sie anfangen können „Nun, was ist, wenn ich ein Bild anstelle dessen setze?“ oder: „Was ist, wenn ich SVG damit verwende?“ Sie können beginnen, einige dieser Dinge zu mischen und zu passen, die wir gelernt haben, indem Sie diese Art von Mutationen machen, von denen ich spreche. Auch hier ist das Zeug, das ich auf einer täglichen Basis mache, ist mit diesen Ideen gekommen, versuchen Sie, den Code zu schreiben, ist generisch wie möglich , so dass ich beginnen kann, all diese verschiedenen Mutationen zu erkunden. Wie sieht das aus, wenn Sie einige Ihrer SVG-Assets dort reinlegen? Ich gehe davon aus, dass Sie einige Videos innerhalb des letzten Projektabschnitts veröffentlichen werden, die uns genau zeigen, wie es aussieht. Also, ich freue mich, zu sehen, was ihr mit dem System vor allem macht. Okay, wir gehen zu den letzten zwei großen Codeabschnitten, und wir werden als Nächstes in Hoscillator gehen. Hier ist der Teil, in dem Sie, wenn Sie auf Hoscillator klicken, etwas ausgeflippt sind, weil ja, es gibt 23 Beispiele im Hoscillator-Abschnitt. Ich bin aus dem Alter Oszillator, ich bin in Hoscillator verliebt und Sie werden offensichtlich sehen, warum, während wir durch diesen Fortschritt bewegen. Also, HSwarm, es war fantastisch. Wir sehen uns im nächsten Abschnitt Hoscillator. 30. Einführung in HOscillator: Im Moment haben Sie den Abschnitt erreicht, das ist mein absoluter Favorit und das ist Hoscillator. Weil Hoscillator so einfach und so schön und so überraschend ist. Es gibt so viele Mutationen, die wir mit Hoscillator machen werden. Das, du wirst nicht schlafen, du wirst nicht einen Monat lang schlafen. Weil Sie über all diese verschiedenen Möglichkeiten nachdenken werden, Hoscillator zu kombinieren, um diese unmöglichen unerwarteten Animationen zu erstellen. Hoscillator ist nur ein Wellenmuster, und wir haben tatsächlich vier verschiedene Wellen, mit denen Sie arbeiten können. Es gibt eine Sinuswelle, die diese schöne Kurve ist. Es ist wahrscheinlich diejenige, die wir am meisten verwenden werden. Wir haben eine Vierkantwelle, wir haben eine Sägewelle und wir haben eine Dreieckwelle. Nun, wir werden uns einige der Parameter des Hoscillators ansehen. Wieder will er, wie Schwarm, ein Ziel kennen, wen wir diese Welle anwenden. Es will auch Eigenschaft wissen, genau wie HTWeen, in diesem vorherigen Abschnitt. Was sind einige Dinge, die wir tatsächlich oszillieren können? Nun, wir könnten wieder oszillieren, Alpha, wir könnten Skala oszillieren, Rotation oszillieren, Position oszillieren. Es will Dinge wie Reichweite wissen. Also, wie groß ist der Bereich der Schwingung? Könnte sein, wenn wir es auf Rotation anwenden, könnte, positiv 180 Grad bis negativ 180 Grad sein. Also würden wir dieses Ding haben, wie ein Pendel, hin und her gehen. Oszillator hat Frequenz, also was ist die Amplitude der Welle? Ist bei einer langsamen wellenförmigen Welle? Oder ist es sehr unberechenbar? Wir haben auch eine Eigenschaft des aktuellen Schritts, und der aktuelle Schritt, ist es, was uns erlaubt, diese Welle zu versetzen, über verschiedene Dinge, die wir auf dem Bildschirm malen. Also, in der ersten Klasse, haben wir Dinge wie GridLayout gelernt. Nun, GridLayout und Hoscillator funktionieren großartig zusammen? Denn wir können Dinge auf dem Bildschirm anordnen und dann Oszillation über all diese Elemente im Raster passieren. Jetzt werden wir HoScillator auf zweidimensionale Animationen anwenden. Wo es wirklich Bananen bekommt, ist, wenn wir tatsächlich Hoscillator auf eine dreidimensionale Animation anwenden. Wir können Dinge wie, den Z-Raum oszillieren , sowie, wir werden eine Probe machen, wo wir tatsächlich HBox verwenden, was uns erlaubt, einen dreidimensionalen Würfel zu machen, und wir können tatsächlich oszillieren, wie diese Box dreht sich in drei dimensionalen Raum. Also Hoscillator, wenn es nicht dein Favorit ist, gehen wir nicht mehr aus. Es ist einfach so einfach. Wenn du diesen Abschnitt nicht liebst, mache ich Schluss mit dir. 31. Einheit 8, Video 1: Jeder Oszillator. Du bist mein bester Freund. Jeder Oszillator macht alles schön. Ich kann nicht einmal ausdrücken, wie sehr ich Hoscillator liebe. Es ist wahrscheinlich die überraschendste Sache, mit der ich je experimentiert habe, in dem Sinne, dass Sie wie ein paar Dinge mischen und es ist wie „Was?“ Ich sage: „Ja.“ Es ist wie „was?“ Es ist verrückt. Ich liebe es. 23 Beispiele, Mann. Ich bin verrückt geworden. Ich liebe diese Klasse wirklich. Also, an dieses Video angehängt ist offensichtlich eine ZIP-Datei. Öffnen Sie das, Sie werden 23 Beispiele sehen. In diesem ersten Video gehen wir durch die ersten sechs. Also nochmal, geh weiter und lade diesen Zip herunter, entpacke ihn, du solltest es dir ansehen und hier ist es. Nun, gehen wir weiter und schauen uns das erste Beispiel an. Beispiel 1 enthält keinen Hoscillator. In der Tat, was es enthält, ist Code, den wir in der ersten Klasse mit unserem schönen Freund HGridLayout gemacht haben . Also, lassen Sie uns einfach durch dieses Gitter gehen, das wir erstellen werden und dann in Beispiel zwei, wird beginnen, Schwingung zu erforschen. Nun, bevor ich in den Hype-Code komme, möchte ich nur den ganzen Weg nach unten springen und wieder etwas Verarbeitungscode präsentieren. Also, wenn Sie hier schauen, erstelle ich einen Strich von einem hellgrauen, CCCCCC, und dann erstelle ich eine Linie, und ich erstelle eine Linie vom ersten Punkt Null, Höhe geteilt durch zwei. Es ist also auf der Y-Achse zentriert und der andere Punkt ist Breite durch Höhe geteilt durch zwei. Also, wir machen im Grunde eine horizontale Linie. Wieder möchte ich diese Horizontlinie sehen, denn sobald wir in die Schwingung gekommen sind, wollte ich sehen, wie sich die Schwingung auf diese Grundlinie auswirkt. Also, lasst uns voran gehen und das überprüfen. Oben oben haben wir einen HDrawablePool. Der Pool wird 90 Vermögenswerte anhängen. Es sieht so aus, als ob wir wieder ein Rechteck anhängen, aber überprüfen Sie die Größe, die Seite ist nur sechs Pixel mal sechs Pixel. Die Rundung der Kanten ist zwei, sie ist in der Mitte verankert und es gibt keinen Strich. Es gibt einen Coloristen mit einem HColorPool mit einigen zufälligen Farben, die nur zum Füllen angewendet werden. Du wirst bemerken, dass ich nur ein paar Sachen überspringen werde. Schauen Sie unten nach unten, ja, die Rückkehr von requestAll. Beachten Sie, dass wir keinen Timer verwenden, um dieses Raster zu erstellen, ich möchte alle 90 Assets auf einmal. Schauen wir uns das Layout hier an. Also, wir haben ein HGridLayout. Es beginnt an einer x-Achse von neun und Höhe geteilt durch zwei. Also, es wird an dieser Mittellinie des Horizonts anhängen. Da unser hRect sechs Pixel mal sechs Pixel beträgt, beachten Sie, dass der Abstand sieben Pixel beträgt. Also, nun, lassen Sie mich einfach darauf zurückkommen, weil Sie vielleicht bemerken, dass es Null für das y gibt. Da es 90 Assets in den Spalten gibt, was bedeutet, wir verwenden Rasterlayout, um eine Zeile von Assets zu erstellen, und diese Assets sind sechs Pixel x sechs Pixel, aber da der Abstand sieben ist, gibt es eine Ein-Pixel-Dachrinne zwischen jedem der HRechtecke. Da wir nur eine Zeile bauen, gibt es wirklich keinen Grund, eine Zahl für den y-Abstand zu setzen. Also, lassen Sie uns diese Skizze testen und noch einmal, Sie sollten sehen, dass wir 90 Rechtecke haben, die alle in einer Reihe gebaut sind, und sie ist perfekt zentriert auf der Horizontlinie, die wir unten in der Zeichnung definiert haben. So toll, jetzt habe ich diese Reihe von Assets, auf die ich etwas Schwingung anwenden möchte. Zumindest mit dieser Datei können Sie sehen, wie wir dieses Zeug auf dem Bildschirm anhängen, bevor wir Oszillation anwenden. Ich gehe weiter und schließe das, und ich gehe weiter und gehe weiter, um zwei anzumelden. Nun, innerhalb der Datei zwei, werde ich jedem dieser Rechtecke einen Oszillator hinzufügen. Also, wenn ich hier nach unten scrolle, werden Sie feststellen, dass es ein RequestAll gibt. RequestAll wird bei Create für alle 90 Assets auf einmal ausgelöst und was passiert ist, ist es RDrawable d. Es wendet das Layout auf d an. Aber dann erstellt es einen Oszillator für jedes unserer HRectangles. Also, werfen wir einen Blick auf einige der Eigenschaften, die in Hoscillator gehen, und wieder, dies ist das erste Mal, dass wir es abdecken, weil wir es in einigen der vorherigen Beispiele oben abgeschöpft haben . Mörder. Das erste, was es wissen will, ist, wer zum Teufel bin ich oszillierend. Also, wir erstellen eine neue Instanz eines Hoscillators und wir übergeben ihm unser HDrawable von d. Das zweite, was es wissen will, ist die Eigenschaft, dass es oszilliert. Wir fangen an, ein Muster zu sehen, das dem HTwin sehr ähnlich ist. HTwin wollte wissen, wer ich Partnerschaften bin und was das Eigentum ist. Also, wie Sie in einigen dieser vorherigen Beispiele gesehen haben, ja, können Sie aus Hoscillators stapeln, und solange sie nicht gegen die gleiche Eigenschaft kämpfen, werden sie alle unabhängig arbeiten. Nun, was hier wichtig ist, ist, dass ich in Zeile 33 gesagt habe, dass das, was ich gerne oszillieren möchte, die y-Eigenschaft ist. Das muss bedeuten, dass ich Sachen auf der Y-Achse nach oben und unten bewegen werde. Nun, nachdem Sie die Eigenschaft angegeben haben, will sie wissen: „Nun, was schwinge ich? Was ist der Bereich der Schwingung?“ Also, zum Beispiel, wenn die Eigenschaft h.alpha, der Bereich könnte etwas von 0 bis 255 sein. Es würde also von nicht sichtbar, Null, bis zu voll sichtbar, 255oszillieren bis zu voll sichtbar, 255 und würde diese Schwingung von Null auf 255 fortsetzen. Also schau dir an, was auf dieser Datei passiert, ich habe gesagt, dass ich will, dass es von einem Bereich von 10 bis 50 oszilliert. Nun, es muss ein paar andere Sachen wissen, es muss wissen, wie schnell es gehen sollte. So, wie Schwarm, gibt es eine Geschwindigkeitsvariable, und die andere Sache, die sie wissen will, ist Frequenz. Also werden wir Frequenz ziemlich viel erkunden. Frequenz, ist bei einer langsamen Welle oder ist es eine sehr unberechenbare Welle? Also, in diesem habe ich gesagt, dass die Frequenz auch hat. Nun, diese Datei ist tatsächlich ein Fehler und der Grund, warum es ein Fehler ist, ist, weil ich zum ersten Mal illustriere , was passiert, wenn Sie es eine Eigenschaft von y mit einem Bereich von 10 bis 50 übergeben . Sehen Sie sich an, was passiert, wenn ich den Film teste. Wenn ich die Skizze teste, beginnt sie zu oszillieren, aber Sie werden feststellen, dass das gesamte Kunstwerk gerade an die Spitze der Bühne gesprungen ist. Nun, warum ist das? Nun, der Grund warum ich das getan habe, ist, weil Sie das gesagt haben. Sie sagten, dass Sie diese Reihe von Kunstwerken von einem Bereich von 10 auf dem y zu 50 auf dem y verschieben wollten . Also, obwohl das Rasterlayout eine Startposition der Höhe durch zwei geteilt hat, also im Fall von Beispiel eins, wo es es erstellt hat entlang dieser Horizontlinie tat es das für eine Split-Millisekunde, bis der Oszillator eingetreten ist. Sobald der Oszillator eingetreten ist, sagte er: „Oh ja, cool. Soll ich von einer Y-Achse von 10 zu einer Y-Achse von 50 gehen?“ Plötzlich sprang die ganze Reihe nach oben und fing an, zwischen einem y von 10 und einem y von 50 zu oszillieren. Also, Sie könnten sich vorstellen, dass Sie damit spielen können, wenn Sie sagen der Bereich Null war und der maximale Bereich auf diesem war 640, dann plötzlich würden Sie sehen, dass die Oszillation von oben auf dem Bildschirm bis zum unten auf dem Bildschirm, da Sie absolute Oszillationspositionen angeben, die zwischen Null und 640 liegen. Also, im Fall der vorherigen Datei, der ZIP-Datei, die Sie haben, tut es einen Bereich von 10 bis 50. Also, das stellt ein Problem dar, wo Sie sagen: „Nun, ja. Ich wollte das wirklich nicht, ich wollte, dass es von dieser Horizontlinie oszilliert.“ Nun, anstatt zu versuchen, das herauszufinden, wenn du es auf die harte Art gemacht hast, würdest du sagen: „Okay. Nun, der Bereich ist Höhe geteilt durch zwei minus 100, und dann ist der maximale Bereich etwas wie Höhe geteilt durch zwei plus 100.“ Wenn Sie dann diese Skizze ausgeführt haben, würden Sie bemerken: „Oh, okay. Cool, das wollte ich benutzen, an dieser Horizontlinie beginnen und dann von dieser Horizontlinie oszillieren.“ Dies ist jedoch ein langer Weg, es zu tun und wieder, ich mag es, die Dinge einfach zu machen. Also, ich werde das wegnehmen, zurück zur Reichweite von 10 und einer Reichweite von 50. Nun, dies gilt wirklich nur für, wenn Sie eine Eigenschaft wie x oder y festlegen, dass Sie den nächsten Satz von Trick tun können, der heißt , gehen Sie voran und gehen Sie zu Beispiel drei, und Sie werden feststellen, dass wir bereits in Betracht gezogen haben, dass Sie wahrscheinlich von einer bereits eingestellten Position oszillieren wollen. Sie werden also bemerken, dass es in Zeile 34 einen relativen Wert gibt und dann übergeben Sie ihn, es ist relativer Wert. Also, lasst uns einfach eine Sekunde darüber nachdenken, Layout sagt: „Ich werde das Kunstwerk anhängen, Höhe geteilt durch zwei.“ Also, es fügt es an der Mitte Horizont Linie. Sobald es an den Oszillator kommt, sagst du: „Hey, ich möchte diese Drawables oszillieren, ich möchte die Y-Achse oszillieren, aber tu mir einen Gefallen in dem Kopf, wo das Kunstwerk ursprünglich erschaffen wurde.“ In diesem Fall ist der relative Wert d.y, das ist Höhe geteilt durch zwei, es ist die anfängliche Horizontlinie in der Mitte des Bildschirms. Dann wird Bereich zu einem Bereich außerhalb des relativen Wertes. Also, hier habe ich gerade gesagt: „Mann, wo immer du das angehängt hast, was D.Y ist , mach minus 100 von D.Y und mache positive 100 von D.Y. Also, wieder musst du dir keine Sorgen darum machen wie: „Oh, was soll ich geben, um diese Horizontlinie zu finden? Sie können nur relativen Wert sagen, und wieder, dies ist speziell, wenn Sie mit der X-Achse arbeiten, die Y-Achse, die Z-Achse, relative Wert wahrscheinlich etwas, das Sie verwenden werden. Es verwendet also einen Bereich, der von diesem Basiswert basiert. Also, jetzt, wieder, wenn ich diese Skizze hier ausführe, werden Sie feststellen, dass es sich jetzt um die anfängliche Horizontlinie kümmert , das verwendete Layout, das wiederum Startposition ist, Höhe geteilt durch zwei hier auf Zeile 21. Relativer Wert ist also bewusst, dass es das Kunstwerk in Höhe geteilt durch zwei anbringt. Dann schwingt der Bereich einfach von dieser Basisnummer ab. Hast du es? Gut. Das nächste, was Sie vielleicht bemerken, ist: „Josh, das ist nicht das, was ich erwartet habe, ich dachte, das wäre eine Welle.“ Technisch gesehen ist es eine Welle, aber es wendet eine Welle auf alle Vermögenswerte zur gleichen Zeit an. Also, was wir wahrscheinlich tun wollen, ist ein wenig Offset zu erstellen , so dass sie immer noch die Welle verwenden, aber einfach jedes der HRectangles nur so leicht versetzen , dass wir tatsächlich dieses Wellenmuster erhalten. Also, lassen Sie uns voran und schauen uns Beispiel vier an. Was Beispiel vier tun, ist, diese Idee des aktuellen Schritts einzuführen, also betrachten Sie dies als einen Offset. Was ich tue, ist, zu sagen: „Alles klar, aktuelle Schritt ist der Pool.CurrentIndex.“ Der erste Block übergibt also einen an den aktuellen Schritt, der zweite Block geht an den aktuellen Schritt. Da der aktuelle Schritt also seine eigene eindeutige Nummer erhält, verwenden wir diese eindeutige Zahl als Offset auf der Welle, also ist es wirklich diese Zeile 38 im Beispiel vier, die einfach zur Magie wird. Beobachten Sie, was passiert, wenn wir die Skizze testen. Das ist wahrscheinlich das, was Sie erwartet haben, das heißt, wir verwenden diese Welle, wir verwenden diese Schwingung, aber erst, wenn wir tatsächlich einen Offset der Assets auf dem Bildschirm gesetzt haben , beginnen wir tatsächlich, eine Welle zu bekommen Muster hier. Also, Zeile 38, aktueller Schritt, pool.CurrentIndex. Jetzt, großartig. Fangen wir an, einige Anpassungen vorzunehmen. Also werde ich Skizze vier schließen, und ich werde zur Skizze Nummer fünf übergehen . Das Einzige, was ich in Skizze Nummer 5 geändert habe, ist, dass ich die Frequenz geändert habe, also können Sie hier feststellen, die Geschwindigkeit eins ist und die Frequenz fünf ist. Während in der vorherigen, war die Frequenz zwei. Da die Frequenz niedriger war, war es eine schöne weiche wellenförmige Welle. Wenn ich die Frequenz auf fünf ändere, würde das bedeuten, dass diese Welle viel störender wird, und je höher Sie diese Zahl machen, desto störender wird die Welle. Aber beachte, dass es mit dieser Frequenz scheint, dass es tatsächlich die Bewegung dieser Welle beschleunigt. Also, ich möchte Ihnen einen kleinen Trick zeigen, der heißt, wenn ich eine Geschwindigkeit von eins habe und ich eine bestimmte Frequenz habe, dann fängt ich an, über diese Zeile 38 nachzudenken, diesen aktuellen Schritt. Dieser aktuelle Schritt lässt mich denken, nun, er tritt jedes Mal um eins, also eins ist eins, zwei ist zwei, drei ist drei, vier ist vier, und so weiter. Aber wenn ich die Schritte nur als größere Zahl erhöhen kann, wie würde das diese Welle tatsächlich beeinflussen? Also werde ich voran gehen und das schließen. Ich werde voran gehen und sich Beispiel sechs ansehen, und Beispiel sechs hat die Zeilen 37 und 38 modifiziert. Die Frequenz, die ich tatsächlich auf zwei fiel , weil ich die Bewegung dieser Welle wirklich mochte. Ich wollte nur mehr Wellen in der Bewegung, aber nicht unbedingt die Geschwindigkeit der eingestellten Welle ändern. Also, sieh es dir an. In Zeile 38 habe ich gerade gesagt, anstatt eins zu tun, ist eins, zwei zwei ist zwei, drei ist drei, warum ist der aktuelle Schritt nicht pool.currentIndex mal sechs. Also multipliziere ich tatsächlich eine Zahl auf den aktuellen Index. Auf diese Weise sind die Schritte zwischen jedem der Assets nicht jedes Mal ein einziger Sprung. Wenn ich diese Skizze ausführe, werden Sie feststellen, dass die Geschwindigkeit und die Frequenz tatsächlich das sind, was ich mochte, aber ich habe die Schritte im aktuellen Schritt geändert , so dass es tatsächlich mehr Wellen im Schwingungsmuster zeigt. Ja, cool. Ok. Ich werde dieses Video jetzt schließen, weil ich aus irgendeinem Grund kläglich scheitere. Ich versuche, die kurz zu halten. Also, lasst uns diese einpacken und lasst uns zu den nächsten vier Dateien bewegen , die Beispiel sieben Sinus sein wird, Beispiel acht Quadrat, Beispiel neun Dreieck und Beispiel zehn Säge. 32. Einheit 8, Video 2: Ok. Dieses Video wird wahrscheinlich ein Heck viel kürzer sein, denn ich möchte nur wirklich die vier verschiedenen Arten von Wellen präsentieren, die wir tatsächlich innerhalb des Hype haben. Also, wenn ich Build sieben schnell ausführen würde, werden Sie feststellen, dass standardmäßig jeder Oszillator immer eine Sinuswelle verwendet. Du siehst also, dass du diese wirklich schönen Kurven mit Sinuswelle bekommst. Nun, es gibt ein paar Anpassungen, die ich an dieser Akte vorgenommen habe, die wir an diesen vier vornehmen werden, und das ist, dass ich die Eigenschaft ändere. Also, wenn du hier siehst, ändere ich die H.Höhe. Also, wenn Sie sich erinnern, wenn wir das Kunstwerk über dieses Gitter anhängen, ist jedes der H-Rechtecke 6 Pixel x 6 Pixel und was ich in diesen Dateien oszilliere, ist, dass ich nur die Höhe der Eigenschaft dehne, okay. Also, wenn Sie sich Zeile 33 ansehen, sage ich Eigenschaft H.Height, und wenn Sie dann den Bereich betrachten, muss ich hier keinen relativen Wert verwenden, weil ich ihm nur sagen werde, zu welchen Zahlen ich gehen möchte. Also, in diesem Fall sage ich: „Hey ich möchte, dass der Bereich 6 ist, was Sie ursprünglich richtig erstellt werden, genau hier in Zeile 11,“ hRect 6 Pixel x 6 Pixel, für das H-Rechteck. Hier sage ich, okay, ich möchte, dass der Bereich 6-200 Pixel beträgt. Beachten Sie, dass die Geschwindigkeit 1 die Frequenz ist 3, und wieder, Ich gestaffelte den aktuellen Schritt ein wenig, indem ich pool.CurrentIndex mal 3 sagte. Wenn Sie also Beispiel sieben ausführen, sehen Sie, dass diese schöne Sinuswelle angewendet wird um die Höhe dieses H-Rechtecks zu dehnen. Ok. Nun gibt es wieder vier verfügbare Oszillatoren innerhalb eines Hypes , standardmäßig Sinuswelle. Wenn Sie voran gehen und auf acht springen, können Sie die Wellenform tatsächlich in ein Quadrat ändern. Also, hier habe ich Welle aus einem H.Quadrat und das hier ist seltsam. Das ist eigentlich eine Welle, aber die Welle ist entweder nach unten oder oben, richtig. Es ist keine Sinuswelle, es gibt keine Neigung oder Kurve zu dieser Welle. Es ist immer noch eine Welle, aber wirklich bekommen Sie nur die niedrige Reichweite und die Top-Bereich durch die Verwendung von Quadrat. Also, Sie werden hier bemerken, können Sie Wellenform sagen und dann H.square. Wenn wir zum Beispiel neun springen, werden Sie feststellen, dass wir Wellenform von h.Dreieck haben. Ok. Also, wieder ist es keine Sinuswelle, es sind keine Kurven, aber wir verwenden tatsächlich ein Dreieck nach oben und ein Dreieck nach unten. Also, wieder ist dies eine andere Art von Wellenform, die Sie innerhalb des H-Oszillators verwenden können, ist h.Triangle. Die letzte, die wir haben, ist innerhalb von Beispiel 10, die eine Sägewelle ist. Also, wenn Sie hier auf Zeile 37 schauen, haben wir die Wellenform von H.sah, und wenn Sie voran gehen und diese Skizze ausführen, baut sich die Sägewelle im Grunde auf, bis sie ihren maximalen Bereich erreicht und dann den ganzen Weg hinunter auf seine minimale Reichweite. Das ist also eine Sägewelle. Während ich also diese Samples habe, um Ihnen die verschiedenen Arten von Wellenformen zu zeigen , die innerhalb des H-Oszillators verwendet werden können, ist Sinuswelle die sexiest. Also, eigentlich aus dem Rest dieser Dateien werde ich nur die Standardsinuswelle verwenden , weil es meiner Meinung nach die schönste ist. Ok. Das endet mit diesem Video. Im nächsten Video werden wir die Beispiele 11 bis 15. Wir sehen uns im nächsten Video. 33. Einheit 8, Video 3: Ok. In diesem Video werden wir Beispiele von 11 bis 15. Hier beginnt die Oszillation wirklich einige der Überraschungen visuell zu präsentieren. Wenigste Dinge, die ich anfangs nie erwartet habe, und damit begann unsere lebenslange Liebesaffäre. Schauen wir uns Beispiel 11 an und lassen Sie uns nur einige der Inhalte verdauen, die hier passiert. Erstens, es ist ein bisschen wie eine Abfahrt. Ich habe Objektpool und HDrawablePool und Rasterlayout losgeworden . Ich möchte nur eine for-Schleife verwenden, weil ich eigentlich nur alles in der gleichen genauen Position anbringen werde. Also, lasst uns einfach anfangen, diesen Code hier aufzuschlüsseln. Zuerst habe ich eine for-Schleife, und diese for-Schleife wird 40 Mal laufen, und jedes der 40 Mal werde ich unseren hRect von r1 anhängen. Wenn wir uns r1 ansehen, sage ich: „Hey, du bist ein HRectangle, deine Rundung ist 20, deine Größe ist Startskala.“ Wir kommen in einer Sekunde darauf zurück. Es wird keinen Schlaganfall haben. Die Füllung wird eine zufällige Farbe aus r erhalten HColorPool erscheinen oben. Der Ort wird Breite geteilt durch zwei, Höhe geteilt durch zwei. Also, ich weiß, dass jeder einzelne dieser 48 HRectangles direkt in der Mitte des Bildschirms anhängt. Der Anker Add ist H.CENTER. Auch hier super wichtig, denn in dieser ersten Datei werden wir mit der Drehung für Pivot arbeiten, und Sie werden auch feststellen, dass ich eine Drehung von 45 Grad angebe. Also, anstatt es ein Quadrat ist, wird es 45 Grad drehen und eine Diamantform sein, und H.add (r1) für unser Rechteck. wir uns das Geschäft an und schauen wir uns das Geschäft an, das wir gerade haben. Hier oben, werden Sie auf den Linien vier und fünf bemerken, ich habe eine Startskala von 450 und einen Skala Offset von 10. Erst wenn Sie auf Zeile 37 kommen, sehen Sie, dass StartScale beginnt, nachdem es zum ersten Mal ausgeführt wurde und das erste HRectangle bei 450 für die Größe anhängt, um 10 zu verringern. Also, wenn Sie genau hier schauen, heißt es: „StartScale -= ScaleOffset.“ Also, das bedeutet auf Linie 37, es geht von 450 auf 440, dann auf 430, dann auf 420, dann auf 410. So nimmt die StartScale langsam ab. Nun, Sie werden bemerken, dass ich Hoscillator auskommentiert habe, und das liegt daran, wenn wir diese Skizze tatsächlich ausführen, werden Sie sehen, dass ja, tatsächlich, dass for-loop 40 Dinge angehängt hat, es zufällig eine Farbe im Farbpool ergriffen hat. Es hat das erste bei 450 Pixel für die Breite und Höhe angehängt. Dann ist der nächste bei 440, der nächste bei 430 und so weiter. Jedes Rechteck begann jedes Mal um zehn Pixel zu verringern. Also, jetzt bekommen wir diese wirklich schöne geschnittene Baumstamm Spiral-Sache. Großartig. Jetzt gehen wir weiter und setzen unseren Hoscillator ein. Also, gehen wir einfach weiter und schauen uns unseren Hoscillator an. Ich sagte, dass das Ziel offensichtlich r1 ist. Die Eigenschaft wird H.Rotation sein, und der relative Wert wird 45 Grad sein, das ist die anfängliche Rotation, die wir in Zeile 23 gesetzt haben. Sieh dir die Reichweite an. Der Bereich ist negativ 20 positiv 20. Also, wir hatten dieses Quadrat, es drehte sich um 45 Grad und jetzt dreht es sich negativ 20, positive 20 von diesem anfänglichen 45-Grad-relativen Wert. Sie sollten auch bemerken, dass unsere Geschwindigkeit 0,4 ist, unsere Frequenz ist acht. Also, das ist eine größere Zahl als die vorherigen Dateien, und der aktuelle Schritt ist i. Also, ich bin nur Schritt um eins jedes Mal. Sie bemerken, dass ich unsere ganze Zahl hier oben in der For-Schleife ist. Also, CurrentStep ist Null und dann eins, und dann zwei, und dann drei und dann vier, und so weiter. Also, lassen Sie uns fortfahren und die Skizze ausführen. Sie werden jetzt sehen, dass sich die Schwingung dreht die Rotation dieser HRectangles zwischen negativem 20 und positivem 20. Aber wieder, weil der aktuelle Schritt i ist, sind sie ein wenig versetzt. Du fragst vielleicht: „Whoa, warum hast du nicht so gemocht wie ich mal eine Nummer, wie du es in der vorherigen gemacht hast?“ Nun, wenn ich das tue, wenn ich sage ich mal drei, zum Beispiel, meine Meinung ist, dass die Rotation davon zu störend ist und Sie wirklich verlieren, meiner Meinung nach, die Langsamkeit und die Schönheit, wenn Sie gerade mit i sind. wenn ich sage ich mal drei, zum Beispiel, meine Meinung ist, dass die Rotation davon zu störend ist und Sie wirklich verlieren, meiner Meinung nach, die Langsamkeit und die Schönheit, wenn Sie gerade mit i sind. falsch. Das ist schick, aber ich bevorzuge, für diese spezielle Datei, nur zu tun.Langsam Ihre Rolle Baby, verlangsamen Sie Ihre Rolle. Das ist genau das, was wir tun werden. Bringen Sie das zurück zu i. Jedes Ding tritt nur um eins und wieder, die Bewegung der Schwingung ist genauso elegant. In Ordnung. Lassen Sie uns diese Idee erweitern. Dies ist, wo es einfach wirklich bizarr geht, ist, wenn Sie anfangen, Oszillatoren zu stapeln. Auch wenn sie nicht dasselbe Eigentum bekämpfen, entsteht Magie. Also, lasst uns voran und schauen uns Beispiel 12 an, und am Beispiel 12 habe ich gerade 11 bis 12 kopiert, und dann ist dies die einzige Änderung, die ich vorgenommen habe, was heißt, ich habe einen neuen Hoscillator hinzugefügt, der auch auf r1 abzielt. Aber dieses Mal ist die Eigenschaft maßstabsgetreu. Ich lasse es zwischen 50 Prozent seiner ursprünglichen Größe auf 150 Prozent seiner ursprünglichen Größe skalieren . Denken Sie daran, dass die Skala von der Originalgröße des Kunstwerks abgeleitet wird. Wenn Sie sich erinnern, beginnt die Originalgröße bei 450 und beginnt jedes Mal um zehn zu sinken. Also, wir kümmern uns immer noch um die Größe des Kunstwerks, mit der es erstellt wurde, aber wir skalieren einen Prozentsatz basierend auf der ursprünglichen Größe des Kunstwerks von oben. Großartig. Beachten Sie also von 50 Prozent bis 150 Prozent, dass die Geschwindigkeit immer noch 0,4 ist, die Frequenz acht ist, CurrentStep ist immer noch hoch. Sehen Sie sich jetzt an, was passiert, wenn Sie diese Skizze testen. Wir stapeln zwei Oszillatoren, die offensichtlich zusammen arbeiten. Es beginnt wirklich, diese Art von 3D-Gefühl zu simulieren, aber es ist nicht. Ich meine, wirklich, das ist nur zweidimensionale Kunstwerke. Es gibt immer noch 40 von ihnen nur übereinander gestapelt, aber Oszillation, in diesem speziellen Fall, beginnt wirklich meine Augen zu täuschen, weil es beginnt, 3D zu fühlen, wenn es tatsächlich nicht ist. In Ordnung. Gehen wir zu einer anderen Mutation. Ich möchte diesen Basissatz weiter mutieren. Also gehe ich zu Beispiel 13 und das einzige, was in Beispiel 13 ist, ist ein neuer Hoscillator von HY. Also werde ich die Y-Position unseres HRectangle mit einem Schwingungsbereich von der Y-Achse verschieben . Also, sieh es dir an. Haben Sie eine Eigenschaft, H.Y, der relative Wert ist, ich weiß nicht, wo wurden Sie ursprünglich erstellt? Nun, wo es ursprünglich erstellt wurde, war Höhe geteilt durch zwei. Also, Sie können einfach r1.y sagen, und das wird die Zahl holen, die hier an der Stelle der Höhe geteilt wurde, dividiert durch zwei. Nun, es verwendet das als relativen Bereich. Also, es wird negative 50 von der Mitte oszillieren, und positive 50 von der Mitte. Wieder ist die Geschwindigkeit 0,4, die Frequenz ist acht, und wieder der aktuelle Schritt ist immer noch i. Gehen Sie voran und testen Sie diese Skizze und jetzt haben wir Rotationsskala und Y, wieder, alle oszillierend im Tandem, und Sie können nur sehen, indem Sie anfangen, diese Mutationen zu machen, Mann, der Himmel ist die Grenze. Ich fange an, gut zu denken, wie viele verschiedene Möglichkeiten kann ich dies ändern, um verschiedene Ergebnisse zu erzielen? Für mich ist das Teil der Reise zu versuchen, diese Feinabstimmung herauszufinden, um herauszufinden welche Art von Animationsverhalten sie ästhetisch zu schaffen beginnen. Beachten Sie, dass Geschwindigkeit und Frequenz 0,4 und acht für all diese sind und ich habe das irgendwie absichtlich gemacht. Lassen Sie uns fortfahren zu bauen 14. Build 14, wieder, nur einen neuen Hoscillator, aber dieses Mal, für die X-Achse. Also, ich habe gerade den Y-Oszillator kopiert und in Eigenschaft H.X umbenannt. Natürlich wird der relative Wert r1.x sein, offensichtlich von oben die Breite geteilt durch zwei abruft. Wieder die Mitte des Bildschirms. Auch hier ist der Bereich wie Y negativ 50 und positiv 50 für die Schwingung. Die Geschwindigkeit ist immer noch 0,4, die Frequenz ist immer noch acht, und der aktuelle Schritt ist immer noch i. Also jetzt, wenn ich diese Skizze testen, habe ich jetzt wieder vier Oszillatoren, die alle im Tandem arbeiten. Nun, hier, werden Sie feststellen, dass weil alle vier dieser Oszillatoren die gleiche Geschwindigkeit verwenden, die gleiche Frequenz, die wirklich ein Muster erzeugt. Beachten Sie, dass es von oben links nach unten rechts geht. Es macht diese Animation. Das liegt daran, dass der Oszillator für X und der Oszillator für Y die gleiche Geschwindigkeit und die gleiche Frequenz haben. Also, natürlich, werden sie in Rhythmus fallen, weil sie die gleichen Zahlen verwenden. Also, es ist an diesem Punkt, dass ich über Beispiel 15 sprechen möchte, weil es bei Beispiel 15 darum geht, diesen Rhythmus zu stören. Also, wenn wir dies schließen und zu Beispiel 15 gehen, müssen Sie sich nur ansehen, wie ich einige der Einstellungen geändert habe. Also, schauen Sie sich die Rotation an. Die Rotation wird jetzt größer. Es geht 45 bis 45. Die Geschwindigkeit ist 0,4, die Frequenz ist 10, aber der Schritt ist immer noch i. Scale macht zwei bis acht. Also, es ist anders als das, was Rotation tat, und ich fügte dies ich mal zwei hinzu, so dass die Skala auf der Schwingung unberechener geschieht als zuvor. Schau dir die Y-Schwingung an, sagte ich: „75 bis 75, während das X 50 bis 50 ist.“ Aber schauen Sie sich an, wie Geschwindigkeit 0,5 für das X ist, Geschwindigkeit 0,5 für das Y. Aber unter diesem Y, es sagte, dass die Frequenz fünf ist, aber unter dem X, sagte ich, dass die Frequenz acht ist und dass der aktuelle Schritt i mal zwei war. also alle Zahlen stören, wenn Sie diese Skizze tatsächlich ausführen, fällt es nicht in den Rhythmus. Du wirst eine gewisse Statik bekommen , aber es fällt nicht in die obere linke, oben rechts. Es schleicht sich tatsächlich so herum, und es könnte runterkommen. Das wird also passieren, indem die Zahlen auf jedem Oszillator unterbrochen werden. Also, jetzt ist jeder Oszillator wirklich unabhängig. Auch hier ist es erstaunlich, wie sehr dies etwas simuliert , das dreidimensional aussieht, wenn es nicht der Fall ist. Das ist zweidimensional und ich verwende nur Skala, um Ihre Augen dazu zu bringen, zu denken, dass dies eine 3D-Form ist. Okay, lassen Sie uns die nächste Reihe von Beispielen erkunden. Also werde ich dieses Video schließen und wir werden auf die Beispiele 16 und 17 gehen. 34. Einheit 8, Video 4: Ok. Für dieses Video werden wir uns die Beispiele 16 und 17 ansehen, und 16 und 17 ist, wenn dies beginnt, auf die Art von Dingen anzuspielen, mit denen ich ständig basteln, um verschiedene Ergebnisse zu finden. Also, 16 ist eine Fortsetzung der Dateien, die wir gerade in 11 und 15. Aber ich habe einige Zeit damit verbracht, einige der Variablen zu optimieren. Eins ist, dass wir 100 Dinge auf dem Bildschirm anbringen. Ok. Die Länge oder die Menge der Dinge, die Sie erstellen, wird offensichtlich einen direkten Effekt auf die Schwingung haben. Fügen Sie also mehr und mehr Dinge hinzu, was auf dem Bildschirm angebracht wird. Das wird offensichtlich ändern, was mit der Oszillation passiert. Also, in diesem Fall füge ich hier 100 Dinge auf dem Bildschirm hinzu. Die andere Sache, die auch wichtig ist, ist, dass Anker eine große Rolle bei der Schwingung spielen wird, vor allem, wenn es um Rotation geht, denn schauen wir uns Linie 19 an. Ich sagte, nun, der Anker ist 50. Aber wieder, es ist die negative 50, so dass es nicht Kunstwerk ist. Also, Oszillation geschieht jetzt von diesem Drehpunkt. Also, die Rotation geht jetzt von negativ 180 auf positive 180. Ich habe eine Geschwindigkeit von 1, eine Frequenz von 4. Ich habe eine Schwingung für die Skala, die von 25 Prozent seiner ursprünglichen Größe auf 100 Prozent seiner ursprünglichen Größe mit der Geschwindigkeit von 1 und einer Frequenz von 4 geht , und der aktuelle Schritt ist ich mal 3. Es wird also mehr Impulse in dieser speziellen Schwingung geben. Ich habe einen Oszillator für Y, der viel größer ist als zuvor. Es wird negativ 150 zu positiv 150, und für die X, ich mache auch negative 150 und positive 150. Obwohl beide eine Geschwindigkeit von 0,5 verwendeten, werden Sie feststellen, dass das Y eine Frequenz von 2 verwendet und das X eine Frequenz von 1 verwendet. Also nur durch die Änderung der Frequenzen auf diesen beiden, bedeutet wieder, dass sie aus der Wiederholung fallen. Gehen wir also weiter und führen Sie diese Skizze aus und schauen Sie, wie sich die Ergebnisse geändert haben. Also habe ich die Skala etwas enger gemacht indem ich nur von 25 Prozent auf 100 Prozent gehe. Aber weil ich die Y-Oszillation und die X-Oszillation zu einer viel größeren Zahl gemacht habe, wie negative 150 und positive 150, ist der Bewegungsbereich viel größer. Wieder, weil wir den Ankerpunkt geändert haben, dass negativ 50, Das wirkt sich direkt auf unsere Schwingung für die Rotation , die negativ 180 positiv 180. Es ist diese Art von Experimentieren oder Mutation der Datei, die, was kann ich als nächstes ändern, um was zu produzieren? Also spart ich diese Dateien ab, da so viele Iterationen nur versuchen, diese Art von fantastischen Bewegungen zu entdecken. Wieder, ich liebe es einfach, wie 3D es aussieht, obwohl es nur ein Trick des Auges ist. In Ordnung. Schauen wir uns Build 17 an, denn, wie Sie sich vorstellen, habe ich immer eine Schleife zu Dingen, die wir zuvor gemacht haben. Also, natürlich, ich werde jede Leinwand vorstellen. Also, Sie werden feststellen, dass es eine H-Leinwand gibt, da ist unsere C1, da ist die Ergänzung unserer Leinwand. automatische Löschung wurde auf die Arbeitsfläche verschoben. Es verwendet eine Fade von 2, und wir fügen die Leinwand der Bühne hinzu, Zeile 25. Auch hier wird das Kunstwerk in unsere C1-Leinwand eingebunden. Also, eine weitere kleine Änderung, die ich hier gemacht habe, ist, dass ich ein wenig gefüllt habe, und ich habe diese Farbe bekommen. Also, es bekommt zufällige Farbe von diesem H-Farbpool. Aber ich mache hier einen Samen. Also habe ich ich mal 250 gemacht und es schafft einfach irgendwie dieses interessante Banding. Also, abgesehen davon, sieht es so aus, als hätte ich den Bereich viel mehr weggesprengt. Lasst uns hier nachsehen. Die Drehung beträgt immer noch 180 bis 180. Die Skala ist immer noch 25 bis 100. Aber doch habe ich die breite Palette 300.300 gemacht. Ich habe auch die X-Reihe 300, 300 gemacht. Also, gehen Sie vor und führen Sie diese Datei, und wieder, Sie sollten bemerken, dass es beginnt, diese schöne schöne Farbbanding zu tun , indem Sie einen Seed innerhalb dieses get color call. Es tut diese Art von interessanten Gruppen. Weil ich H-Leinwand und ein Verblassen benutze, brennt dieses Ding langsam aus. Also wieder, ich finde mich einfach ständig Mutationen zu tun, um zu sehen, welche verschiedenen Arten von Mustern und Animationen ich bekomme. Das Spiel, das an diese Art von Dingen befestigt werden kann, ist unendlich. Ich versuche ständig zu entdecken, welche Arten von Ästhetik ich aus etwas genauso Einfaches herausbekommen kann wie das Stapeln von Oszillatoren. In Ordnung. Ich werde dieses Video schließen. Die nächste, wir werden uns nur mit Beispiel 18 beschäftigen. 35. Einheit 8, Video 5: In Ordnung. Dies ist Beispiel 18, und ich dachte wieder Beispiel 18, ich würde einfach versuchen, wirklich kurz und süß zu halten. Es sind einige weitere unerwartete Mutationen. Bis zu diesem Zeitpunkt hatten wir HRect in dieser Oszillation verwendet. Ich wollte nur zeigen, was passieren würde, wenn Sie anfangen, etwas Varianz zu machen. Werfen wir einen Blick auf das, was ich mit Beispiel 18 gemacht habe. Das erste, was Sie bemerken werden, ist, dass HCanvas immer noch da ist, das von früher übernommen wird. Sie werden feststellen, dass die Leinwand ein AutoClear macht (falsch), aber Sie bemerken auch, dass ich kein Fading machen möchte, ich möchte, dass es Spuren hinter sich lässt und diese auf unbestimmte Zeit behält. Nun gehen wir weiter und schauen wir uns unsere Schaffung eines ziehbaren d an, auf Zeile 16 bis 25. Also, in diesem Fall werde ich einen HPath machen. HPath ermöglicht es uns, alle Arten von verschiedenen Dingen zu tun, wie Dreiecke und Polygone und Sterne, und in diesem Fall werde ich HPath verwenden, um eine Sternform zu definieren. Also, wenn Sie hier in Zeile 16 schauen, haben wir HPath d, d ist eine Abkürzung für Drawable. Wieder geben wir einen Stern an, es ist ein fünfzackiger Stern mit einigen Argumenten von 0,4 und einer Rotation von negativem 90. Auch hier ist die Größe der Sterne 200. In der vorherigen Datei bekamen wir zufällig Farben, aber für Füllung, dieses Mal werde ich zufällig Farben erhalten, aber für Strich. Also, hier setze ich die Strichfarbe wieder mit diesem zufälligen Samen, ich mal 250, nur um einige interessante Muster zu bekommen. Die Füllung, Ich werde eigentlich schwarz machen und ich auch den Hintergrund auf schwarz in dieser Skizze als auch. Der AnchoRat ist H.CENTER und wieder seine ursprüngliche Position ist Breite geteilt durch zwei, Höhe dividiert durch zwei. Hinzufügen der Drawable zu unserem Freund HCanvas hier, und hier sind die Schwingungen. Also, wieder, ich staple Oszillatoren wie die vorherige Datei. Also, mal sehen, was wir hier haben, wir haben eine Schwingung für die Rotation, von negativ 180 bis positiv 180, mit einer Geschwindigkeit von eins und einer Frequenz von 0,5. So sieht es so aus, als hätte sich diese Rotation mit einer Frequenz von 0,5 etwas verlangsamt. Wir haben unsere Skalenoszillation, und es sieht so aus, als würde es eine Geschwindigkeit von zwei und eine Frequenz von vier für 25 Prozent seiner ursprünglichen Größe und 100 Prozent seiner ursprünglichen Größe machen zwei und eine Frequenz von vier für 25 Prozent seiner ursprünglichen Größe . Wir haben auch einige X- und Y-Oszillatoren hier und es sieht so aus, als würden beide von negativen 500 auf positive 500 gehen, aber das Y hat eine Geschwindigkeit von eins und eine Frequenz von 0,7, während das X eine Geschwindigkeit von zwei und eine Frequenz von 0,5 hat. Gehen wir also weiter und führen Sie diese Skizze aus, um zu sehen, was passiert. Also, es ist wirklich interessant, die Stoffstruktur, die dadurch entsteht, weil ich einen Stern als Anfangsform verwende, und weil dieser Stern ein bestimmtes Muster hat. Offensichtlich, wie es oszilliert und ich lasse den Rest davon über den Bildschirm laufen, beginnt es tatsächlich wirklich, diese schönen, interessanten Stoffmuster zu erstellen. Also, wieder können wir dies mit SVG-Shapes wie Zeichnung Illustrator oder in diesem Fall mit H.Path abgleichen . Also, wieder bekomme ich, um dieses Video einfach zu halten. Wieder, ich kann das tagelang beobachten, weil ich nur so ein Typ bin. Also werde ich dieses Beispiel 18 schließen, und ich werde zu einem Video übergehen, das nur mit Beispiel 19 funktioniert. 36. Einheit 8, Video 6: Ok. Hier sind wir in Beispiel 19. Beispiel 19, wenn wir ernsthaft nah an dem herankommen, was wir in der ersten Klasse getan haben, dass wir H-Drawable Pool verwenden, verwenden wir ein Rasterlayout. Großartig. Also, zeig mir, wie man Dinge auf Basis eines Rasterlayouts oszilliert. Also, lassen Sie uns einfach das Layout hier aufschlüsseln. Wir haben einen HDrawablePool. Es sieht so aus, als ob ich auf Leitung acht 49 Dinge anhege. Es sieht so aus, als hätte ich hier einen Coloristen, der einige zufällige Farben auswählt, und dann habe ich natürlich ein Rasterlayout. Dieses Rasterlayout erhält einen Start x, ein Starty, einen Abstand und einige Spalten, und die Spalten sind sieben, weil ich ein sieben mal sieben Raster von Assets machen werde, daher 49 Objekte im HDrawablePool. Lassen Sie uns voran und schauen Sie sich das ganz unten hier an, was die Ziehungen ist, nur die H.DrawStage machen. Ja, wir tun Anfrage alle, geben Sie mir bitte das Rasterlayout, sofort alle auf einmal. Dann, wenn Sie hier nach oben scrollen, können Sie sehen, dass ich H-Pfad verwende, um eine Reihe von Sternen randomisieren. Also, ich habe einige Dinge gemacht, wie , in Zeile 27, ich möchte einige Aspekte der Sterne randomisieren. Also, in Zeile 27 sagte ich, nun lasst uns die Kanten randomisieren, mir eine Zahl zwischen fünf und 10 geben, und für eine zufällige Tiefe, gib mir eine Zahl zwischen 0,25 und 0,75. Also, dann erstelle ich diesen H-Pfad und du wirst hier sehen, ich setze den Stern und ich habe ihm die zufälligen Kanten und die zufällige Tiefe zur Verfügung gestellt. Jeder dieser Sterne wird eine Größe von 64 sein, es wird keinen Schlaganfall geben, er ist in der Mitte verankert, und es wird auch eine zufällige Rotation bekommen. So werden Sie feststellen, dass die Drehung um 360 Grad zufällig ist. Nun, Sie könnten in meiner Akte bemerken, ich die Oszillatoren auskommentiert habe, und das liegt daran, dass ich diese Skizze einfach ausführen möchte, damit wir visuell sehen können , was auf dem Bildschirm gezeichnet wird. Großartig. Ein sieben mal sieben Raster von zufälligen Sternen, und wieder in diesem Fall, den Sternen, war es viel einfacher für mich, sie als H-Pfade zu erstellen, aber es gibt keinen Grund, warum dies keine SVG-Assets sein könnte, die Sie in Illustrator erstellt haben, wenn Sie eine Haufen von Sternen wie diesem. Aber weil ich die Sterne randomisieren wollte, war es viel einfacher für mich, es mit Code zu tun, als es in Illustrator zu tun. Also, Grat. Da ist unser Gitter. Ich möchte dieses Gitter oszillieren, aber ich möchte dieses Gitter schwingen. Also, schauen wir uns hier eine kleine Anpassung an. Ich habe tatsächlich 3D zu dieser Datei hinzugefügt. Also, glauben Sie es oder nicht, Beispiel 19 wird einige 3D-Schwingungen verwenden. Beachten Sie also in Zeile vier, ich muss die Verarbeitung angeben, die ich den P3D-Renderer verwenden möchte. Hinweis auf Zeile fünf, Ich habe die Verwendung 3D true hinzugefügt. Auch hier, weil ich einige 3-dimensionale Schwingungen machen möchte. Nun, diese Sterne sind flach. Richtig, und sie hängen einfach so herum, direkt auf uns. Ok. Wenn Sie hier nach unten scrollen, was ich für die Schwingung getan habe, ist es wieder in meiner Datei auskommentiert, weil ich Ihnen diese jeweils zeigen möchte. Alle drei dieser Schwingungen beschäftigen sich mit 3D-Transformationen. Also, lassen Sie uns einfach die untere machen, die wahrscheinlich am sinnvollsten ist, die die Z-Achse oszilliert. Also, wieder wird die z-Achse zu uns kommen und weg von uns, und Sie werden feststellen, dass es eine sehr kleine Reichweite ist. Es wird nur negativ 50 und positiv 50. Die Geschwindigkeit ist zwei, die Frequenz ist eins, aber ich staffle den aktuellen Schritt, indem ich den aktuellen Index mal acht mache. diese Schwingung eingeschaltet ist, werde ich diese Skizze hier ausführen, und Sie sollten sehen, dass wir die Z-Koordinaten der Sterne oszillieren. Also, das ist, worüber ich früher gesprochen habe, wo ich 3D mit Hilfe von Skalierung simulierte. Hier benutze ich überhaupt keine Skala, ich bewege das tatsächlich im dreidimensionalen Raum. Aber das wüsste man nie, weil z der Skala sehr ähnlich aussieht. Richtig. Es kommt nur auf dich zu und weg von dir. Also, schauen wir uns einige dieser anderen Schwingungen an, die ich hier habe. Um sie unabhängig zu betrachten, werde ich das nur noch einmal auskommentieren. Lassen Sie uns diesen Oszillator auskommentieren, der Rotation y ist, und Sie werden feststellen, dass es 45 auf dem Negativ, 45 auf der positiven und Geschwindigkeit, Frequenz und Ströme und so weiter ist 45 auf der positiven und Geschwindigkeit, . Das wird uns diese Bewegung geben. Also werde ich die flachen Objekte auf diese Weise drehen. Sehen Sie sich an, was passiert, wenn ich diese Skizze teste. Ich wende jetzt eine Oszillation auf diesen Drehpunkt an. Richtig. Also, obwohl es immer noch ein flaches zweidimensionales Objekt ist, kann ich dieses zweidimensionale Objekt tatsächlich in dreidimensionalen Koordinaten wie diesen drehen. Ok. Also, ich bekomme eine nette Bewegung wie diese. Auch hier können Sie sich wirklich damit verwirren, wenn Sie negative 180 bis positive 180 machen. Das ist ziemlich urkomisch. Richtig. Weil es den Stern komplett umdrehen wird. Also, du bekommst diese schönen funkelnden Muster, ziemlich lustig. In Ordnung. Lassen Sie uns das auf die Zahlen zurücksetzen, die es war, was negativ 45 und positiv 45 ist. Ich möchte diesen Oszillator kommentieren, und ich werde diesen Oszillator entkommentieren, der Rotation z verwendet. Also, die erste war Rotation y, diese ist Rotation z, und auch ich habe es auf negative 45 positive 45 gesagt, aber eine andere Geschwindigkeit, aber eine ähnliche Frequenz wie die Rotation. Also, gehen wir weiter und schauen uns diese Schwingung an, und bemerken, dass es mir diesen Drehpunkt gibt, sehr ähnlich wie gewöhnliche Rotationen. Also, du hast y, was so ist, du hast x, was so ist, und z gib mir den Drehpunkt auf diese Weise. Nun, die Magie passiert, wenn Sie all diese einschalten. Wenn Sie sie aktivieren, erhalten Sie dunkle Magie, Drehung y, Drehung z und Schwingung auf der z-Achse. In Ordnung. Also, jetzt habe ich mein Gitter, aber jetzt staple ich alle drei dieser Schwingungen, um mir diese Bewegung zu geben. Also, hier ist ein nettes kleines zwicken, indem man Oszillation in einem 3D-Raum verwendet, der nur super Bananen ist. In Ordnung. Schließen wir diese Datei, und wir gehen zur nächsten. Wir werden uns nur auf Beispiel 20 konzentrieren, gute Fortschritte machen. 37. Einheit 8, Video 7: Dieses Video befasst sich mit Beispiel 20. Und du sagst: „Josh Davis, warum redest du immer über SVG? Zeigen Sie uns ein Beispiel, das SVG verwendet.“ Also, Beispiel 20 tut genau das - tatsächlich habe ich diese Datei aus einer Klasse gezogen, die wir in der vorherigen ersten Klasse gemacht - in dem Sinne, dass ich ein Rasterlayout habe und ich einige SVG-Assets randomisieren kann. Also, schauen wir uns Build 20. Die große Änderung hier ist offensichtlich, dass ich eine Reihe von SVG-Shapes hinzufüge. Ich habe eins und sechs auskommentiert, nur zum Teufel. Dieser verwendet nur SVG2, SVG3, SVG4 und SVG5. Also, wenn Sie sich den HDrawablePool anschauen, werden wir 144 SVGs anhängen. Wir haben ein Layout hier und innerhalb des OnCreate, es fügt unsere SVG an, es ist EnableStyle falsch, es tötet den Strich auf der SVG, es wendet eine zufällige 90-Grad-Rotation an und ich bitte es auch , einige zufällige Farben aus unserem oben aufgelisteten HColorPool. Nun, sieh dir das an. Hier habe ich zwei gestapelte Hoscillatoren, und wenn ich diese tatsächlich auskommentiere und einfach diese Datei ausführe, lass uns einfach sehen, was wir hier bekommen. Sie haben sich vielleicht an das aus der ersten Klasse erinnert, in der ich gerade ein Muster erstelle, indem Sie diese SVGs randomisieren. Gerade jetzt werden Sie feststellen, dass in Zeile 36, Ich habe die Größe kommentiert, denn wenn ich tatsächlich die Größe dort einlege, wo ich 50, 100, 150, 200 für die Größe randomisiert , wenn ich das tatsächlich renne, wird es um uns diese Art von zu geben , ja, das ist toll, sieht toll aus. Cool. Ich möchte das in irgendeiner Weise oszillieren. Aber nur zum Teufel werde ich diese Größenposition auskommentieren, damit wir gerade wieder in diesem Raster sind und mal sehen, was passiert, wenn wir dieses Raster oszillieren. Also, gehen wir weiter und machen diese erste Oszillation. Natürlich ist es auf unsere Zeichenkette ausgerichtet, es wendet Rotation an, es geht von negativ 180 auf positive 180. Schau dir die Geschwindigkeit an, 0.05, das ist wirklich schön und langsam, und die Frequenz ist fünf, und beachte, dass der aktuelle Schrittindex nur in Schritten von eins tritt. Also, schauen Sie sich an, was passiert, wenn ich die Skizze hier teste, werden Sie feststellen, dass wir wieder langsam die 180 bis 180 Oszillation über das Raster laufen. Also, wieder, es präsentiert hier ein völlig neues Muster nur durch Anwendung dieser Oszillation. Also, das macht Spaß. Nun, lassen Sie mich diese Oszillation für Skalierung auskommentieren. Also, sieh dir an, was ich hier für die Skalierung getan habe. Ich sagte: „Okay, ich möchte, dass Sie Skala oszillieren, aber ich möchte, dass der Bereich von 100 Prozent auf 500 Prozent reicht.“ Also, das wird ziemlich groß werden. Auch hier ist die Geschwindigkeit 0,05, das ist schön und langsam. Aber die Frequenz ist ein wenig abrupter in dem Sinne, dass wir eine Frequenz von sieben verwenden und der aktuelle Schritt den aktuellen Index mal drei verwendet. Gehen wir weiter und führen Sie diese Datei aus. Wieder, jetzt bekommen wir eine Skalenoszillation in Verbindung mit einer Rotationsschwingung. Dies sind nur Dreiecke, es verwendet buchstäblich nur Dreiecke, SVG, die ich in Illustrator gemacht habe, aber wieder, diese Art von Mix beginnt, diese wirklich eleganten Ergebnisse zu produzieren. Da der Maßstab auf der ursprünglichen Größe von Kunstwerken basiert, werden Sie feststellen, dass das Bildmaterial hier ebenfalls 50 mal 50 beträgt, sodass der Maßstab nur auf jedes dieser Elemente angewendet wird, die 50 mal 50 sind. Wenn Sie die Größeneinstellung auskommentieren, werden die Dinge ein wenig zufällig weil Sie jetzt die Größe der Assets in diesem Raster randomisieren. Das macht Spaß, weil Sie diese Momente von kleineren Formen bekommen , aber dann bekommen Sie diese schönen großen, fegenden Formen, denn das ist das Element des absoluten Zufalls in diesem Stück, das ist das einzige, was im System ist, das wirklich erschütternd in dem Sinne, dass, wenn ich das schließe und es wieder laufe, ich werde etwas anderes zu bekommen. Wenn Sie Zeile 36 auskommentiert haben, werden Sie anfangen, eine Art Ästhetik zu sehen, wo wie durch die Implementierung dieser Randomisierung der Größe ich wie durch die Implementierung dieser Randomisierung der Größejedes Mal etwas anderes bekommen werde. Also, Beispiel 20 zeigt nur, was passiert, wenn wir anfangen, einige unserer SVG-Dateien zu oszillieren. Ich werde das hier schließen. Im nächsten Video werden wir mit Beispiel 21 und Beispiel 22 arbeiten . Wir sehen uns im nächsten Video. 38. Einheit 8, Video 8: Dies ist die Beispiele 21 und 22. Ich hoffe, Sie werden diese nächsten beiden genießen weil ich jetzt wirklich liebe die Zugabe von Experimentieren mit 3D-Objekten. Also, natürlich, Beispiel 21 und 22 werden unsere Freundin HBox verwenden. Also, bevor wir mit vielen verschiedenen Dingen wie hRect und HShape und SVG und HPath experimentieren . Also dachte ich, ich würde mir die Zeit nehmen, um 3D-Drawables zu zeigen. Also, lasst uns weitermachen und sezieren, bauen 21 hier. Also, oben oben, habe ich gesagt, dass die Box-Größe 150 ist und Sie werden unten sehen, wenn wir diese Variable aufrufen, diese Box-Größe wird für die Breite, für die Höhe und die Tiefe verwendet werden . Also, Box-Größe ist 150. Natürlich muss ich Anpassungen an den Linien fünf und sechs vornehmen, um P3D zu verwenden und 3D true zu verwenden. Wir werden 100 Gegenstände zeichnen. Wir werden HBox als Drawable verwenden. Wir haben ein Layout, es ist ein Rasterlayout, es wird bei negativen 125 auf dem x beginnen, negativ 125 auf dem Y, der Abstand wird 100 Pixel zwischen jedem Feld sein, und die Spalten sind 10. Und so, es macht das 10 mal 10 Raster. Wenn Sie voran gehen und sich die onCreate ansehen, hier sind wir die Erstellung unserer HBox und Sie werden feststellen, dass ich gerade eine kleine Verknüpfung gemacht habe, sagte ich, die Tiefe ist Kastengröße, die Breite ist Kastengröße, und die Höhe ist Kastengröße. Ich habe es so ausgedrückt, denn wenn Sie die variable Boxgröße nicht oben verwenden möchten, könnten Sie hier drei separate Zahlen einfügen, um die Größe des Rechtecks tatsächlich zu ändern, wenn Sie keinen perfekten Würfel verwenden möchten. Es wird keinen Schlag auf diesen Kisten geben. Schauen Sie es sich an, ich setze die anfängliche Z-Tiefe der Boxen auf negative 500. Also, ich baue dieses große Gitter, aber dann lasse ich es weit zurück in den Weltraum fallen , negative 500 Pixel. Ich werde die Oszillatoren überspringen, ich werde nach unten gehen und bemerken, dass ich ein paar Punktlichter erstelle. Also richte ich ein paar Lichter in der Szene ein und du siehst, ich habe hier drei Farben; ich habe ein Orange, ein Blaugrün und ein Gelb. Wieder als Auffrischung, ein Punktlicht, möchten die ersten drei Argumente Rot, Grün, Blau wissen, und dann sind die letzten drei Positionen X-Achse, Y-Achse und Z-Achse. Das ist also, wo ich das Licht in den Weltraum stelle. Nun, wenn ich zu den Oszillatoren gehe und diese auskommentiere und wenn ich diese Skizze mache, solltest du sehen, dass ich ein Gitter aus Boxen baue. Es ist nicht nur ein Raster von Boxen, sondern Sie erhalten auch eine Darstellung der Punktlichter. Sie können sehen, dass hier unser orangefarbenes Punktlicht bei negativem 300 ist, hier ist unser blaues Punktlicht ein blaugrün, bei negativem 300, und dann gibt es ein gelbes, das oben auf negativ sitzt , nun eigentlich ist es unten, es ist nicht oben, bei negativ 400, das ist gelb. Nun, in diesem Fall, schauen Sie sich die Oszillatoren hier an, für die Schwingung alles, was ich tue, ist oszillierende Drehung x, Drehung y und Rotation z. Das ist das einzige, was ich hier rotiere. Also, wenn Sie an diese Box denken, sollte es beginnen, diese Bewegung zu machen, weil ich die Box auf drei verschiedenen Achsen oszilliere. Testen Sie diese Skizze und es ist einfach schön. Also, ich baue dieses Gitter von Boxen und ich verwende X-, Y- und Z-Rotationsoszillation, um dieses wirklich schöne Muster mit diesen 3D-Würfeln zu erstellen. Wieder können Sie auf die Zeilen 29, 30 und 31 gehen und tatsächlich die Tiefe, die Breite, die Höhe auf eine beliebige Zahl ändern, die Sie wollen, und Sie werden einige ziemlich überraschende Ergebnisse erhalten. Lassen Sie mich einfach versuchen, einen Test hier, wenn ich sagte, dass die Tiefe der Boxen, Box-Größe mal drei, mal sehen, was das tut. Wer weiß es? Ok. Hoffentlich können Sie die Tiefe der Box-Rate an diesem Punkt sehen, ja. So können Sie beginnen, diese Zahlen anzupassen und wieder werden Sie sehen, etwas anderes hier in dieser Animation. Großartig. Also, das ist Beispiel 21, lassen Sie uns zu Beispiel 22 gehen und dieses war nur ich hatte diese Ahnung, dass es sichauf nur ich hatte diese Ahnung, dass es sich eine bestimmte Weise verhalten würde, aber ich war mir nicht ganz sicher. Ich dachte an den ursprünglichen Film Tron und die Figur in Tron hatte, dass ich denke, es wurde Bit oder Byte oder RAM genannt. Ich kann mich nicht erinnern, es ist so lange her, dass ich den ursprünglichen Tron gesehen habe, aber er hatte diese Form, die nur Ja oder Nein sagte. Ich dachte, wow, ich frage mich, ob ich das gleiche System nehmen und tatsächlich diesen Effekt bekommen könnte ? Eigentlich kannst du das. Also, wenn Sie weiter zu bauen 22, hier ist wirklich die einzige Anpassung, die ist, Ich sagte, dass das Layout sollte bei Breite geteilt durch zwei beginnen, Höhe geteilt durch zwei, aber der Abstand war Null und Null. Also, wenn Sie sich HDrawablePool ansehen, mache ich tatsächlich 50 Boxen alle an der gleichen Stelle, die die Mitte des Bildschirms ist. Also, ich befestige 50 Boxen alle in der Breite geteilt durch zwei, Höhe geteilt durch zwei und wieder sieht es so aus, als ob die Box-Größe hier 500 ist. Ich habe eine Drehung X, eine Drehung Y, eine Drehung Z und dann habe ich einen vierten Oszillator für die Skala hinzugefügt. Also, ich werde mit all 50 dieser Boxen sein, nicht nur werde ich sie alle übereinander drehen, ich werde sie auch schrumpfen und erweitern. Wieder, wenn Sie diese Skizze testen, war das wie eine Ahnung, dass das cool aussehen würde, aber ich hatte keine Ahnung, bis ich es tatsächlich ausprobiert habe. Also wieder, eine weitere Mutation, bei der ich nur eine Reihe von Boxen nehme und sie alle übereinander stapeln, auf Breite geteilt durch zwei, Höhe geteilt durch zwei, und wieder, Sie sehen, ich bekomme diese wirklich schönen Muster in diesem System. In diesem Video werden die Beispiele 21 und 22. Wir werden zum letzten in diesem Abschnitt gehen, der Beispiel 23 ist, das eine Form verwendet, die ich im Illustrator gemacht habe und nur einen kleinen Trick dahinter. Also, wir sehen uns im nächsten Video. 39. Einheit 8, Video 9: Wir haben es geschafft. Wir haben es bis zur letzten Datei auf HoScillator geschafft, aber keineswegs werde ich jeden Oszillator ständig datieren, denn wieder, es könnte mich einfach immer wieder überraschen. Dies ist Beispiel 23. Beispiel 23 hat mich gerade darüber nachdenken, was ich in 3D für jede Box getan hatte , war einige Dinge, die ich tun konnte, dass ich versuchen konnte. Also, dies würde ein SVG verwenden, und wenn Sie tatsächlich in den Data-Ordner gehen und sich die SVG ansehen, ist das alles. Es ist ein Ring. Also, ich habe dieses Kunstwerk in Illustrator gemacht, ich habe diesen Ring gemacht, aber was ich wirklich interessiert war, ist, das Zentrum auszuschlagen. Also, es ist buchstäblich wie ein Ring und der Mittelteil ist tatsächlich transparent, er ist ausgeschlagen. Ich dachte nur, ich frage mich, basierend auf dieser letzten Datei, was, wenn ich ein paar Ringe übereinander setze und was wäre, wenn ich anfangen würde, diese Ringe zu oszillieren, würde ich in der Lage sein, durch diesen Mittelraum zu sehen und in der Lage sein, einige der anderen Ringe unter ihnen zu sehen? Die Antwort ist, dass es erstaunlich ist. Also, schauen wir uns Build 23. Das erste, was ich darauf hinweisen möchte , ist, dass ich diesen Trick gemacht habe, wie wir es früher getan haben, wo wir jedes Rechteck nahmen und wir hatten eine Startgröße und dann hatten wir eine Reihe von Schritten, die nach unten gingen, ich habe das Gleiche hier gemacht mit dem Ring. Also, Sie werden hier oben bemerken, ich habe zwei Variablen, ich habe eine Flöte einer Ringskala 600 und eine ganze Zahl von Ringschritten fünf. Okay, natürlich, ich habe P3D als Renderer und verwende 3D in meinem Hype Setup. Ich werde 153 Ringe anhängen, und wieder, hier benutze ich HShape und ich gehe und bekomme diese ring.svg, und genau wie die letzte Datei ist das Layout Breite geteilt durch zwei, Höhe geteilt durch zwei, kein Abstand. Also, es stapelt alle 150 Ringe übereinander. Aber wie ich es mit dieser vorherigen Datei getan habe, überprüfen Sie es mit der Größe. Ich sagte, die Größe ist RingScale. Also, wir wissen, dass der erste Ring, der erstellt wird, 600 sein wird und wieder ist es hier auf Linie 42, dass ich Ringskala gleich Ringskala minus Ringschritte mache und so beginnt die Ringskala in der Größe zu verringern. Jetzt werde ich die Oszillatoren auskommentieren und schauen, was hier passiert. Ich habe gesagt, dass HShape hier zeichnbar, d. Ich werde den Stil aktivieren, es wird keinen Strich geben, und ich bin zufällig greifen eine Füllung aus unserem HColorPool, und wieder, ich tue, dass ich mal 250, was ein zufälliger Samen ist. Also, es wird dieses interessante Banding zu schaffen. Die Größe ist die Ringskala, der Anker ist die Mitte. Also, das ist irgendwie wichtig, und die z-Achse für diese ist nur Null. Also, ich werde voran gehen und die Skizze hier testen und ich sollte sehen, wie ein Haufen Ringe abnehmen, wenn sie nach unten gehen. Aber wieder, was interessant ist, ist, dass es sich nicht um einen Haufen Kreise handelt, sie sind ein Haufen Ringe mit der Mitte ausgeschlagen. Also, wenn ich anfange, diese zu oszillieren, welche Art von Ergebnissen werde ich bekommen? Also, gehen wir weiter und schauen uns einige dieser Oszillatoren an. Natürlich werde ich zuerst die untere auskommentieren, weil ich eine Oszillation zwischen 50 Prozent und 100 Prozent mache , die Geschwindigkeit ist 0,3, die Frequenz ist fünf. Lassen Sie uns voran gehen und sehen, was es tut, und Sie können sehen, dass es nur eine schöne langsame Schwingung der Skala ist. Ich muss nur alle drei machen, denn warum schlagen Sie nicht mit einer Tonne Ziegelsteinen. Wieder, Drehung x, Drehung y, Drehung z, und der Bereich ist negativ 360 bis positiv 360 für diese. Wenn ich das noch einmal testen möchte, ist das faszinierende daran, SVG zu verwenden und einen Ring zu machen, indem ich die Mitte ausgeschlagen habe, kann ich durch das Knockout des Rings sehen und es beginnt, diese zu erstellen interessante Muster. Also, Sie können sich vorstellen, dass ich wirklich begierig bin, dieses spezielle Beispiel hier zu nehmen und es mit vielen verschiedenen SVGs zur Verfügung zu stellen , um zu sehen, welche Art von verschiedenen visuellen Mustern und Ergebnissen ich bekomme, weil das wirklich Spaß macht. Okay, das schließt den Abschnitt von HoScillator. Wir werden jetzt auf Combos gehen. Combos wird Sie wirklich durch einen Prozess führen. Es wird Sie mit einer Idee, die ich hatte, die Ausführung dieser Idee und beobachten, wie ich sie langsam mutierte. Sie werden auch sehen, dass- es sind 20 Beispiele, also wird es genauso robust wie in diesem Abschnitt sein. Also, wir sehen uns im nächsten Abschnitt von Combos. 40. Einführung in die Kombination von Verhaltensweisen: Bevor wir jetzt in die tatsächliche Ausgabe kommen, wollte ich einen Abschnitt nehmen, in dem ich über Combining Behaviors spreche. Nun, hier beginnen Sie, Superanimationen zu erstellen. Solange ein Animationsverhalten nicht für dieselbe Eigenschaft kämpft, können zwei Verhaltensweisen zusammenarbeiten, um ein völlig neues Verhalten zu erzielen. So kann ich zum Beispiel H Tween verwenden, um etwas auf dem Bildschirm zu bewegen, ich kann H-Oszillator verwenden, um die Skalierung dieses Objekts nach oben und unten zu animieren. Solange also H tween sich mit Position beschäftigt und H Oszillator mit Skalierung beschäftigt, können diese beiden Verhaltensweisen tatsächlich zusammenrasten, um ein neues Superverhalten zu erzeugen. Also dachte ich, ich würde den Abschnitt nehmen, um einige meiner Lieblings-Combos auszuarbeiten, um Verhaltensweisen wieder zusammen zu mischen , solange sie nicht versuchen, für die gleiche Eigenschaft zu kämpfen. Wir können viele dieser Verhaltensweisen verwenden, die wir im Unterricht gelernt haben , um diese neuen verrückten Superanimationen zu erstellen. 41. Einheit 9, Video 1: Okay, also sind wir in diesem letzten Abschnitt, bevor wir tatsächlich anfangen, in die Ausgabe zu kommen. Das hier ist Hardcore. Es wird eine Menge Videos hier drin sein und wir werden alle diese 20 Schritte durcharbeiten , aber es gibt einige Male, wenn ich gehe und Vorträge auf Designkonferenzen gebe , die ich wirklich versuche, den Prozess zu präsentieren. Dies ist das ultimative, das beginnt wirklich mit einer Idee und lässt sich diese Idee entfalten. Anstatt diese separaten Dateien zu sein, Beispiel 1 bis zum Beispiel 20, ist dies eine Fortsetzung einer einzigen Idee. Also nochmal, machen Sie sich eine Tasse Kaffee, ziehen Sie ein paar gemütliche Hausschuhe an, weil wir das wirklich verdauen werden. Nun gehen wir voran und beginnen mit Beispiel 1 und das alles wird mit einem Würfel beginnen. Die Dinge, die wir innerhalb dieses speziellen Beispiels behandeln werden, schließlich werde ich in Hype falten, speziell in HBox. Aber im Moment wollte ich einige Dinge erkunden, die ich noch nie wirklich erforscht hatte und die Beginform und Scheitelpunkt verwendet haben. Was ich tun möchte, ist gerade wirklich die ersten beiden Beispiele zu sezieren. Schauen wir uns auf Zeile eins an. Ich werde eine Schachtel machen und diese Box wird eine Breite von 100, eine Höhe von 100 und eine Tiefe von 100 sein. Und dann habe ich drei Funktionen hier in meiner Skizze. Ich habe unser Setup, ich habe unsere Zeichnung, und ich habe eine Funktion namens Build Cube. Nun schauen wir uns zuerst das Setup an. Die erste ist sehr minimal. Ich sage nur, dass die Größe 640 mal 640 ist. Es wird voran gehen und den P3D-Renderer verwenden und als nächstes werde ich Hypes-Konstruktor feuern. Der Hintergrund wird 20-20-20 sein und natürlich wollen wir alle 3D-Möglichkeiten des Hype aufwachen , also müssen wir sagen, verwenden Sie 3D wahr. Jetzt gehen wir weiter und schauen uns die Auslosung an. Bei der Auslosung werde ich sagen: „Okay, gehen wir weiter und machen H.DrawStage und ich möchte diesen Würfel bauen.“ Jetzt werden Sie auf den Zeilen 12 und 15 bemerken Ich benutze Push-Matrix und Pop-Matrix, die wieder mit Push-Matrix und Pop-Matrix, was auch immer zwischen diesen beiden Matrizenaufrufen ist. Es wird einige Dinge tun und dann wieder auf seine ursprünglichen Einstellungen. Also, schauen wir uns einfach an, was wir tun, und es ist einfach. Die erste ist, ich möchte in die Mitte der Bühne zu übersetzen , so dass Sie bemerken, ich sage übersetzen Breite geteilt durch zwei, Höhe geteilt durch zwei und die Z Ich werde bei Null zu halten. So hat jetzt die Matrix in die Mitte des Bildschirms verschoben. Sie werden dann sehen, dass ich die Build-Cube-Funktion auslösen werde und wenn ich Build-Cube feuere, beachten Sie, dass es keine Argumente übergeben wurde. Hier ist die Build-Cube-Funktion und wenn ich hier nach unten scrollen, ist die gesamte Funktion hier. Sie werden bemerken, dass ich eine Anfangsform in Zeile 19 am Ende einer Endform mache. Nun, was ich mache, ist, einen Würfel manuell zu bauen, indem ich alle verschiedenen Scheitelpunkte einfüge, um jede der Flächen zu definieren. So können Sie hier feststellen, dass, wenn Sie anschauen- Ich habe die Vorderseite so die Vorderseite des Würfels, Ich habe die Rückseite des Würfels, Ich habe den Boden des Würfels, Ich habe die Oberseite des Würfels, Ich habe die rechte Seite des Würfels, und die linke Seite des Würfels. Jeder dieser vier Scheitelpunktaufrufe ist also für jede der Flächen, aus denen dieser besondere Würfel besteht, den wir erstellen. Jetzt sagst du vielleicht selbst: „Nun, Josh, warum benutzt du nicht einfach HBox? Warum machst du es so?“ Nun, ich mache es so, weil HBox noch nicht die Fähigkeit unterstützt, Texturen zu diesem Würfel zuzuordnen. Und das ist wirklich die Idee, die all das ausgelöst hat, war, dass ich in der Lage sein wollte, mit der Idee zu experimentieren Texturen zu einer Box zuzuordnen, und ich hatte nicht einmal wirklich definiert, was zum Teufel eine Textur war. Und Sie werden sehen, wie wir hier vorankommen, dass eine faszinierende Antwort annehmen wird. Schauen wir uns also jeden Scheitelpunkt hier an. Sie werden feststellen, dass ich die Boxgröße für die ersten drei Attribute aufrufe , denn wenn Sie tatsächlich eine Verarbeitungsreferenz für Scheitelpunkt suchen, wenn Sie tatsächlich fünf Argumente übergeben haben, tun Sie die x-Koordinate die y-Koordinate, die z-Koordinate und dann die letzten beiden Zahlen hier sind Unterstützungen für die- die erste ist U und die zweite ist V und diese stellen einen Gleitkommawert dar. Die horizontale Koordinate für das Textur-Mapping ist dieses vierte Argument und das fünfte Argument ist die vertikale Float-Koordinate für Textur-Mapping. Diese beiden hier beschäftigen sich also mit horizontalen und vertikalen Koordinaten für das Textur-Mapping und wie es derzeit existiert, unterstützt HBox keine Textur-Mapping. Es wird in der Zukunft, aber gerade jetzt wieder denke ich an eine Idee und ich möchte es erkunden. Also, was passiert, wenn wir diese spezielle Skizze ausführen? Es gibt wirklich keine Animation, also sollte das interessant sein. Ich gehe voran und führe die Skizze hier und es ist 640 mal 640 und es zeichnet einen Würfel, aber man würde nie wissen, dass es ein Würfel ist, weil dieser Würfel perfekt in der Mitte ist und wieder die Breite, die Höhe und die Tiefe sind alle 100 mal 100, so dass Sie die Dreidimensionalität in diesem speziellen Würfel sehen. Also, ich war gut gut, ich muss das ansprechen. Ich werde Beispiel 1 nehmen, und großartig, ich werde es als Beispiel 2 speichern. Nun gehen wir zu Beispiel 2 und was ich ein Beispiel 2 machen wollte, war die Verwendung von Hoscillator. In diesem ganzen Abschnitt geht es um Combos. Wir werden anfangen, all diese verschiedenen Dinge zu komboieren, um zu einem Endergebnis zu gelangen. Also, ich dachte gut, ich werde einen Oszillator zu diesem Würfel hinzufügen , aber ich entschied, dass ich es auf eine Weise tun würde, die einzigartig wäre, was der Oszillator ist nicht innerhalb einer vier Schleife, es ist nicht in einem ziehbaren Pool. Also, wie erstelle ich Instanzen von Oszillator und hebe sie dann später an diesen Würfel, den ich auf dem Bildschirm erstellt habe? Also, schauen wir uns Beispiel zwei an. Ich habe jetzt oben einen Oszillator für RX, RY und RZ hinzugefügt , der Rotation X, Drehung Y und Drehung Z sein würde . Und so ist mein Ziel, diesen Würfel zu nehmen und ihn mit Hoscillator so herumdrehen zu lassen. Nun, gehen wir weiter und schauen uns die Linien 10 bis 26. Also, in meinem Setup sagte ich, hey, ich möchte diese Oszillatoren einrichten, also sage ich: „RX ist ein neuer HoScillator.“ Es wird von negativ 360 auf positive 360 gehen, 0.1 für die Geschwindigkeit, fünf für die Frequenz. Jetzt habe ich das noch zwei Mal kopiert, damit ich meinen Rotations-Y-Oszillator und meinen Rotations-Z-Oszillator einrichten konnte. Jetzt eine Sache, die Sie bemerken könnten, ist wow, ich habe keine Eigenschaft angegeben und ich habe kein Ziel angegeben, also ist dies ein super generischer Oszillator, der nur im Setup sitzt. Und wenn h.drawstage feuert, wird jeder Oszillator nur einige Schwingungszahlen ausspucken vollständig fehlen, auf wen sie angewendet werden oder die Eigenschaft, auf die sie eingestellt werden. Das sind also nur gänzlich generische Oszillatoren. Sie haben keine Ahnung, wer und sie haben keine Ahnung, auf welche Eigenschaft sie gesetzt werden. Also, schauen wir uns jetzt unseren Build-Cube an. Unser Build-Cube hat sich nicht geändert, also möchte ich Sie nur wissen lassen, dass all dieser Code unten, diese Box, nichts in diesem Code geändert wurde. Also ist die einzige Änderung hier innerhalb der Auslosung. Was ich tun möchte, ist, dass ich die nächsten Rohwerte aus diesem RX, diesem RY und RZ holen möchte . Also innerhalb der Zeichnung sage ich, hey RX Hoscillator geben Sie mir Ihren nächsten Rohwert, weil ich verstehe, dass Sie einige Zahlen völlig abwesend von wem oder zu welcher Eigenschaft oszillieren einige Zahlen völlig abwesend von , aber das ist okay, gib mir einfach diese rohen Zahlen. Also kann ich rx.nextdraw, ry.nextdraw und rz.nextdraw sagen. Jetzt gehen wir weiter und schauen uns unsere Push-Matrix und Pop-Matrix hier an. Die Übersetzung ist immer noch absolut gleich. Nun, ich übersetze in die Mitte der Leinwandbreite geteilt durch zwei, Höhe geteilt durch zwei. Sie können hier in Zeile 43 sehen Ich benutze immer noch gebauten Würfel aber jetzt verwende ich die Verarbeitung X drehen, Y drehen und Z drehen und weil Rotation und Verarbeitung Bogenmaß wissen will, rufe ich die Bogenfunktion und innerhalb von die Bogenfunktion Ich sage, hey go get den aktuellen Wert von RX, gehen Sie den aktuellen Wert von RY, und gehen Sie den aktuellen Wert von RZ zu erhalten. Jetzt passiert etwas Aufregendes. Ich werde meine Skizze testen und Sie sollten sehen, dass dieser Würfel in der Mitte des Bildschirms ist. Ich habe keinen Schlaganfall angegeben. Ich habe keine Füllung angegeben. Es tut also standardmäßig nur schwarzen Strich und standardmäßig weiße Füllung. Aber jetzt habe ich drei Oszillatoren, die oszillierende Werte sind , ohne an ein Ziel oder eine Eigenschaft gebunden zu sein. Also, ich bekomme nur die rohen Zahlen von diesen Schwingungen und wende sie einfach an, um X zu drehen, Y zu drehen und Z drehen. Jetzt werde ich etwas Interessantes. Nun, der Grund, warum ich diese Übung gemacht habe, ist, zu Beispiel 3 zu gehen und eine Textur zu diesem Würfel zugeordnet zu bekommen. Also werde ich voran gehen und dieses Video schließen. Im nächsten Video werden wir abholen, indem wir uns Beispiel 3 ansehen. 42. Einheit 9, Video 2: Beispiel drei. Dieses Video wird nur dieses ein Beispiel zeigen. Es ist der Anfang von etwas Schönem. Sehen wir uns Beispiel drei an, und Sie werden feststellen, dass sich innerhalb des Datenordners einige JPEGs befinden. Also, ich hatte einige Kunstwerke in Illustrator ausgearbeitet. Das sind nur 200 Pixel mal 200 Pixel. Ich habe diese von Illustrator an JPEGs ausgegeben. Also, wenn Sie in den Datenordner schauen, werden Sie feststellen, dass es fünf JPEGs gibt, die nur etwa 45 Grad Linien auf ihnen haben und Textur fünf hat ein Schachbrett, okay? Also möchte ich mir das Mapping einer Textur zu diesem Würfel ansehen. Also, lassen Sie uns voran und schauen, was hier in Beispiel drei hinzugefügt wird. Schauen wir uns Zeile vier an. Jetzt lese ich die Dokumentation der Verarbeitung, und die Dokumentation besagt, dass Sie ein PiMAGE als Textur verwenden können. Also dachte ich: „Okay, lass mich das überprüfen.“ Also, oben tippen wir PiMAGE, und dann habe ich gerade „tex“ für Textur gemacht. Zeile 11 sagte ich: „Okay, T-E-X, tex entspricht Ladebild und dann geh „tex1.jpg“. Die andere Sache, die Sie bei der Verwendung von Texturen auf 3D-Objekten bemerken werden , ist, dass Sie einen Texturmodus festlegen müssen. In diesem Fall habe ich den Texturmodus normal verwendet. Also, in Zeile 12, füge ich Texturmodus normal hinzu. Unsere Oszillatoren sind immer noch dieselben. Unsere Auslosung ist immer noch die gleiche. Also, nichts hat sich innerhalb unserer Auslosung hier geändert. Wir wenden immer noch Oszillation an, um X zu drehen, Y zu drehen und Z zu drehen. Der letzte Zusatz hier ist, ein paar Dinge auf dem Würfel zu setzen. Also, das erste ist, dass ich ein Schlaganfallgewicht in einem Schlaganfall festlegen wollte. Also, Sie werden hier auf dem Würfel bemerken, auf jedem der Scheitelpunkte, die erstellt werden, ich sage, dass die Strichstärke vier ist und dass die Farbe schwarz, Null, Null, Null, Null, Null, Null, Null, Null. Dann, innerhalb der Anfangsform und der Endform, füge ich Textur hinzu und dann zeige ich auf Tex, die wir oben eingerichtet haben. Nun, es ist an diesem Punkt, wenn Sie tatsächlich speichern und diese Skizze ausführen, werden Sie feststellen, dass es tex1.jpg als Textur auf jeder der Oberflächen des Scheitelpunkts verwendet und ich bin einfach verrückt geworden. Ich dachte nur: „Wow, das hat eine ganze Vorstellung von Möglichkeiten eröffnet und ich möchte versuchen, diese Datei zu mutieren und zu sehen, was kann ich mit diesem System machen? Also, zum Beispiel, wenn ich hierher ging und dies in tex5 änderte, wäre das das Schachbrettmuster. Auch wenn ich diese Skizze ausführe, werden Sie sehen, dass es das Schachbrett-JPEG anfügt und es perfekt auf die Oberfläche abbildet. Es ist erstaunlich. Nun, hier in BuildCube, richtig? Ich könnte ein paar Sachen ausprobieren. Ich könnte das kommentieren und ich könnte einfach sagen: „NoStroke“, und wenn ich „NoStroke“ sagte, dann wirst du nicht die schwarze Linie bekommen, du bekommst nur die Textur, aber gegen die Textur, die in Ordnung ist. Wenn ich diesen Schlaganfall zurückbringen und sagen wir, ich wollte, dass dunkle Orange, Ich könnte sagen FF3300, Ich könnte speichern und diese Skizze ausführen. Wieder würde ich nur ein Strichgewicht um diese spezielle Box erstellen, richtig? Also versuche ich diese Tests, um zu sehen, welche verschiedenen Arten von Dingen ich einfallen kann. Nun, ich werde das einfach wieder schwarz machen. Zurück zu Schwarz. ACDC irgendjemand? Zurück zu Schwarz. In Ordnung. Also, hier ist es mit diesem schönen dicken Strich von vier schwarzen. Ich dachte nur, dass eine schöne Art von Schattierung hinzugefügt wurde. Ok. Also, natürlich, ich möchte denken: „Nun, in Ordnung. Was mache ich als Nächstes damit? Also, was ich als nächstes tun möchte, ist dieses Video zu schließen und dann das nächste, wir werden Beispiele vier und fünf abdecken, weil ich nur sehen möchte, wie sich diese Datei weiterentwickeln wird. Lassen Sie uns also voran gehen und schließen Sie dies und wir gehen auf Beispiel vier und Beispiel fünf. 43. Einheit 9, Video 3: Ok. Also, in diesem Video, werden Sie feststellen, dass wir in Beispiel vier und Beispiel fünf sind. Möglicherweise stellen Sie auch fest, dass der Ordner die Buchstaben MOV am Ende des Ordners hat. Denn Neugier musste sehen, ob das möglich war. Ich fing an, über gut nachzudenken, was ist eine Textur? Ist eine Textur ein JPEG? Kann eine Textur ein schneller Film sein? Kann eine Textur etwas anderes sein, das ich normalerweise innerhalb der Verarbeitung wie Schwarm mache, wie kann ich ein Schwarmverhalten als Textur verwenden? Ich fing an, Fragen zu haben, was als Textur zu verwenden war? Also, Sie werden feststellen, dass Beispiel vier und Beispiel fünf behandeln, wie setze ich einen Film als Textur? Nun, schauen wir uns Beispiel vier an und ich werde in den Build-Ordner gehen und ich werde in den Datenordner gehen, und ich habe ein MP4 dort. Wenn ich dieses MP4 laufen würde, würden Sie sehen, dass es ein weiteres kleines Experiment ist, das ich auf Tumblr gepostet hatte. Es ist ein 30-Sekunden-Video von einem kleinen Konfetti platzen. Auch hier war dies etwas, das mit Processing und Hype geschrieben wurde , und ich hatte es als Film gerendert. Ich fragte mich, ob ich das als Textur verwenden könnte? Also, könnte ich den Würfel nehmen und tatsächlich einen Film über die Oberfläche meines Würfels spielen. Natürlich habe ich nach ein paar Graben herausgefunden, dass ja die Antwort tatsächlich Ja war, dass man einen Film als Textur abbilden könnte. Also, schauen wir uns Beispiel vier an und sehen, was sich geändert hat. Sie können also feststellen, dass ich in Zeile drei verarbeiten.video importiere, und der Grund, warum ich verarbeiten.video importiere , ist, weil ich in der Lage sein möchte, in einem Film zu laden, ich möchte in der Lage sein, einen Film zu schleifen, ich möchte in der Lage, einen Film zu spielen. Um das zu tun, muss ich processing.video importieren. Jetzt, in Zeile vier, werden Sie sehen, dass ich anstelle eines P-Bildes einen Film verwende. Ok? Also, ich werde kein JPEG zuordnen. Ich werde einen Film kartieren. Also, natürlich muss tex Zeile vier Movie Tex aktualisieren. Nun, lassen Sie uns voran und schauen Sie sich die Zeilen 12 bis 14 an und Sie werden sehen, dass tex jetzt nicht laden Bild. Laden Sie Bild, arbeiten Sie sich hier Josh, laden Sie Bilder, ja richtig. Also, im Beispiel vier, sage ich, dass tex eigentlich ein neuer Film ist. dann angeben, was MP4 Sie Film verwenden können, benutze ich offensichtlich MP4, weil sie komprimiert und winzig sind, was gut ist. Also, der Film, den ich lade, ist die burst.mp4 innerhalb meines Datenordners. Jetzt sehen Sie in Zeile 13, dass mein Film nur 30 Sekunden lang ist, also möchte ich nur, dass er kontinuierlich läuft. Also, Sie werden in Zeile 13 sehen, ich sage tex.loop. Zeile 14 TextureMode ist eigentlich immer noch normal. Jetzt fangen Sie an, hier nach unten zu scrollen und glauben, dass sich dieser Code nicht geändert hat oder nicht. Sie können immer noch in Zeile 57 sagen, dass die Textur Tex ist, aber Sie müssen eine letzte Sache hinzufügen und das ist Schwanz Verarbeitung tatsächlich beginnen, diesen Film zu spielen. Also, wenn Sie den ganzen Weg nach unten scrollen, werden Sie feststellen, dass es hier eine neue Funktion gibt, die leere MovieEvent Movie m, m.read sagt . Also, im Moment wird das anfangen, unseren Film zu spielen. Nun, gehen wir voran und texten diese Skizze hier und Sie sollten bemerken, dass unser Würfel tatsächlich diesen MP4 auf der Oberfläche jedes der Scheitelpunkts hier spielt. Also, wirklich fasziniert von dieser Idee der Rekursion Recht. Mit Code, um einen Film zu generieren und dann diesen Film zu erstellen, mappe ich als Textur zurück in diesem Code. Dies eröffnet also wieder so viele verschiedene Möglichkeiten, innerhalb der Verarbeitung einige dreidimensionale Objekte zu erstellen und dann verschiedene Dinge als Texturen zuzuordnen. Also, großartig und Beispiel drei, wir wissen, dass wir jede Art von Bild in diese Box laden können. Mit Beispiel vier können wir sehen, dass wir tatsächlich einen Film über diese Box spielen können. Nun, gehen wir weiter und schließen Sie dies und schauen Sie sich nur Beispiel fünf an weil ich gerade eine kleine Anpassung an Beispiel fünf vorgenommen habe. In Beispiel fünf, wenn Sie hier auf den Build-Würfel schauen, Sie vielleicht feststellen, dass ich die Rückseite, untere, obere, rechte und linke Fläche losgeworden bin. Das liegt daran, dass ich nur zeigen wollte , dass es kein dreidimensionales Objekt sein muss, es kann nur eine Ebene sein, in der es spielt. Also, Sie werden bemerken, dass ich gerade den Scheitelpunkt für die Vorderseite gehalten habe und dann habe ich nur einige Zufallszahlen eingefügt, um eine seltsame Form richtig zu machen. Also, anstatt Box-Größe zu machen, können Sie hier sehen, ich habe mal 1,5 mal dreimal fünf oder mal zwei oder durch zwei geteilt. Ich habe nur ein paar gefälschte Zahlen eingegeben. Also, dass ich testen könnte, na ja, was, wenn der Film nicht ein Quadrat ist? Was ist, wenn es eine seltsame Form ist? Sicher genug mit dem Texturmodus normal, können Sie sehen, dass es immer noch einen wirklich großartigen Job macht , diesen Film als Textur zu diesem Scheitelpunkt zuzuordnen , obwohl die Scheitelpunkte, die erstellt werden, nicht perfekt sind Quadrat oder ein perfektes Rechteck. Es ist eigentlich eine seltsame Form so. Ok. Also, ich werde dieses Video jetzt schließen, das wieder Beispiel vier und fünf ist. Wir werden zum Beispiel sechs übergehen weil ich wieder so gut erforschen möchte, was mache ich als nächstes? Was ist das nächste, was ich mit diesem Code ausprobieren möchte? Also, wir sehen uns im nächsten Video. 44. Einheit 9, Video 4: Wir sind im Beispiel sechs, und ich muss ein wenig sichern. Ich dachte nur, okay, in dem Beispiel drei, ich habe ein einzelnes Bild geladen, und ich habe dieses Bild in das Setup geladen. Also, ich sagte nur Tex und ich habe dieses Bild geladen. Dann, in der Auslosung, sagte ich nur: „Hey, benutze dieses Bild auf allen Oberflächen des Würfels.“ Dann dachte ich: „Nun, was ist, wenn ich das zufällig mache.“ Der Würfel hat sechs Flächen. Also, es hat vier Seiten und es hat eine Oberseite und einen Boden. Es gibt also sechs mögliche Oberflächen, auf denen ich Dinge abbilden könnte. In Beispiel drei habe ich nur eine Sache genommen und es allen sechs Oberflächen zugeordnet. Also dachte ich: „Nun, was würde passieren, wenn ich die Bilder, die auf jede der Oberflächen abgebildet werden, zufällig anordnen würde?“ Nun, der Spaß an der Verarbeitung ist, dass Sie eine Einrichtung haben und Sie haben eine Unentschieden. Diese Ziehung wird immer und immer und immer und immer und immer und immer wieder laufen. Ich konnte bei der Auslosung nicht einfach sagen: „Hey, hol dir eine Textur“, denn jedes Mal, wenn das Ding läuft, würde es zufällig eine neue Textur für diese Oberfläche auswählen. Das wollte ich nicht tun. Was ich tun wollte, war nur sechs zufällige Bilder auszuwählen, sich daran zu erinnern und sie dann den sechs verschiedenen Seiten zuzuordnen, und wenn sich das Ding bewegt, hätte es die vorgezogene Textur. Also, das ist das seltsame Stück über die Verarbeitung ist, dass, wenn Sie diese Randomisierung durchführen möchten, was Sie tun müssen, innerhalb des Setups ist, Sie müssen Dinge vorwählen. Speichern Sie, was Sie vorwählen, so dass, wenn die Ziehung läuft, es durch die Dinge, die Prepicked wurden. Du bist bei mir? In Ordnung. Ich habe fünf Texturen, die ich schnappen kann. Also, das erste, was ich tun möchte, ist das Laden in all diesen Texturen zu betrachten. Nun, schauen wir uns zuerst Zeile Nummer fünf an. Zeile Nummer fünf wird eine Liste aller verfügbaren Texturen zur Auswahl sein. Es endet, dass es fünf gibt: Eins, zwei, drei, vier, fünf. Also, in Zeile fünf sage ich: „Array eine Liste. Dies wird eine Textliste sein, die unsere Texturliste ist.“ Jetzt werde ich zu den Zeilen 13 bis 24 überspringen. Sehen wir uns das an. Auf den Zeilen 13 bis 17 lade ich unsere fünf Bilder ein. Also sage ich: „PiMAGE t1, t2, t3, t4, t5. Hey, Mann, hol Text 1. Geh und hol text2. Geh und hol Text3. Geh und hol text4. Geh und hol Text5. Lade die Saugnäpfe rein.“ Jetzt, da ich in die Verarbeitung dieser fünf Bilder geladen habe, möchte ich sie in das Array schieben. Schauen wir uns also die Zeilen 19 bis 24. Zeile 19 sage ich, TexList oben auf Zeile fünf. Ich möchte Sie nur wissen lassen, dass Sie eine neue Array-Liste sind, und ich werde Ihnen jetzt ein paar Sachen schieben. Also sage ich: „TexliXT. Fügen Sie t1 hinzu.“ Also, plötzlich, wenn ich mir den ersten Eintrag in die Textliste anschaue, wird es gleich t1 sein. T1 ist tex1.jpeg. Ich füge dann t2 hinzu und füge t3 hinzu, füge t4 hinzu, so weiter und so weiter. Also, wenn ich das ausschreibe, wenn ich so gehe, würde TexList ungefähr so aussehen, wo es tex1.jpg wäre. Es wäre tex2.jpg. Es wäre also die Liste der fünf Bilder. Also, TexList ist jetzt alle fünf unserer verfügbaren Bilder, die wir gerade geladen haben. Es ist eine Liste von ihnen. Großartig. Also, was will ich jetzt tun? Was ich jetzt tun möchte, ist ein paar zufällige Bilder vorwählen. Bevor ich das schaffe, schauen wir uns Zeile sechs an. Zeile sechs ist ein neues Array von Pimages. Es werden die Bilder sein, die ich vor der Zeit vorgezeichnet habe. Also, schauen wir uns unseren Würfel an. Unser Würfel besteht aus sechs Oberflächen, vier an den Seiten, eine Oberseite und eine Unterseite. Also, was ich tun möchte, ist zufällig sechs Bilder auszuwählen. Es tut mir leid. Ja, wählen Sie nach dem Zufallsprinzip sechs Bilder aus und ordnen Sie sie jedem unserer Oberflächen zu. Also, was ich jetzt tun muss, ist, zufällig aus unseren fünf verfügbaren JPEGs vorauszuwählen. Also, schauen wir uns diese for-Schleife an. Diese for-Schleife muss eine bestimmte Anzahl von Malen ausgeführt werden. Was es ausführen muss, ist pickedTex.length. Für wie viele Artikel wählen wir aus? Was ist die Länge? Die Länge ist, wenn wir uns PickedTex ansehen, die hier in Zeile sechs ist, wir haben hier gesagt, dass es sechs Elemente sind, also wenn ich das hier tatsächlich verfolgen würde, wird es sechs zurückgeben. Also, diese for-Schleife wird sechs Mal laufen. Das ist großartig, weil es sechs Oberflächen gibt. In Ordnung. Also, jetzt ist es diese Zeile hier, die es uns erlaubt, zufällig ein Bild zu bekommen und es zu diesem neuen Array hinzuzufügen. Es steht also: „Okay, das läuft zum sechsten Mal. Ich möchte vorab das erste Bild auswählen, das Sie verwenden werden.“ Also, PickedTex wird es Unterelement Null auswählen. Da steht: „Okay, lass mich auf meine Textliste gehen und mir eine Nummer holen.“ Welche Nummer wollen Sie? Nun, der beste Weg, es zu betrachten, ist, dass dies die Nummer eins auswählen würde. Das würde Nummer zwei auswählen. Das würde Nummer drei auswählen. Das wäre Nummer vier. Das wäre Nummer fünf. Stellen Sie sich einen Moment vor, dass wir einen Hut haben. Wir nehmen fünf Stück Papier. Wir schreiben eins, zwei, drei, vier, fünf darauf, und wir nehmen die Papierstücke und legen sie in den Hut. Dann gebe ich dir den Hut aus und sage: „Hören Sie, dieser Würfel hat sechs Flächen. Bitte wählen Sie eine Nummer aus.“ Sie greifen in den Hut und Sie greifen ein Stück Papier, und Sie ziehen es heraus und Sie gehen T3. T3 ist tex3.jpg. Also für die allererste Oberfläche, die eigentlich die Vorderseite wäre, werde ich tex3 ausgewählt. Jetzt steckst du das Stück Papier wieder in den Hut. Ich schüttele den Hut und sage: „Okay, mach weiter.“ Sie wählen im Grunde sechs Mal eine Nummer aus dem Hut. Also, das ist, was dieser Codeblock genau hier tut. Es heißt, ich möchte zufällig eines dieser fünf Bilder für alle sechs der Oberflächen auswählen. Also, lasst uns hier etwas versuchen. Dieses Video wird lang sein. Ich sage es nur. Josh, warum hast du uns wehgetan? Sieh dir das an. Ich werde einen drucken und gehen Sie voran und drucken PickedTex. Also werde ich das PickedTeX-Array drucken. Nun, ich gehe weiter und führe das aus. Natürlich werden Sie sehen, dass die Animation hier läuft. Ich gehe zur Seite. Ich will mir das hier nur ansehen. Sieh dir das an. Es hat hier eine PiMAGE ausgewählt. Sieht so aus, als ob dem Objekt 2f2a5869 zugewiesen wurde. Es hat 5126db0 ausgewählt. Das ist ein anderes. Also wählte es einen anderen für diesen Service aus. Es hat wieder 512 gepflückt. Es sieht so aus, als hätte es 2f2 ausgewählt. Dieser hat 7cb gepflückt. Ich wünschte, es würde die Zahlen ausspucken, aber das tut es nicht. Der Punkt ist, dass wir zufällig die Papierstücke aus dem Hut ausgewählt haben. Also, das Schöne daran ist, dass diese vier Schleife prägt, welche der fünf Bilder wir auf jede der sechs verschiedenen Oberflächen abbilden werden. Nun, TextureMode (normal), die sich nicht geändert hat. Unser Hoscillator, der sich nicht geändert hat. Unsere PushMatrix Pop-Matrix, die sich nicht geändert hat. Aber jetzt, schauen Sie sich an, wie sich BuildCube geändert hat. Wenn Sie sich beispielsweise Beispiel drei ansehen, hatten wir eine BeginShape und eine EndShape. Zwischen dieser BeginShape und dieser EndShape haben wir all diese verschiedenen Scheitelpunkte für alle verschiedenen Flächen genannt. Aber wenn Sie das tun und dann rufen Sie Textur, es wird Textur, dass ein Bild für alle sechs Oberflächen verwenden. Es ist also nur ein Bild auf alle sechs Oberflächen zuzuordnen. Ich wollte nicht, dass das passiert. Was ich hier geschehen wollte, war, jeder Oberfläche eine andere Textur zuzuordnen. Also, was ich tun muss, ist tatsächlich eine BeginShape und EndShape für jede der einzelnen Gesichter unseres Würfels zu erstellen. Wenn ich für jedes einzelne Gesicht unseres Würfels eine BeginShape und EndShape erstelle, darf ich eine unabhängige Textur für dieses Gesicht nennen. Heiliger Mist, Mann. Es ist wie ein Beispiel sechs zu zeichnen und schon tut mein Gehirn weh. Vertrau mir, es tut mir auch weh. Also, wir sind zusammen dabei. Aber wieder, beachten Sie, dass Update ist, dass ich jetzt eine BeginShape, EndShape, eine unabhängige Textur für jede der Gesichter mache . Also, wenn PickedTex ein Array von jedem der sechs verschiedenen Bilder ist , die wir aus dem Hut ausgewählt haben, könnte ich sagen: „Hey, ich möchte zu diesem Array gehen. Können Sie mir sagen, welches Bild Sie in der Auswahl Null ausgewählt haben?“ Es gibt mir ein Bild. Ich könnte sagen: „Hey, für die Rückseite, kannst du zum Array gehen und mir sagen, welches Bild es für eins ausgewählt hat, was es für zwei ausgesucht hat, was es für drei ausgesucht hat, was hat es für vier ausgewählt und was hat es für fünf gepflückt.“ Denn denken Sie daran, dass die Programmierung die meiste Zeit bei Null beginnt. Also, es sind sechs verschiedene Texturen, Null, eins, zwei, drei, vier, fünf, sechs. Es tut mir leid. Null, eins, zwei, drei, vier, fünf, das wären sechs Elemente im Array. mir bitte nicht weh. Lass uns weitermachen und diese Skizze ausführen. Wieder, wenn ich mich das anschaue, gehe ich: „Wow, okay, das ist cool, denn jetzt baue ich diesen Würfel, aber jetzt bekommt jede Oberfläche zufällig ihr eigenes Bild aus dem Datenordner.“ Also, ich bin cool, ich sehe mein Schachbrett. Es sieht so aus, als hätte es diese wirklich dicke 45-Grad-Linie tatsächlich Haufen Male ausgewählt. Nun, wenn ich das schließe und diese Skizze noch einmal ausführe, würde ich etwas anderes bekommen. Ein paar dicke Linien, einige mittlere Linien, einige dünne Linien und auf diesem habe ich überhaupt kein Schachbrett bekommen. Also wieder, weil ich zufällig die Bilder innerhalb des Setups vorkommissioniere, kann ich dies immer und immer und immer wieder ausführen und ich werde jedes Mal ein anderes einzigartiges Mapping bekommen. Ich dachte nur: „Wow, das sieht wirklich lustig aus.“ Nun, ich weiß, dass diese Datei weh tut, aber es wird jetzt spannend, weil was jetzt passiert, wenn wir anfangen, ein paar dieser Würfel hinzuzufügen, und das war meine nächste Idee, die ist, dass ich keinen Würfel will, Ich möchte einen Haufen von ihnen zeichnen. Also, lassen Sie uns gehen und schließen diese Videodatei und wir gehen auf die nächste gehen, die Beispiele sieben und acht abdecken wird, wo ich diese Idee erforsche, mehrere Würfel zu zeichnen. 45. Einheit 9, Video 5: Hi. Wir sind in Beispiel sieben und ich freue mich, dass Sie keinen Baseball wieder auf Ihren Bildschirmgenommen wieder auf Ihren Bildschirm weil die letzte Datei wirklich einigen von Ihnen Kopfschmerzen bereitet hat. Also, danke, dass du mich zum nächsten Video begleitest. Also, ich möchte ein paar Würfel zeichnen, in Ordnung? Schauen wir uns das Problem an, das wir beheben müssen, das heißt, ich habe diese Leinwand und in den vorherigen Dateien wurde der Würfel genau in der Mitte gezeichnet. Ich wollte ein paar Würfel zeichnen, aber wie wollte ich ihre Positionen zufällig bestimmen? Ich wollte nicht nur ihre Positionen randomisieren, sondern ich wollte sie von diesem Mittelpunkt abgrenzen. Also, es wäre toll, wenn ich sagen könnte: „Hey, ich möchte 10 Boxen machen und ich möchte die Position dieser 10 Boxen zufällig bestimmen, aber ich möchte sie von diesem Mittelpunkt nach dem Zufallsprinzip entfernen.“ Also, es gibt ein Problem, ist, dass ich 10 Boxen zeichnen möchte, aber ich muss zufällig einen Platz für sie auswählen. Ok. Also, schauen wir uns die Zeilen acht und neun an. Jetzt, jedes Mal, wenn Sie einige Randomisierung oder einige Prepick-Szenarien machen, müssen Sie sie im Voraus speichern. Sie müssen sie einrichten, Sie müssen zufällig die Sachen auswählen und einrichten, weil Draw wird auf diese vorgestellten Attribute zugreifen und sie einfach immer und immer wieder verwenden. Sie können in der Ziehung nicht randomisieren. Wenn Sie in der Auslosung zufällig sind, werden sich Ihre Würfel plötzlich überall auf dem Bildschirm bewegen und ich möchte nicht, dass sie es überall auf dem Bildschirm bewegen. Oh, Sie wählen Sqween! Wie spät ist es? Ich bin sicher, es ist um 04:00 Uhr morgens. Gut, ich bin gut, danke. Sie können nicht zufällig in der Auslosung abholen weil plötzlich all diese Dinge würden sich überall bewegen. Ich muss einmal zufällig ihre Positionen im Setup auswählen und sie dann dort bleiben lassen. Also, das war immer das große Rätsel für mich mit der Verarbeitung, ist, dass Unentschieden jedes Mal frisch läuft und Sie können also nicht zufällig Sachen in der Auslosung auswählen, weil sich Sachen bewegen können. Also muss ich meine Randomisierung vorwählen. Also, sieh dir Zeile acht an. Ich weiß, dass ich jetzt 10 Würfel malen möchte, nicht nur einen, ich möchte 10 malen. In diesen zehn möchte ich nach dem Zufallsprinzip einen Standort auswählen. Also, Sie werden feststellen, dass Zeile neun ein schöner Freund P-Vektor ist, richtig? Ein p-Vektor ist ein schönes Koordinatensystem und weil es 3D ist, werde ich ein x, y und z für meinen p-Vektor auswählen . Nun, Zeile neun, ich sage: „Okay, ich muss zunächst zufällig einen Standort auswählen und ihn dann speichern.“ Wie viele Einträge befinden sich in diesem Array? Num-Würfel, 10. Also, Sie werden zehn Würfel zeichnen, ich brauche Sie, um zufällig zehn Standorte auszuwählen. Also, Sie werden feststellen, dass die ausgewählte Position gleich neuen p-Vektor ist und dann die Anzahl der Male, die ich etwas auswählen muss, was in diesem Fall 10 ist. Ehrfürchtig. Also, Zeilen 29-32 , hier wähle ich meine Texturen aus. Es sind jetzt Zeilen 34-41, wo ich meine Positionen randomisieren würde. Sehen wir uns das jetzt an. Diese For-Schleife wird wie oft laufen? Zehn, weil wir 10 Würfel malen wollen. Ok. In Zeile 36 habe ich einen temporären p-Vektor eingerichtet. Also, ich sage, PT for Point ist ein neuer p-Vektor und ich sage: „Hey PT-X sollte gleich Breite geteilt durch zwei sein.“ Also, gehen Sie in die Mitte des Bildschirms, wählen Sie eine Zufallszahl, negativ 200 bis positiv 200. Also, es geht in die Mitte des Bildschirms und es geht zufällig negativ 200 bis positive 200 davon zufällig irgendwo innerhalb dieses Bereichs, und das ist nur für die Breite. P t.y wird genau das gleiche tun, außer dass es Höhe geteilt durch zwei plus zufällige negative 200 bis positive 200 geht , so dass jetzt einen Bereich von Höhe geteilt durch zwei auswählen. Nun, ich möchte das auch auf dem z tun. Also, ich sage, dass die Punkte z-Zahl negativ 100 bis positiv 100 sein sollte, oder? Also, ich wähle einen Bereich zwischen hier aus. Dann sage ich: „Hey, Array, geh weiter und nimm diesen P-Vektor, den ich gerade zufällig eingerichtet habe.“ Okay, jetzt habe ich ein Array von 10 p-Vektoren und wenn ich jeden einzelnen p-Vektor betrachten würde, hätte es ein einzigartiges x, y und z, aber das x, y und z basiert auf dieser Randomisierung der Breite geteilt durch zwei, Höhe geteilt durch zwei. Großartig. Also, jetzt habe ich eine Reihe von 10 zufälligen Orten aus der Mitte des Bildschirms vorgezeichnet. Nun, lassen Sie uns voran und schauen Sie sich unsere Draw-Funktion an, weil unsere Draw-Funktion aktualisiert wurde, anstatt nur eine Push-Matrix, Pop-Matrix-Build Cube, nur einen zu haben. Sieh mal, es ist in einer for-Schleife verschachtelt. Also, jetzt, diese for-Schleife wird wie oft laufen? Zehn Mal. Also, jetzt weiß ich, dass ich Build-Cube feuere. Zehn Mal, okay? Nun, ich werde sagen, großartig, lassen Sie uns auf diese zufällige X-Position übersetzen, diese zufällige Y-Position und diese zufällige Z-Position für einen der Würfel. Es bewegt sich also dorthin, wo sich diese zufällige Position befindet und Sie werden auch bemerken, dass es die Drehung X, die Drehung Y, die Drehung Z-Oszillation einfügt und den Würfel erstellt. Nun läuft die for-Schleife dann ein zweites Mal und fügt den zweiten Würfel an einer zufälligen Position so weiter und so weiter. Die buildcube-Funktion hat sich nicht geändert, sie ist genau das gleiche wie zuvor. Also, wenn wir jetzt diese Skizze ausführen, sollte es 10 Würfel für uns bauen. Sie werden feststellen, dass es im Wesentlichen 10 Kopien desselben Würfels sind. Denn Sie werden feststellen, dass sie alle die gleichen Oberflächen haben. Ich randomisiere nicht jeden der einzelnen Würfel. Offensichtlich konnte ich, aber der Grund, warum ich das nicht angetan habe, ist, weil ich mag, dass Dinge vertraut sind. Wenn ich eine Randomisierung mache oder wenn ich einige zufällige Dinge in meiner Datei passiert, möchte ich einige Dinge, die konsistent sind. Plötzlich können Sie sich das ansehen und sagen: „Oh, es ist im Grunde ein Würfel und die Muster, die 10 Mal kopiert wurden.“ Also, es gibt eine Vertrautheit, weil es die gleichen Muster auf allen 10 dieser Oberflächen recycelt. Nun, wenn ich dieses Dokument schließen und es erneut ausführen würde, würden wir weitere einzigartige 10 Positionen bekommen. Also, ich dachte, Ordnung, das ist lustig. Das Problem, ich würde sagen, dass ich darauf ändern möchte, ist das Rückgängigmachen , dass auf der Z-Achse von negativ 100 auf eine positive 100 übersetzen, aber immer noch die Blöcke sind groß. Ich würde vielleicht gerne eine Varianz auf den Boxen machen. Also, das wird uns verlassen, um zum nächsten Beispiel zu gehen, das ist Beispiel acht. Du wirst im Beispiel acht bemerken, dass ich gesagt habe, oh, Mann, ich muss jetzt zufällig eine Skala auswählen. Lassen Sie mich also die Anweisungen für die zufällige Auswahl einer Skala einrichten. Also, schauen Linien drei bis vier werden zufällig eine Textur auswählen, Zeile sechs wählt zufällig eine Position aus. Ich muss jetzt beginnen, einige Informationen hinzuzufügen, um nach dem Zufallsprinzip eine Skalengröße auszuwählen. Also, ich sagte, in Ordnung, lassen Sie mich eine minimale Skala und eine maximale Skala wählen. Sie können also sehen, dass ich hier zwei Schwimmer erstellt habe. Die minimale Skala ist eine Box, 40 x 40 und die maximale Skala ist eine Box 100 x 100. Also, dann sagte ich: „Okay, lassen Sie mich eine Reihe zufällig ausgewählter Skalen erstellen.“ Also sagte ich: „Okay, es wird ein Schwimmer sein, wird eine Box-Größe sein und es wird auch wie Ort sein, an dem ich zufällig 10 Größen auswähle.“ Also, Box-Größe entspricht neuen Float und ich übergebe es die Zahl, die mit tauben Würfeln verbunden ist, die natürlich 10 ist. Also, innerhalb dieser Vollschleife jetzt, ist die Bearbeitung. Was ist oh, hier ist, wo ich zufällig den Standort auswähle, ich möchte wahrscheinlich eine Skala jetzt zufällig auswählen. Also sage ich: „Okay Kartongröße, ich bin bereit, eine Skala für Sie auszuwählen.“ Also, Sie werden feststellen, dass ich zufällig hier drin habe und zufällig ist für die Min-Skala bis zur maximalen Skalierung arrangieren. Also, jetzt weiß ich, dass jede Box-Größe wird eine Größe zwischen 40, aber nicht niedriger als 40, und eine 100, aber nicht größer als 100 sein. Also, ich kommissioniere jetzt zufällig 10 zufällige Größen, um auf meiner Box zu verwenden. Oszillatoren bleiben unverändert. Meine Vollschleife passt sich immer so leicht an. Denn jetzt, was ich tun muss, ist, wenn ich tatsächlich Würfel baue, muss ich in der Lage sein, auf welche zufällige Größe tatsächlich ausgewählt wurde. Also, schauen wir uns das an. Sie können sehen, dass online 82, Ich sage: „Hey, bauen Würfel. Ich werde Ihnen die Variable I geben.“ Also, ich gleich Null, dann eins, dann zwei, dann drei, dann vier, dann fünf, dann sechs, dann sieben, dann acht und dann neun. Also, ich weiß, dass ich Null bis neun an die buildcube-Funktion übergebe. Nun, wenn Sie auf Zeile 87 kommen, werden Sie sehen, dass ich in BuildCube akzeptiere. Also, BuildCube läuft und BuildCube sagt: „Hey, ich verstehe, dass du mir eine Nummer gibst, sag mir, was diese Nummer ist.“ Diese Zahl wird nur der ganzen Zahl I zugewiesen, nur den gleichen genauen Variablennamen recycelt. Nun, der Grund, warum ich das tue, ist, weil ich gut sage, wenn Sie diesen Würfel bauen, müssen Sie zur Array-Liste BoxSize gehen und auf die erste Größe Null zugreifen. wir so, als hätte er 62 gewählt. Also, jetzt sagt die Box: „Okay, cooles Wort 62 für jedes der Gesichter.“ Dann läuft diese vier Schleife ein zweites Mal, sie übergibt dann BuildCube und Unterelement eins. Man wird an BuildCube übergeben, es geht bis zum BoxSize-Array und sagt: „Hey, was hat es jetzt für die BoxSize gewählt.“ Also, jetzt bin ich randomisiert die Größe der Boxen. Also, wenn ich vorgehe und diese Skizze zu speichern und zu testen, werden Sie jetzt feststellen, dass ich jetzt in der Lage bin, viele einzigartige BoxSize zu werfen. Also, ich bin immer noch randomisiere das Z, aber ich bin jetzt randomisieren die Größen innerhalb dieses Z. Also, jetzt kann ich einige kleinere Boxen bekommen und ich kann ein paar größere Boxen und ich war ziemlich glücklich damit. Wir kommen irgendwohin. Wieder mutieren wir diese Idee langsam und lassen Sie uns sehen, wo wir uns entscheiden, diese als nächstes weiterzuentwickeln. Also, lasst uns weitermachen und dieses Video beenden. Im nächsten Abschnitt werden wir die Beispiele neun bis 11. 46. Einheit 9, Video 6: In diesem Video werden wir die Beispiele 9, 10 und 11. Wieder, das war Teil meiner, Ich frage mich Gesicht. Also dachte ich an Beispiel neun, ich dachte: „Okay, ich habe JPEGs gemappt, ich habe Filmdateien abgebildet.“ Sie werden feststellen, dass im ZIP-Ordner, Beispiel 9, 10 und 11, ein PNG angehängt ist. Ich dachte nur: „Ich frage mich, ob ich ein PNG verwenden kann, weil ein PNG Transparenz unterstützt und ich frage mich, ob sich das auf die Zuordnung zu diesem Satz von Würfeln auswirkt.“ Wenn Sie also zum Beispiel 9.PNG gehen und sich den Datenordner ansehen, gibt es vier PNGs, die ich hier ausgegeben habe. Wo auch immer es weiß war, habe ich tatsächlich transparent gemacht. Also, wenn ich das von Illustrator ausgegeben habe, ist das einzige, was tatsächlich eine Färbung hat, das Schwarz, das Weiß ist tatsächlich transparent. Also dachte ich: „Okay, in Beispiel neun, was passiert, wenn ich gerade diese Änderung hier auf den Zeilen 18 bis 21 vornehme und tatsächlich das Asset von einem JPEG auf ein PNG umgestellt habe?“ Ich dachte: „Was würde passieren, wenn ich einen Würfel hätte und Transparenz hätte, könnte ich die Transparenz der Formen auf den anderen Flächen des Würfels durchsehen ?“ Also mit dem gesagt, lasst uns voran gehen und diese Skizze hier testen und mal sehen, was passiert. Also bauen wir jetzt, ich glaube, ich habe hier in Zeile 6 eine kleine Anpassung vorgenommen. Ich sagte, dass die Anzahl der Würfel eigentlich 20 statt 10 war. Wenn Sie schauen, ja, können Sie tatsächlich durch die Transparenz des PNG sehen und einige der Texturen sehen, die durch die Transparenz sind. Nun, es ist nicht 100 Prozent perfekt, wenn Sie tatsächlich schauen, werden Sie einige Pannen sehen, wo einige der PNGs tatsächlich verschwinden. Aber alles in allem sagte ich: „Oh, wow. Das funktioniert in Ordnung.“ Von da an dachte ich: „Nun, in Ordnung, schauen wir uns einfach etwas an.“ Ich werde hier nach unten scrollen und hier ist diese BuildCube-Funktion. Ich dachte: „Nun, okay, ich baue diese sechs verschiedenen Oberflächen, um diesen Würfel zu machen.“ Dann dachte ich: „Was würde passieren, wenn ich beim Bau des Würfels tatsächlich für jede der sechs Seiten zwei Gesichter erschaffen würde. Es gäbe also zwei Gesichter für die Vorderseite, zwei Gesichter für die Rückseite, zwei Flächen für die Oberseite, zwei Gesichter für die Unterseite und so weiter. Nun, gehen wir voran und schauen uns Beispiel 10 an, weil ich dachte, vielleicht kann ich diese PNG-Transparenz zu meinem Vorteil nutzen, was ist, wenn Sie sich Beispiel 10 ansehen, was ich getan habe, ist, dass ich einen HColorPool eingeführt habe. Linie zwei HColorPool-Farben, genau wie alles andere, genau wie ich einen Standort ausgewählt habe, und genau wie eine Box-Größe werde ich sechs Farben für die Oberfläche des Würfels vorwählen. Auf Zeile 21 können Sie hier sehen, ich habe den HColorPool und einige zufällige Farben darin. Nun, hier ist die Vier-Schleife, in der ich zufällig die Texturen der PNGs auswähle. Neben der Auswahl eines PNG für ein Gesicht dachte ich „Wenn ich zwei Gesichter für eine Oberfläche verwende, werde ich eine Farbe für eine der Oberflächen auswählen und dann ein PNG auswählen, das auf dieser Farbe sitzt.“ Also Zeile 36, ich wähle eine Textur und in Zeile 39, ich wähle eine zufällige Farbe aus. Nun, da der Code lange wird, wenn Sie tatsächlich hier unten in den BuildCube schauen, habe ich alles auf eine Zeile gekürzt , nur so dass es keine enorme Menge an Code war. Nun, hier ist, wo ich zwei Flächen für jede Fläche auswähle. Also auf wie 98 sage ich, lasst uns so tun, als ob wir jetzt nur die Front machen, was wir sind. Zeile 98 sage ich: „Hey, wählen wir die Farbe aus, die wir vorher ausgewählt haben, und lassen Sie uns so tun, als wäre sie orange.“ Es wählt also Orange aus und fügt es an diese Anfangsform, diese Endform und diese Scheitelpunkte an. Das ist alles auf Leitung 99. Dann sage ich in Zeile 100: „Okay, cool. Töten Sie die Füllung“, und in Zeile 101 sage ich: „Cool, lassen Sie uns die nächste Oberfläche genau die gleichen Informationen machen, aber sie sitzt jetzt über dem, der die Farbe hat.“ Also dachte ich: „Das wird großartig sein“, denn es ist wie konzeptionell, es ist ein Würfel in einem Würfel, aber der innere Würfel wählt zufällig Farben, der äußere Würfel enthäutet die Oberfläche mit diesen transparenten PNGs und Da diese transparenten PNGs transparent sind, können Sie durch den äußeren Würfel zum inneren Würfel sehen , der tatsächlich die zufällige Farbauswahl hat , weil ich nur rummache. Wenn Sie diese Skizze ausführen, ist genau das, was passiert ist, dass Sie einen Würfel in einem Würfel haben , weil jede Fläche zwei beginnen in Formen. Die erste, wir wählen zufällig eine Farbe, die zweite ist, dass wir das PNG drauf setzen. Also, Sie suchen tatsächlich durch die Transparenz, um die Farbe auf der inneren Box. Hier sieht es so aus, als hätte es nur ein paar Grautöne und eine Orange gepflückt. Wenn ich diese Skizze tatsächlich noch einmal durchführe, schauen wir mal, ob ich eine bessere Mischung bekommen kann. Nun, sieht so aus, als hätte ich ein paar Grautöne, ich habe ein blaues Blau, und es sieht so aus, als hätte ich auch eine orangefarbene Oberfläche. Also dachte ich, das wäre wie die nächste logische Evolution „Wow, vielleicht kann ich PNGs verwenden, um die Transparenz zu meinen Gunsten zu verwenden , um einen anderen Würfel auf der Innenseite zu betrachten, der eine feste Füllung erhält.“ Wenn du nun wie mein verrücktes Gehirn denkst, findest du vielleicht heraus, was wir auf Build 11 machen werden. Am Beispiel 11 dachte ich: „Ja, ich muss HPixelColorist verwenden.“ Sie werden also innerhalb des Datenordners feststellen, dass es diese color.JPeg gibt und wenn wir uns den Code von Beispiel 11 ansehen, habe ich HColorPool herausgenommen und ich habe HPixelColorist hinzugefügt. Auch hier bleibt dies in Zeile 14 unverändert am Beispiel 11, wir wählen immer noch eine Farbe aus. Zeile 21 haben wir von der Verwendung von HColorPool zu HPixelColorist aktualisiert. Also mal sehen, was wir hier tun müssen , was genau hier auf der 4-Schleife ist, da es den Standort vorwählt, die Skala vorwählt, ich sage auch: „Hey, kannst du mir einen Gefallen tun und die Farbe vorwählen, aber die Farbe, die ich möchte, dass Sie erhalten, ist auf den HPixelColorist zuzugreifen, die Farbe zu erhalten, und ich werde Ihnen diese X-Koordinate und diese Y-Koordinate geben , die pt.x und pt.y ist.“ Nun, wenn Sie sich daran erinnern, ist pt.x und pt.y unsere zufällige Standortauswahl. Also sage ich: „Wählen Sie einen zufälligen Ort, unabhängig von dem Ort, der ist. Schauen Sie sich auch die X- und Y-Koordinate auf dem JPEG an, suchen Sie das Pixel an dieser bestimmten Position und ziehen Sie es in den Würfel.“ Wenn Sie also auf die BuildCube-Funktion kommen, hat sich der Code nicht geändert. Es ist immer noch das gleiche aus Beispiel 10, aber jetzt, wenn ich diese Skizze teste, machen wir diesen Würfel immer noch innerhalb eines Würfelkonzepts, außer dass es die Farbe aus unserer color.JPG stehlt. Also wieder, was für eine gute Möglichkeit, PNG zu unserem Vorteil zu verwenden. Lassen Sie mich das noch einmal ausführen und sehen, ob wir ein paar verschiedene zufällige Skalen bekommen können. Das würde ein bisschen kleiner werden um die Boxen dort. Aber wieder, es Sampling der Farbe von HPixelColorist. Okay, wir werden dieses Video beenden. Als nächstes werden wir nur Zeit für Beispiel 12 verbringen. 47. Einheit 9, Video 7: Großartig. Wir sind jetzt auf Beispiel 12 und was werden wir tun, zum Beispiel 12. Also, ich dachte, ich weiß nicht, ob ich unbedingt die Schwingung jedes einzelnen Würfels mag. Ich dachte, ich frage mich, was passieren würde, wenn ich die Schwingung nehmen und sie auf dem gesamten Cluster von Würfeln verwenden würde. Also, anstatt jeden einzelnen Würfel geben mir Oszillation RotaTex, RotaTey und RotaTez. Was ist, wenn ich diese Oszillation verwende, um den gesamten Cluster von Würfeln zu bewegen? Also, lassen Sie uns voran und schauen Sie uns Zeile sechs unsere NumCubes ist 20, also werden wir zufällig 20 Würfel in diesem Cluster generieren. Vielleicht möchten Sie nur überprüfen, dass auf der Linie 39 bis 41 meine Randomisierung größer ist. Es ist jetzt negativ 300 von der Mitte und positiv 300 von der Mitte für die x-Achse. Negativ 300, positiv 300 für die y-Achse, und auch negativ 300, positiv 300 für die z-Achse. Ok. Unsere Oszillatoren bleiben unverändert. Sie sind hier immer noch die gleichen. Okay, aber was ich getan habe, ist der Push und PopMatrix bearbeitet. Nun, mal sehen, was sich hier geändert hat. In der Tat werde ich zurück zu Build 11 gehen, so dass Sie sehen können , wie wir ursprünglich die PushMatrix, PopMatrix Setup hatten. Es war dabei, auf die zufällige Position zu übersetzen. Es war dann zu tun drehen x, drehen y, drehen Sie z für jeden einzelnen Würfel, bauen Sie den Würfel und dann springt die Einstellungen wieder aus. Ok. Also, 12 übernimmt ein wenig eine andere Rolle in dem Sinne, dass, eigentlich muss ich Ihnen eine andere Sache zeigen, die, wenn Sie sich pt.x, pt.y und pt.z in Build 11 ansehen , daran erinnern, dass dieser zufällige Ort das Zentrum von den Bildschirm zuerst und dann randomisiert von dieser Mitte des Bildschirms. Beachten Sie also, dass die pt.x Breite geteilt durch zwei plus einen zufälligen Bereich, Höhe geteilt durch zwei plus einen zufälligen Bereich, und wieder das z war nur negativ 100, positiv 100. In 12 hoffentlich bemerkten Sie, dass die Breite geteilt durch zwei ist verschwunden und die Höhe geteilt durch zwei verschwunden ist. Ok. Nun, der Grund dafür ist der ausgewählte Ort. Ich wollte nur eine Zufallszahl basierend auf einer Minute und einem Max auswählen, und wieder ist die min und das max hier nur negativ 300, positiv 300. Also, okay, schauen wir uns diese PushMatrix und PopMatrix an. Ok. Zeile 75 sagt: „Hey, bewegen wir uns in die Mittelposition“, also bedeutet es die Breite geteilt durch zwei Höhe geteilt durch zwei. Also, bewegen Sie sich in die Mitte und dann sagt es in Ordnung: „Lassen Sie uns RotateX, RotateY und RotaTez nicht in der for-Schleife machen“, es tut es außerhalb der for-Schleife und weil es es außerhalb der for-Schleife tut, wird es die Übersetzung von RotaTex, RotaTey, RotaTez in die gesamte Umgebung. Ok. Also übersetzt es RotaTex, RotateY, RotaTez, dann kommt es zur for-Schleife, die in diesem Fall 20 Mal läuft . Die for-Schleife läuft 20 mal, sie legt die Würfel an und sagt: „Ja, aber diese Würfel müssen sich zufällig auf dem x bewegen, zufällig auf dem y und zufällig auf dem z.“ Ok. Also haben wir einen neuen verschachtelten Push und Pomatrix, der sich mit dem einzelnen Würfel befasst, und dieser einzelne Würfel sagt: „Okay. Ich kann negativ 300, positive 300, negative 300, positive 300, negative 300, negative 300, positive 300, so weiter, und so weiter. Ok. Dann baut es den Würfel. Also, indem Sie die RotateX, Y und Z aus der for-Schleife bewegen und sie in einen ersten ersten Push und PopMatrix setzen, dann innerhalb der for-Schleife laufen und einen anderen individuellen Push und PopMatrix für jeden einzelnen Würfel machen , Das bedeutet jetzt, dass wir die H-Oszillationen verwenden, um alle 20 Würfel gleichzeitig zu bewegen. In Ordnung. Also, alles andere unten bleibt unverändert. Sie können feststellen, dass nur Build 10 und Build 11 die transparenten PNGs verwenden, die tatsächlich zu den JPEGs in dieser Datei zurückgegangen sind. Also, ich benutze nicht die transparenten PNGs, und ich mache die Box nicht in einer Box Sache. Das war nur auf den Akten 10 und 11. Also, ich habe das hier in Build 12 weggenommen. In Build 12 baue ich nur meine Box und befestige zufällige Texturen an jeder der Oberflächen. In Ordnung. Also, gehen wir weiter und führen diese spezielle Skizze und was Sie sehen sollten ist, dass ich jetzt die Schwingung verwende, ich drehe nicht jeden einzelnen Würfel, ich drehe jetzt die gesamte Masse. Ich dachte nur: „Wow, okay, das ist ziemlich erstaunlich.“ Das habe ich wirklich genossen. Also, ich werde voran gehen und ich werde dieses Video kurz halten. Im nächsten Video werde ich zu den Beispielen 13 und 14 gehen, weil eine andere Idee trifft mich, die die Art und Weise, wie dies ästhetisch aussieht, voranbringen könnte. Also, die Sache, die ich möchte, dass Sie jetzt bemerken, ist, dass wir die gesamte Auswahl von 20 Würfeln drehen, aber beachten Sie, dass alle Würfel nicht gedreht sind. Also, sie sind alle im Grunde in die gleiche Richtung. Also dachte ich, ich muss das randomisieren. Also, lassen Sie uns dieses Video schließen und gehen Sie zu den Beispielen 13 und 14 über. 48. Einheit 9, Video 8: Wir sind jetzt in den Beispielen 13 und 14. Also, im Moment bin ich in Beispiel 13 und ich dachte wieder, ich muss dieses Problem der Rotation ansprechen, die Tatsache, dass alle 20 der Würfel die gleiche Nicht-Rotation geteilt haben. Also, wie Sie sich vorstellen, wenn ich will, um die Würfel zufällig drehen, zumindest fest, und dann drehen Sie den gesamten Cluster, Ich habe eine Pre-Pick zufällige Rotationen. Also, gehen wir weiter und schauen hier auf Linie 13. Ich wähle zufällig eine Textur aus. Ich wähle nach dem Zufallsprinzip einen Standort aus. Ich wähle nach dem Zufallsprinzip eine Größe basierend auf einer Minute und einem Maximum aus. Wenn Sie etwas nach dem Zufallsprinzip drehen möchten, müssen Sie eine ausgewählte zufällige Rotation vorwählen. Also, ich erstelle hier einen Pvector namens PickedRotation, und es ist auch NumCubes, was bedeutet, dass es 20 vorausgewählte Rotationen haben wird. In Ordnung. Schauen wir uns also die Zeilen 49 bis 51. Was ich vorwählen möchte, ist eine X-, Y- und Z-Rotation für jeden Würfel. Also mache ich nicht nur eine Rotation. Ich mache Rotation aller drei Ebenen: eine X-Drehung, eine Y-Drehung und eine Z-Drehung. Also, in Zeile 50, sage ich: „Okay. Nun, ich will einen Pvector. Ich werde diesen Pvector pr für gepflückte Rotation nennen“, und ich werde sagen: „Okay. Für das X, mach Integer random 360", was mir eine Zahl zwischen Null und 360 geben wird, „und für das Y, gib mir eine zufällige 360, und für das Z, gib mir eine zufällige 360.“ Sobald Sie diese drei Rotationen zufällig ausgewählt haben, nehmen Sie diesen Pvector und speichern Sie ihn in unserer Array-Liste der ausgewählten Rotationen. Also, jetzt auf den Zeilen 49 bis 51, haben wir zufällig eine Drehung für den Würfel ausgewählt. Jetzt gehst du hier runter, und hier ist unser Push und unsere Pop-Matrix. Nun, wieder, Zeilen 81 bis 84, das betrifft den gesamten Cluster, und dann werden Sie sehen, dass es die Hinzufügung von Zeilen 90 bis 92 ist, wo ich sage: „Okay, Sie wählen jetzt einzelne Würfel, übersetzen zufällige X, zufällige Y, zufällige Z. Auch drehen Sie, um Ihre zufällige Drehung X, drehen Sie Y, und drehen Sie Z.“ Also, jetzt wählt jeder Würfel seine, Ich gebe zu, was ich für die Drehung für die Drehung X vorgewählt habe, drehen Y, und drehen Z. Stellar, nichts anderes ist anders. Build Cube ist immer noch der gleiche. Sehen Sie sich nun an, wie gerade diese vorgewählte zufällige Rotation implementiert wird, sehen Sie sich an, wie sie den Cluster ändert. Also, ich werde weitermachen und diese Skizze machen. Sie werden jetzt feststellen, dass die Anordnung der Blöcke viel interessanter ist, weil sie jetzt nicht alle die gleichen Nicht-Rotation sind. Nun, sie sind alle eine andere Rotation, aber dann verschiebe ich sie alle als Cluster und nur ästhetisch dachte ich: „Wow! Das ist optisch viel interessanter. Lassen Sie mich einfach die Skizze noch einmal ausführen, um zu sehen, welche Art von zufälliger Einrichtung ich bekomme.“ Wieder, jetzt erschaffe ich diese wirklich schöne Gruppe von Würfeln, aber die Tatsache, dass sie zufällig drehen , bedeutet, dass einige in einige der anderen klopfen, und ich dachte nur: „Wow! Das sieht ziemlich gut aus.“ Auch hier verwende ich Oszillation, um den Cluster als Ganzes zu verschieben. Also, ich sitze eine Weile mit diesem Kerl, und dann dachte ich was passieren würde, wenn ich die einzelnen Würfel wieder drehen würde. Also, es brachte mich einfach zu denken: „Na ja, okay. Ich könnte einen Oszillator haben, der den ganzen Cluster oszilliert. Aber was wäre, wenn sich die einzelnen Würfel selbst einschalteten , während der Oszillator den Cluster als Ganzes bewegte?“ Aber ich war mir nicht sicher, ob ich einen ganz neuen Satz von Oszillatoren kreieren wollte. Also dachte ich: „Lass mich das in einem Build 14 speichern und etwas ausprobieren.“ Gehen wir also weiter und fahren mit Build 14 fort. Build 14 ist fast identisch mit Build 13, aber ich habe einen kleinen kleinen Trick innerhalb dieser Skizze implementiert, und dieser Trick befindet sich innerhalb der Zeichenfunktion. Das ist alles, was ich getan habe, war diese kleine Bearbeitung hier. Ich sagte nur: „Was würde passieren, wenn nur innerhalb der Drehung X und Y drehen, was wäre, wenn ich den FrameCount des Films subtrahiere?“ FrameCount zählt immer eins, zwei, drei, vier, fünf, sechs. Sobald Sie Ihren Film starten, wird FrameCount immer ausgeführt. Ich dachte: „Nun, was ist, wenn ich X minus FrameCount rotiere und was wäre, wenn ich Y plus FrameCount gedreht habe?“ Also, ich erschaffe keine ganz neuen Schwingungen. Ich passe nur diese Drehung X und Y minus oder plus was auch immer der FrameCount des Films ist. Wieder war ich mir nicht ganz sicher, was das tun würde, bis ich die Skizze ausgeführt habe. Sobald ich die Skizze lief, war ich ziemlich glücklich. Nun könnten Sie einen ganzen neuen Satz von Oszillatoren erstellen, wenn Sie wollen. Wir könnten einen sekundären Satz von Oszillation für jeden einzelnen Würfel anwenden, und dann die Haupt-Oszillation, die den Haupt-Cluster macht. Aber ich dachte, visuell, dies minus FrameCount und plus FrameCount das Problem angesprochen hat ohne eine ganze Reihe von neuen Code zu schreiben. Also dachte ich: „Wow! Das ist wirklich schön.“ Wieder, ich kann das immer und immer wieder laufen, und wir werden anders. Da gehen wir. Also, jetzt habe ich ein paar kleinere Würfel gepflückt. Sie haben also die Haupt-Oszillation, die dieses Ding langsam dreht, und die FrameCount dreht jede der einzelnen Boxen. Nun, eine Sache, die Sie jetzt denken sollten, ist: „Oh mein Gott! Vielleicht bin ich neu in der Verarbeitung, und ein Großteil dieses Codes ist jetzt einfach zu viel, zu schnell geworden.“ Unabhängig davon kann ich nach oben gehen, und ich merke, dass ich JPEGs dieser Umgebung zuordne. Also, ich kann in Photoshop oder Illustrator springen, einige neue Assets erstellen, und ich kann sie tatsächlich dieser Umgebung zuordnen und sehen, welche Art von Mustern ich bekomme. Also kannst du mein Kunstwerk gegen etwas anderes austauschen. Also, ich schaue mir das an, und ich denke nur, dass das großartig ist. Ich hatte eine wirklich gute Erfahrung mit diesem System. Es produziert etwas, das irgendwie interessant ist. Aber im Hinterkopf habe ich mich immer noch gefragt, was eine Textur definiert, und dieser Abschnitt wird Combos genannt. Ich dachte, wie könnte ich dieses erstaunliche Ding hier mitnehmen und es mit etwas anderem kombinieren, das wir bereits in dieser Klasse behandelt haben. Also, das erste, was mir in den Sinn kam, war, was würde passieren, wenn ich ein Schwarmverhalten mache und das Schwarmverhalten auf die Oberfläche jedes Würfels abbilden würde? Wäre das überhaupt möglich? Also, was wir jetzt tun werden ist, ich habe hier eine kleine Notiz geschrieben, die heißt, eine Pause zu machen. Also machen wir eine Pause. Wir sind bis zu Beispiel 14, aber ich möchte diesen Code stoppen, den wir getan haben, und ich möchte eine kleine Nebendatei erstellen und illustrieren, was wir in dieser Seitendatei tun, und dann nehmen Sie diese Seitendatei und fügen Sie sie in das, was wir jetzt sehen. Also, wie kann ich an einem Schwarm arbeiten , den ich schließlich auf die Oberfläche dieser Cube-Animation abbilden werde? Spannendes Zeug. Lassen Sie uns dieses Video beenden, und wir sehen uns im nächsten. Eine kleine Pause. Umzug in Beispiel 50. 49. Einheit 9, Video 9: Ok. Wir machen eine Pause. Diese Datei ist eine Pause, ein bisschen eine Pause, weil ich mich in meinem Kopf frage, kann ich HCanvas für eine Textur verwenden? Könnte HCanvas der Oberfläche des Würfels zugeordnet werden? Ich habe JPEGs Mapping, ich habe PNGs Mapping, ich habe QuickTime Movies Mapping. Warum konnte ich diesem Würfel keinen HCanvas zuordnen? Ich denke, wir können es tun. Also, ich dachte, nun, okay, lasst uns hier eine Pause machen, schauen wir uns die Akte 15 an. Datei 15, Beispiel 15, Sie werden feststellen, dass es Schwarm sagt und das liegt daran, dass ich ein Schwarm Verhalten machen möchte. Nun, wenn ich mir Beispiel 15 anschaue und den Datenordner anschaue, habe ich hier unseren guten Freund color.jpg. Also, ich dachte okay, ich werde diese Farbinformationen für meinen Schwarm verwenden. Schauen wir uns das an. Ich habe einen HCanvas, HPixelColorist, ich habe HSwarm, ich habe HDrawablePool und ich habe einen HTimer. Also, wir werden all diese Dinge auf einem HCanvas kombinieren , weil ich im Hinterkopf denke, ich werde eine HCanvas auf der Oberfläche des Würfels verwenden. Beachten Sie die Größe meines Films, es ist 1280 mal 640. Nun, ich habe das mit Absicht getan, damit ich, wenn wir diese Datei ausführen, demonstrieren kann, was visuell passiert. 1280 ist 640 mal zwei. Zeile 12 erstelle ich eine Instanz von HPixelColorist und ich sage, gehen Sie unsere color.jpg. Ich möchte Sie nur wissen lassen, dass wir es auf die FillOnly anwenden werden. Nun, schauen Sie sich die Zeilen 14 bis 16 an, ich erstelle eine HCanvas, aber merke die Änderung. Die Änderung hier ist, dass, wenn Sie kein Argument innerhalb von HCanvas angeben , es nur die Breite und die Höhe übernimmt. Ich möchte einen HCanvas machen, der nur 640 mal 640 ist, also sage ich in Zeile 14, c1 ist ein neuer HCanvas, 640 Pixel bei 640 Pixeln, AutoClear ist falsch und das Fade ist eins, also werden wir diesen langsamen Brennen bekommen. Dann ignoriere Zeile 15, tu so, als würdest du sie nicht einmal sehen. Zeile 16, H.add (c1). In Zeile 18 füge ich das Bild von color.jpg hinzu, und ich setze seine Position auf eine x-Achse von 640 und gerade jetzt spreche ich durch den Code, aber wenn wir ihn ausführen, wirst du sagen: „Oh, okay, ich bekomme, was er tut.“ Ich erstelle einen HDrawablePool und wir werden 20 davon zeichnen. Wir werden dieses Zeug in unsere c1 Canvas überziehen, also malen wir unsere HRectangles in c1. Wir haben einen OnCreate, beachten Sie, dass es kein RequestAll gibt und es keinen RequestAll gibt, da wir einen Timer verwenden, um jedes der Elemente alle 250 Millisekunden an unseren Swarm anzuhängen. Nun, in unserem OnCreate, habe ich das Zeug, das wir in einer früheren Datei von Swarm gemacht hatten , dass es wie Feuerwerk war, sie haben an verschiedenen Positionen geschossen. Ich möchte das in diesem verwenden. Also, ich mache Float-Rotation = random (TWO_PI), die Größe des Drawable hier ist 100 Pixel mal zwei Pixel, es gibt keinen Strich. Die Location ist 320 auf dem X und 320 auf dem Y. Also wieder, wenn unser ganzer Film 1280 mal 64 ist dann mache ich nur den Schwarm-Punkt auf der linken Seite des Bildschirms, 320 mal 320. Ich gehe voran und setze das Zeug ein, das ich in den vorherigen Schwarm gelegt habe, wo ich die Rotation Bogenmaß zu Rotation und Bewegung, Cosinus-Rotation mal 10 und Sinus-Rotation mal 10 und der AnchorAt ist in H.Mitte. Ich mache auch die colors.applyColor von einem HPixelColorist, der Farbe aus color.jpg zieht. Böse. Jetzt erstelle ich einen HSwarm und füge D zu diesem HSwarm hinzu und ich sage: „Hey, hier sind die Eigenschaften, die ich dir wünschen soll.“ Das Ziel, das Sie versuchen zu erreichen, ist 320 mal 320, was zufällig auch der Geburtspunkt ist, Ihre Geschwindigkeit ist 15, Ihre Turnease ist 0,02 und Ihr Zucken ist fünf. Nun, hier unten unten habe ich eine kleine Vier-Schleife und ich sage, lasst uns alle Assets im Pool durchlaufen und ihre Farbe von HPixel-Farben aktualisieren. Wenn der Schwarm sich zu bewegen beginnt, aktualisiert er die Farbe, während er sich über diese color.jpeg bewegt. Also, lassen Sie uns diese Skizze testen und sehen, was ich hier zu veranschaulichen versuche. Cool. Also, der Grund, warum ich diese Datei so erstellt habe, ist, dass auf der rechten Seite, Sie nur die color.jpg sehen können und ich sage: „Schauen Sie, ich lade in diese color.jpg und ich verwende seine Farbinformationen, um den Schwarm zu aktualisieren, den Sie auf der linken Seite sehen. Nun, der Schwarm, den du auf der linken Seite siehst, wirst du bemerken, dass es tatsächlich ein HCanvas ist. Es gibt also eine HCanvas, die 640 Pixel mal 640 Pixel genau dort auf der linken Seite ist. Der Schwarm läuft herum und es aktualisiert die Farbe aber was wir auf der linken Seite sehen, ist ein HCanvas. Also, jetzt möchte ich wissen, nach dieser wunderbaren kleinen Pause, die wir gemacht haben, kann ich diese HCanvas verwenden, die wir hier auf der linken Seite sehen, kann ich diese HCanvas für alle sechs Oberflächen des Würfels verwenden? Ich werde ausflippen, wenn es funktioniert. Also, lassen Sie uns dieses Beispiel schließen, gehen wir zum nächsten Video über, wo wir über Beispiel 16 und Beispiel 17 sprechen werden. 50. Einheit 9, Video 10: Es geht gerade jetzt nach unten, Beispiel 16 und Beispiel 17. Hier ist, wo ich Beispiel 15 nehme und sehe, ob ich es mit Beispiel 14 zusammenführen kann. Beispiel 16 ist also eine Zusammenführung dieser beiden Dateien. Es wird eine Menge Code hier geben, aber hoffentlich haben Sie gesehen, wie dies einfach beginnt und schrittweise komplexer wird. Hoffentlich haben Sie, obwohl es eine Menge Code ist, die Schritte verstanden, die uns zu diesem Punkt gebracht haben. Also, schauen wir uns Beispiel 16 an. Ich habe einige Dinge mit dieser Datei gemacht, es gibt einige visuelle Hinweise und es wird Sinn machen, wenn wir es ausführen. Oben oben kopiere und fügte ich all das Zeug ein, das wir gerade im vorherigen Beispiel 15 gemacht hatten. Der Canvas, der PixelColorist, der Schwarm, der Drawable Pool und der Timer. Wenn Sie sich das Setup ansehen, habe ich alle Sachen aus Beispiel 15 kopiert und eingefügt, das die HPixelColorist hinzufügt und den Canvas-One hinzufügt. Siehst du hier, es steht nur neue HCanvas. Nehmen Sie eine Notiz, Zeile 19, diese Datei ist zurück auf 640 von 640. Also, wir sind wieder in unserer kleineren Leinwandgröße, wir sind nicht mehr bei 1280. Wir sind wieder bei 640 mal 640. Zeile 25, ich habe das Gleiche behalten. Ich sagte nur, machen wir es zu einem HCanvas und die Leinwand ist 640 mal 640. Auto Clear ist falsch, das Fade ist eins. Ignoriere Zeile 26, du siehst sie nicht. Ich füge Canvas zum Hype hinzu. Der Texturmodus ist normal. Ich habe dann den gesamten Code für den Pool im Timer hinzugefügt. Also, der Pool ist immer noch der gleiche wie in Beispiel 15. Wir zeichnen 20 Assets, es verwendet ein HRectangle, es macht diese Feuerwerk-Rotation Bogen-Sache. Wir fügen einen HSwarm hinzu, genau wie wir es in Beispiel 15 getan haben und der Timer wird diese Dinge immer noch 250 Millisekunden herausschießen. Nun, der Rest des Codes sind alle unsere Pre-Pick Sachen. Also, wenn Sie sich diese vier Schleife ansehen, das ist von vorher, das ist aus Beispiel 14. Wo ich eine zufällige Position vorwähle, eine zufällige Skala vorwähle, eine zufällige Rotation für x, y und z vorwähle. Unsere Oszillatoren sind aus Beispiel zwei unverändert geblieben. Sehen wir uns jetzt die Auslosung an. Die Ziehung, Ich fügte hinzu, dass kleine vier Schleife durch den Pool zu wechseln und die Farbe von jedem PixelColorist in dieser color.jpeg neu zu erhalten. Diese Push- und Pop-Matrix ist immer noch die gleiche. Dies bleibt gegenüber Beispiel 14 unverändert. Was anders ist, ist die BuildCube-Funktion und schau dir an, welche Wissenschaft ich hier gemacht habe. Ich sagte für die Textur, statt Tex, T-E-X, anstatt auf eine Reihe von Bildern zu gehen, sagte ich nur: „Geh auf die Leinwand und schnapp dir die Grafiken davon.“ Ich habe das für alle Gesichter getan. Sie werden also feststellen, dass die Textur c1.graphics für alle sechs Oberflächen des Würfels ist. Ich werde jetzt den Film laufen und Sie werden etwas Wahnsinn bemerken aber es ist aus einem Grund da, und ich werde es erklären. Wenn ich es ausführe, habe ich die HCanvas von C1 im Hintergrund gelassen. So können Sie sehen, dass es läuft, aber dann können Sie auch sehen, dass es tatsächlich das Schwarmverhalten auf alle sechs Oberflächen des Würfels abbildet. Also, ich habe das Schwarm Verhalten im Hintergrund sitzen, man könnte sehen, wie es sich bewegt und man kann sehen, dass es tatsächlich auf den Oberflächen aktualisiert. Also, das ist nur ein visueller Hinweis. Ein heiliger Mistmoment, dieses gottverdammte Ding hat funktioniert. Also werde ich voran gehen und das schließen und ich werde es in Beispiel 17 reparieren. Wenn Sie also zu Beispiel 17 gehen, das einzige, was anders ist, diese Zeile 26 hier, wo ich den HCanvas 640 von 640 erstelle. Ich füge die HCanvas in Zeile 27 hinzu, aber in Zeile 26 sage ich: „Können Sie die Leinwand als X-Achse wie negative 10.000 verschieben. Wie im Grunde, hol es mir verdammt nochmal weg. Ich will es nicht sehen. Ich brauche es, es ist da, ich male darauf, ich werde es als Textur verwenden, aber bewegen Sie es verdammt weit vom Bildschirm, so dass ich es nicht sehe.“ Also, da ist unsere Linie 26, die die C1 Canvas-Exposition negativ 10.000 Pixel bewegt. Wenn Sie also Ihre Skizze hier ausführen, sehen Sie nur die Würfel und das Schwarmverhalten, die allen sechs Oberflächen dieses Würfels zugeordnet werden. Kann ich einen Hallelujah kriegen? Kann ich ein Amen kriegen? Also, jetzt sage ich: „Oh mein Gott! Der Himmel ist jetzt die Grenze.“ Nun, wenn Sie darüber nachdenken, alles, was wir in dieser Klasse gelernt haben, Tweening, Rotation, das Schwarm Verhalten, solange wir es auf eine HCanvas malen, können wir tatsächlich diese HCanvas als Textur auf diese -Oberfläche. Nun, Sie haben vielleicht bemerkt, dass das einzige, was wir jetzt sehen , diese transparenten Würfel sind und wenn Sie wollten, könnten Sie hier zur BuildCube-Funktion kommen, dann werden Sie feststellen, schauen Sie sich Zeile 146 an. Ich kommentierte diese Zeile 146, aber schauen wir uns das an. Wenn ich Zeile 147 auskommentiere, die kein Strich, keine Füllung ist , und ich tatsächlich Linie 146 zurücksetze, was ein Strichgewicht von eins und eine Strichfarbe grau ist, können Sie diese Skizze jetzt ausführen. In der Tat, hier lassen Sie uns das einfach ein bisschen größer machen. Lassen Sie uns das zu einem Strichgewicht von vier machen. Ich weiß nicht, ob der Strich dieser grauen Farbe ein n sein wird, das funktioniert gut. So, Sie können sehen, dass die Boxen, Sie können ihre Rotation sehen und Sie bekommen dieses wirklich interessante Muster des Schwarm läuft über die Oberfläche dieses Würfels, die schön ist. Ich werde das auf die Art zurückbringen, wie wir es hatten. Also, ich werde Zeile 146 kommentieren. Ich werde 147 zurückbringen. Wieder, es ist erstaunlich. Ich benutze tatsächlich diese gesamte Umgebung, um den Cluster von Würfeln tatsächlich zu verbergen. Ich bin nicht wirklich daran interessiert, die Würfel zu sehen , aber ich interessiere mich mehr für die Abstraktion des Schwarmverhaltens, das auf die Würfel abgebildet wird und da ist die Magie. Nun, ich werde diese Datei beenden und buchstäblich haben wir noch drei Videos. Es wird eine zum Beispiel 18 geben, eine zum Beispiel 19 und eine zum Beispiel 20. Der Zweck für diese nächsten paar Dateien war wieder, dass ich einfach nur sagte: „Ich frage mich.“ Ich frage mich, dass ich Ihnen einen kleinen Hinweis geben werde, ist, hierher zu kommen und sich Zeile 20 anzuschauen. Zeile 20 ist die Bühne und Sie werden feststellen, dass der Hintergrund nur 20-20-20 ist. Es war nicht, bis ich das versuchte, sagte: „Was würde passieren, wenn ich die Bühne nicht automatisch freimachen würde?“ Wenn ich die Bühne nicht automatisch freimachen würde, würde sie Spuren hinterlassen, nicht wahr? Also, ich habe diese Datei gespeichert, ich habe diese Skizze ausgeführt, und ich habe diese. Also, ich dachte, wir müssen ein paar neue Akten machen. Gehen wir voran und beenden Sie dieses Video und wir gehen zu beispiel18. 51. Einheit 9, Video 11: Beispiel 18. Wir kommen auf die letzten paar Videos hier, und Junge macht diesen Prozess, dieses Experimentieren, was wenn, und ich frage mich, was passieren würde, wenn ich x, y, und z zu tun Es dauert eine seltsame Wendung, und wie ich erwähnt in Das letzte Video, alles, was ich tun musste, war, dass AutoClear (falsch) zur Hauptbühne hinzuzufügen, das heißt: „Hey, du hast diese Würfel bewegen. Warum malen wir sie nicht und sehen, was passiert?“ Ok. Also habe ich hinzugefügt, dass AutoClear (false). Die andere Sache, die ich geändert habe, ist, dass ich HDrawablePool so geändert habe, dass es nur ein Asset ist. Also, jetzt gibt es nur ein Schwarmverhalten, das jedem der sechs Gesichter zugeordnet wird , weil ich dachte, 20 wären zu viele. Zumal man diese Rotationen auf der Außenseite bekommen würde, würde es diesen Ring erzeugen, und wieder machte er die Würfel zu sichtbar. Ich mag diese Idee, diesen total verrückten 3D-Cluster zu verwenden, aber verstecke es so, dass, wenn Leute die Dateien sahen, sie vielleicht nicht einmal erkennen würden, dass ich 3D-Würfel benutzte, um dies überhaupt zu machen. Also, um das zu wählen, ändere ich HDrawablePool in eins. In dieser Datei 18 sind das die einzigen Änderungen, da ich dieses AutoClear (false) hinzufüge und den Pool auf eins herunterlege. Also, gehen wir weiter und führen Sie diese Skizze und jetzt, indem Sie den Schwarm auf ein Asset fallen, der Cluster von Würfeln fast verschwunden. - Richtig. Siehst du, du hast diese Systemmalerei, aber es ist schwer, wirklich zu erkennen, wie das Malen ist. - Richtig. Ist das nicht erstaunlich? Hättest du jemals gedacht, dass wir, als wir dies zum ersten Mal anfingen , als wir diese dreidimensionalen Würfel benutzten, zu einem Beispiel 18 kommen würden, wo ich das System verstecke, das diese Muster tatsächlich erzeugt? Würdest du es wissen? Wussten Sie überhaupt, dass dies durch eine Reihe von dreidimensionalen Würfeln erzeugt wurde? Nun, oh Mann, das war wirklich hübsch. Also, ich denke darüber nach und ich denke, dass dies einige Anpassungen brauchte. Einer ist, ich hatte das Gefühl, dass es einige Momente der Ruhe geben sollte. Vielleicht läuft der Schwarm zu schnell. Vielleicht muss ich die Geschwindigkeit ändern oder die Rotation ist, so dass wir diese Momente bekommen, und dann kann es einfach nicht schnell genug auflösen, und so gibt es eine Pause, und dann kommt es zurück, und dann siehst du es wischen. Die andere Sache, die in dieser speziellen Datei interessant ist, ist, dass wir keine Lichter verwenden. Wir benutzen keine Punktlichter. Also, wir bekommen die Farbe mit 100 Prozent Sättigung, und durch Hinzufügen eines Punktlichts würde bedeuten, dass, wenn ich diese Box hätte, die sechs Oberflächen hatte, und sie ist leicht so gedreht, und wenn ich ein Punktlicht hier drüben hätte , würde bedeuten, dass das Schwarmverhalten das Licht auf diese Oberfläche bekommen würde, aber es würde beginnen, sich auf dieser Oberfläche zu verdunkeln. Also dachte ich, wenn ich Punktlichter in dieser Umgebung verwende, könnte ich wirklich anfangen, die Schattierung dieser Umgebung zu kontrollieren. Denn im Moment ist es sehr flach, sehr psychedelisch, aber ich möchte etwas mehr Tonumfang hinzufügen, und ich denke, das ist wunderschön, ich schwöre bei Gott, das ist, was ich tue. Ich komme mit verrückten, verrückten Ideen, und ich kodiere diese Dinger und ich sitze einfach hier, als wäre es erstaunlich. Das ist es, was ich tue. Das ist es, was ich tue. Ich sitze nur rum und versuche mich zu überraschen. Leckerisch. Ok. Schließen wir das, das sieht auch toll aus, aber es ist weg. Lassen Sie uns diese Datei schließen und gehen Sie zu Beispiel 19 im nächsten Video. 52. Einheit 9, Video 12: Wir sind in Beispiel 19, und ich werde einige dieser Vorschläge implementieren , die ich im vorherigen Video erwähnt. Also, wenn ich zurück zu Beispiel 18 schalte, schauen wir uns ein paar Sachen hier an. Die Anzahl der Würfel ist 20, die Min-Skala und die Maximalskala beträgt 40 und 120. Wenn wir den Schwarm betrachten, ist die Geschwindigkeit 15, die Kurve ist 0,02 und das Zucken ist fünf. Nehmen wir ein paar Anpassungen vor. Wenn Sie mit Beispiel 19 fortfahren, verschiebe ich num cubes nach unten auf 13. Ich dachte, 20 sind einfach zu viele. Ich brauche diese Momente des Weltraums. Also, ich verschiebe die Anzahl der Würfel nach unten auf 13. Ich erhöhe auch die maximale Skalierung, so dass Sie feststellen werden, dass die Min-Skala jetzt 50 und die maximale Skalierung jetzt 150 ist. Ich änderte auch die Größe der Leinwand, 900 um 900. Ich wollte einen größeren Betrachtungsbereich anstelle von 640 mal 640 malen. wirkt sich jedoch nicht auf die H-Canvas aus. Die H-Leinwand kann bei 640 x 640 bleiben. Es spielt also keine Rolle, was wir die Breite und Höhe der Hauptleinwand ändern, denn solange der Schwarm und die H-Leinwand noch an diesem 640 festhalten, wird alles großartig funktionieren. In Ordnung. Unten im Schwarm wurde die Leichtigkeit der Kurve nach unten gewählt. Also, anstelle von 0,02, ist es jetzt 0,01, also ist es nur ein bisschen langsamer, okay? Dann dachte ich, naja, die andere Sache, die ich wahrscheinlich aktualisieren möchte, ist das zufällige X und das zufällige Y. In Beispiel 18 ist es negativ 300, positiv 300 für X und Y. In 19 mache ich es 400 auf dem negativen und 400 auf dem positiv. Also, jetzt kann jeder der Würfel ein bisschen mehr ausziehen, oder? Das macht Sinn, weil unsere Leinwand jetzt 900 mal 900 ist, also wenn sie geöffnet werden, bedeutet dies nur, dass der Cluster ein wenig mehr Abstand haben wird. Jeder ziehbare Pool ist immer noch eins, so dass wir immer noch einen in unserem Schwarm. Das nächste Update ist ein Punktlicht. Beachten Sie also, dass Sie durch Hinzufügen eines Punktlichts jetzt eine Schattierung auf den dreidimensionalen Objekten erhalten. Ok? Also, schauen Sie sich dieses Punktlicht an, es ist ein weißes Licht 255, 255, 255. Die Position des Lichts ist in der genauen Mitte, Breite geteilt durch zwei, Höhe geteilt durch zwei, und ich habe es ein bisschen bis Z-Achse von 100 nach oben gezogen. Wenn ein Würfel so wäre, würde das bedeuten, dass das Licht auf dieser Oberfläche perfekt scheint. Sie würden also die Farbe sehen, die von jedem Pixelkolorist in seiner ganzen Regenbogenpracht abgetastet wird . Wenn sich der Würfel jedoch an dieser Position befand, würde das Licht diese Oberfläche treffen, und es würde gewisse Schattierung auf jeder der Seiten dieser Flächen geben. Also, Sie würden nicht die Farbe von jedem Pixelkolorist in seiner 100 Prozent hellen Sättigung bekommen . Es würde tatsächlich anfangen zu verdunkeln. Stellen Sie sich vor, dass es den gesamten Cluster bewegt, also wird es sogar noch schlimmer, richtig? Wenn also der gesamte Cluster anfängt sich zu drehen, werden einige Dinge nach vorne kommen und einige Dinge werden den ganzen Weg hinten hier sein, und sie werden wahrscheinlich den ganzen Weg zu schwarz gehen. Ok? Das wird tatsächlich zu unseren Gunsten funktionieren , weil es so aussehen wird, als wäre es ein Rennen, richtig? Also, etwas wird sich nach vorne bewegen, es wird einen großen Farbwechsel malen, und dann, wenn sich das Ding dreht und einige dieser dunkleren Schatten auf den Würfeln tatsächlich schwarz auf dem Schwarm sein wird, würde es beginnt zu löschen. Es wird so aussehen, als würde es löschen. Lass uns die Skizze laufen und sehen genau, wovon ich rede. Also, jetzt fangen wir tatsächlich an, etwas Tonumfang zu bekommen, und schauen Sie sich das an, Sie sehen jetzt, dass der Schwarm tatsächlich ein bisschen Schwarz präsentiert, denn dieses Sie sich das an, Sie sehen jetzt, dass der Schwarm tatsächlich ein bisschen Schwarz präsentiert, Punktlicht trifft nicht die Oberfläche direkt von vorne. Weil wir die Leichtigkeit der Kurve auf 0,01 geändert haben, sehen Sie sich das an, wir haben wie einen Moment der Ruhe und wir warten nur. Wir warten darauf, dass der Schwarm sich wieder in die Lage versetzt, etwas zu malen. Das könnte schnell passieren, und das könnte einige Zeit dauern. Weil wir ein Zucken von fünf haben, wird es technisch gesehen natürlich abgeschlagen , also sehen wir nichts. Jetzt kommt es in den Blick. Also, es macht dieses schöne Wischen und dann verschwindet es, richtig? Also, der Schwarm kommt darauf und bewegt sich dann ab. Wieder bekommen wir diesen Tonumfang, weil wir Punktlicht verwenden. Ich hoffe, du flippst gerade aus. Du hast das nicht kommen sehen. Whoa, wunderschön. Sie haben keine... die meisten Leute, es ist unser Geheimnis. Es ist unser Geheimnis, niemandem die Magie hinter diesem Zauberer von Oz Mist zu erzählen. In Ordnung? Weil ich diesen Schwarm so verändert habe, bekomme ich diese Momente der Ruhe und ich bin wirklich in der Lage, das anzusehen und auf den nächsten Wisch zu warten und zu sehen, welche Formen es schaffen wird. Aber hier ist das Interessante, weil Sie den gleichen Schwarm auf alle sechs Oberflächen abbilden, da ist die Vertrautheit. Richtig? Obwohl Sie 13 Würfel haben und diese 13 Würfel sich bewegen, bilden sie alle das gleiche Verhalten wie eine Textur ab. Also, wenn es grün wischen, streift es grün auf allen 13 dieser Würfel. Wenn es rosa wischen, ist es auf allen 13 von ihnen rosa wischen. Plötzlich fängt man an zu bemerken, oh, warte eine Minute, es macht etwas an verschiedenen Orten auf dem Bildschirm, aber sie platzen alle die gleiche Farbe zur gleichen Zeit. Es gibt etwas an der Animation, das auf allen bekannt ist, oder? Also, ich denke, dass für mich das ist, was ich ständig versuche zu tun, wenn ich diese Dinge mache, was heißt, wie kann ich Überraschung programmieren, oder? Ich möchte überrascht sein. Ich will etwas laufen lassen. Das dauert viel zu lange, oder? Das habe ich aufgegeben. Ich werde es schließen und ich möchte es wieder ausführen, weil ich wieder überrascht sein möchte. Ich möchte Zufälligkeit verwenden, um die Überraschung zu generieren, aber ich möchte, dass es Gefühl gibt, dass es gewisse Vertrautheit, so dass es sich nicht völlig zufällig anfühlt, wie, wissen, dass hier definitiv etwas im Spiel ist. Auch hier können Sie eine unendliche Anzahl von Malen ausführen und Sie erhalten eine unendliche Anzahl von Kompositionen. Nun, es könnte sein, dass der Schwarm einfach zu lange dauert. In Ordnung? Also, natürlich, diese Pausen sind zu lang. Also, wenn ich das schließe, könnte ich hier heraufkommen, um hier zu schwarm zu werden und sagen wir, ich setze die Abzweigung wieder auf 0,02 zurück. Das würde bedeuten, dass es einen besseren Job macht, wieder in den Blickwinkel zu verwandeln, oder? Also, sieh dir das an, wir bekommen ein paar nette Wirbel, oh, sehen Sie, dass es schon zu beschäftigt ist. Siehst du, es ist Feinabstimmung, okay, cool. Es gibt, nein, es ist wieder zurück. Sehen Sie, ich möchte ein paar Augenblicke damit leben, bevor es wieder malt, was bedeutet, dass ich die goldene Zahl für diese Leichtigkeit herausfinden muss, damit es mir diese Bewegung gibt, aber es gibt mir genug Zeit, sie zu schätzen bevor es wieder malt. Ich weiß nicht, was diese goldene Zahl ist. Es könnte 0,015 sein, in Ordnung? Also, lasst uns versuchen, es mehr als nur einen zu machen, vielleicht 0,015. Wieder mag ich das Schwarz, das über kommt und beginnt, ein wenig zu löschen. Aber hoffentlich sind Sie erstaunt, dass wir Würfel verwenden, um dies zu tun. Okay, das ist ein guter. Ich werde es dabei behalten. Lassen Sie uns dieses Video schließen und wir gehen, um zum letzten zu gehen, das ist Beispiel 20. 53. Einheit 9, Video 13: In Ordnung. Hier ist die letzte Datei in diesem Abschnitt. Einige Dinge, über die Sie nachdenken müssen, wenn Sie sich Beispiel 20 ansehen und in den Datenordner schauen, habe ich color.jpeg geändert. Dies ist ein Foto von meinen Freunden Cosy und Dan, die viel Tauchen machen, und das ist ein Schuss unter Wasser und es ist Seetang. Was ich tat, war, dass ich dieses Bild von Seetang innerhalb von Photoshop geöffnet habe, ich habe eine Gaußsche Unschärfe angewendet, so dass es irgendwie wollte ich das Bild nicht ein wenig verwischen. Also, ich bin mit wie einem Gaußschen Unschärfe von 10 oder so etwas rausgeplatzt. Ich habe dann etwas Geräusch darauf angewendet, man kann sehen, dass es tatsächlich vielleicht ein wenig pixelig ist. Dann habe ich das Schärfwerkzeug benutzt, um das Geräusch zu schärfen. Also bekommen Sie diese Art von körnigen verschwommen Photon, und ich dachte, dass Körnigkeit vielleicht wirklich schön und h Pixel Coloristen aufnehmen würde. Beachten Sie also, dass es auf dieser Rechnung 20 ein neues Bild gibt, von dem wir Farbe abtasten. Ok. Was hat sich in dieser Datei außer einem neuen JPEG geändert? Nun, ich habe TurneASE ein wenig modifiziert, also mache ich wieder 0.017, um diese Art von einer goldenen Zahl zu finden. Ansonsten denke ich so ziemlich alles ist gleich geblieben, außer dass ich die Punktlichter gewechselt habe. In Beispiel 19 befand sich das Punktlicht direkt in der Mitte. Ich habe zwei Lichter hinzugefügt, beide Lichter sind weiß, aber sie leuchten von den Seiten. Also, wenn Sie sich die Linien 112 und 113, 255, 255, 255, 255, 255, so dass die Lichter sind weiß. Aber die erste ist Null auf der Höhe der X-Achse geteilt durch zwei auf der Z-Achse von 100, so dass das Licht auf der linken Seite leuchtet. Dann Zeile 113 seine Exposition ist Breite Höhe geteilt durch zwei. Also, ich habe zwei weiße Lichter, die jetzt auf beiden Seiten der Bühne leuchten. Erinnerst du dich, wie ich vorhin gesagt habe, dass ich die Dinge etwas verlangsamen muss? Nun, es gibt einen kleinen Trick. Was ich hier in Zeile 22 getan habe, ist, dass ich die Framerate der Verarbeitung verlangsamt habe. Ich glaube, standardmäßig ist die Bildrate 60. Also, hier reduziere ich die Framerate der Verarbeitung auf eine Bildrate von 30. Also, ich habe das Tempo von allem, was sich bewegt, halbiert. In Ordnung? Abgesehen davon denke ich, dass alles andere gleich bleibt. Lassen Sie uns die Skizze testen und sehen, was wir bekommen. So können Sie sehen, dass es ein wenig verlangsamt wird. Es dauert ein wenig mehr Zeit, um diese Kurven zu zeichnen und wieder ist es Sampling aus dem neuen JPEG, so dass wir einige schöne Schokolade und Minze Farben bekommen, haben eine kleine Pause hier und dann Boom kommt es mit dem goldenen Honig. Minzschokolade Chip und Honig, das ist der Name dieses Stückes. Also kann ich das tagelang beobachten und du wirst etwas anderes bekommen, richtig? Weil es so viele zufällige Ereignisse gibt , dass es sich dynamisch für dich entfalten wird, genau so, als würde es sich gerade für mich entfalten. Also, das endet wirklich dieser Abschnitt, der versucht eine Idee zu finden und wirklich den Prozess dieser Idee zu erkunden, aber wirklich geht es um Combos, es geht um Kombinationen, es geht darum, all diese Dinge zu nehmen, die wir gelernt haben und versuchen, sie zusammen zu arbeiten, um diese Super-Überraschung zu schaffen. Ich hatte keine Ahnung am Ende davon, ich hatte keine Ahnung, warum wir uns auf diese Reise begeben , die ich zu dieser Art von kleinen Gemäldestruktur bekommen wollte. Wenig wusste ich, dass ich diese ganze 3D-Umgebung erarbeiten würde , um sie vor dir zu verstecken. Ich weiß nicht, ob ich das entdeckt hätte, wenn ich nicht bereit gewesen wäre, den Weg zu gehen, und darum geht es, geht der Weg, um Dinge zu versuchen, was passiert, wenn man diese Zahl ändert? Was passiert, wenn Sie diese Nummer ändern? Was, wenn du versuchst, das Ding dem zuzuordnen? Was ist, wenn wir versuchen, anstelle jedes Rechtecks zu einem SVG zu wechseln? Was ist, wenn es jetzt ein Dreieck bewegt? Hast du das noch nicht gemacht, vielleicht machst du das, vielleicht nimmst du eine deiner Zeichnungen, die du in der ersten Klasse gemacht hast , und du mappst das dem Schwarm Verhalten anstatt auf Zeile 33 mit jedem Rechteck zu. Es ist, dass immer in Frage gestellt wird, was wäre, wenn, was wenn, wenn, dass ich auf diese glücklichen Unfälle passiert, denn das ist, was das sind, sind glückliche explorative Unfälle. Ok. Schauen wir uns alles an, was wir für uns haben. Wir behandelten HRotate, wir deckten HCanvas, wir deckten HFollow , wir deckten HTWeen, HSwarm, Hoscillator ab und führten dann einen Kombinationsprozess durch. Wir haben einen letzten Abschnitt, und so kriege ich das raus, also wie nehme ich das Ding an, das ich mache. Oh, sieh dir das an, oh hier kommt die Minze, hier kommt die Minze auf meiner Schokolade und Honig. Es ist eine coole Minze. Wie kriegen wir das raus? Ich möchte das auf Vimeo verdammt nochmal posten. Oder ich möchte ein animiertes Gif machen. Also, der nächste Abschnitt, wird sich mit der Ausgabe beschäftigen. Wie rendern wir das in eine Bildsequenz? Wir haben viele wirklich fantastische Wege gelernt, oh mein Gott, das ist hübsch, das ist auch gut. Es tut mir leid, dass dieses Video sechs Stunden dauern könnte, ich konnte das buchstäblich sechs Stunden lang ansehen. Also, gehen wir zum nächsten Abschnitt über, der ausgegeben wird, aber ich möchte nicht nur, dass Sie Dinge mit einigen der Dinge ausprobieren , die wir in der vorherigen Klasse gemacht haben, aber ich möchte ständig, dass Sie sich immer fragen, was, wenn denn was ist, wenn bedeutet, dass Sie einige dieser Dateien nehmen und Ihre eigenen Mutationen machen, und das wird im Projektabschnitt dieser Klasse passieren. Ist das was, wenn? Und hier ist, was ich getan habe und was, wenn und hier ist, was ich getan habe, und ich habe dieses Bild mit dieser Art von Farbinformationen und schauen, wie es sich verändert hat. Es gibt immer dieses Experimentieren, das das Unerwartete enthüllt. In Ordnung. Wechseln Sie zur Ausgabe. Wir sehen uns im nächsten Abschnitt. 54. Einführung in die Ausgabe: Und du bist jetzt im letzten Abschnitt der Ausgabe, und für mich ist das alles, was wir in dieser Klasse gelernt haben , und es in etwas auszugeben, das wir in der Welt nutzen können. Also, was passieren wird, ist, dass wir diese Animationen tatsächlich in Bildsequenz rendern werden.. - Richtig. Also, wir werden lernen, wie man den Code schreibt, um einen Ordner zu erstellen und tatsächlich jeden einzelnen Frame dieser Animation auszugeben, dass wir generativ zu einer Bildsequenz machen, und in diesem Abschnitt kann ich auch einige externe Werkzeuge , die ich tatsächlich für den alleinigen Zweck der Erstellung von Ausgaben verwende. Wir werden also ein kleines Apple-Skript-Programm verwenden um auf diese Bildsequenz zu verweisen und tatsächlich einen schnellen Zeitfilm zu erstellen. Großartig! Sobald wir es in Quicktime-Film haben, welche anderen Anwendungen verwende ich, um es in MP4 zu verschieben? Weil unsere Filmdatei ein bisschen groß sein wird. Also, ich möchte eigentlich meine Dateien aus einem Filmformat in MP4 verschieben, und ich werde ein völlig separates Programm verwenden, um das zu erstellen. Wie kann ich einige andere Werkzeuge verwenden, um tatsächlich ein Kaleidoskop der Animation, die wir gerade erstellt haben, zu reflektieren oder zu erstellen? Eine andere Sache, nach der ich super verrückt bin, ist Reflexion. Wie können wir diese Ausgabe in gif in das animierte GIF-Format bekommen? Die Ausgabe wird also im Grunde nur auf all diese Verhaltensweisen schauen, die wir all diese schöne Zeit damit verbracht haben , zusammen zu erstellen und sie in ein Format zu bringen, das wir online veröffentlichen können und wieder für mich war es Tumblr. Ich habe diese 30-Sekunden-Sekunden-Animation erstellt, die an tumblr ausgegeben wurde. Also, wie nehmen wir diese generativen Animationen und bringen sie in ein Format , das wir veröffentlichen können, um tumblr oder wir können in einem Musikvideo verwenden? Genau wie ich es für Phantomgramm getan habe. Also werde ich Ihnen zeigen, wie ich einige dieser Phantom-Animationen erstellt habe, die im Musikvideo verwendet wurden. Also, Ausgabe bitter süß, aber willkommen am Ende. 55. Einheit 10, Video 1: Entschuldigung. Das ist es. Wo zum Teufel sind wir? Wir sind in der Ausgabe, und das ist es. Das ist die Magie, auf die du gewartet hast. Wenn Sie die Zip herunterladen, die mit dieser Datei verbunden ist, was ich getan habe, ist, ich ging in Combos und ich nahm Beispiel 14, die ich gerade dachte, war eine schöne Skizze für uns zu rendern. Wir haben Animation, ich will sie jetzt rauskriegen. Also, im Moment habe ich Beispiel 14 geöffnet, und was ich tun möchte, ist jedes Mal, wenn die Zeichenfunktion ausgeführt wird, ich möchte den Bildschirm im Grunde malen und dann dieses Bild erfassen. Ok. Also, wenn Sie sich Beispiel 14 innerhalb von Combos ansehen, werden Sie sehen, dass in Zeile 99 die Zeile ist, an der ich interessiert bin. Nun, lassen Sie mich das einfach kommentieren und lassen Sie mich es ausführen, damit Sie sehen können, wie Beispiel 14 aussieht. Es ist dieser Typ, der ist, es ist einfach hübsch. Ok. Also, ich möchte das in eine Sequenz von Bildern ausgeben. Nun, im Fall meines Tumblr-Projekts, ist eine der Einschränkungen, dass es eine 30-Sekunden-Animation sein wird. Also, wenn ich eine 30-Sekunden-Animation mit 30 Bildern pro Sekunde kompiliere, dann würde ich wissen, dass ich 900 Bilder möchte, und schauen wir uns diese Zeile an. Es sind eigentlich zwei Aktionen hier, und hier ist die erste, was ist, dass ich den Rahmen speichern möchte, und so, innerhalb des gespeicherten Rahmens, habe ich etwas Einzigartiges getan, das heißt, ich sage, gehen Sie in ein Verzeichnis, Erstellen Sie einen Ordner namens frames, und jetzt beginnen Sie, eine Sequenz von Tiffs zu speichern, und diese Pfundzeichen werden durch Frame-Anzahl ersetzt. Plötzlich wird die erste Datei 000000001 sein, dann zwei und dann drei. Also wird es eine Sequenz von Tiffs speichern. Nun, während das passiert, habe ich hier ein wenig bedingte, dass sagt, wenn die Frame-Anzahl 900 erreicht hat, dann weiß ich, dass ich 900 Tiffs habe, die ich in einen Film mit 30 Bildern pro Sekunde kompilieren kann , wären 30 Sekunden von Animationen. Wenn es eine Frame-Anzahl von 900 erreicht, wird es tatsächlich aus dem Programm beendet. So wird die gesamte Skizze kollabiert. In Ordnung. Also, lassen Sie mich das hier machen, das heißt, ich werde diese kleine Mappe rüber bringen. Lassen Sie mich das auf der linken Seite positionieren, und lassen Sie mich das hier oben positionieren. Also, hier ist das Beispiel 14, und innerhalb von dort ist meine build.pde. Ok. Also, jetzt habe ich diesen Code hier unkommentiert. Also, lassen Sie uns fortfahren und das und die Skizze ausführen. Sieh mal. Es hat gerade einen Frame-Ordner erstellt, und wenn Sie tatsächlich diesen Frame-Ordner öffnen würden, würden Sie beobachten, wie dies jetzt wachsen 253 Elemente, 300 Elemente. Wenn diese Animation ausgeführt wird, wird die Animation in eine TIFF aufgenommen, und schließlich wird dies bis zu 900 Bilder aufbauen. Frame-Anzahl wird 900 erreichen, und es wird diese Animation heruntergefahren, genau so. Also, es tatsächlich verlassen diese Skizze, und Sie können sehen, jetzt habe ich 900 Bilder in diesem Ordner genannt Frames. Also, wenn ich den ersten TIFF hervorheben würde, da ist es. Ich kann tatsächlich auf den Abwärtspfeil klicken, und Sie sehen, ich bewege mich durch die Sequenz der Bilder, und es hat tatsächlich jeden dieser Tiffs gerendert. Jetzt können Sie jede Art von Bild rendern: jpeg, png. Ich mag Tiffs, weil Tiffs unkomprimiert sind. Sie sind knusprige, knusprige Akten. Richtig. Also, ich muss mir keine Sorgen machen. Wenn ich zu einem JPEG gehe, mache ich mir Sorgen, vielleicht etwas JPEG-Komprimierung zu bekommen. Also neige ich dazu, meine Bilder gerne als Tiffs auszugeben, so dass beim Erstellen eines Films die Klarheit der Assets, die erfasst werden, so gut wie möglich ist. Also, TIFF ist das, was ich benutze. Hier können Sie im Finder sehen, dass jeder dieser Tiffs 1,2 Megs ist. Also, abhängig von der Länge des Videos, werden Sie anfangen, auseinander Festplattenspeicher eigentlich ziemlich schnell zu essen. Ok. Also, jetzt haben wir das letzte Stück Code für die Ausgabe hinzugefügt. Im nächsten Video zeige ich Ihnen nur einen kleinen Trick, den ich benutze, um dies zu einem QuickTime-Film zu kompilieren und dann auf einem mp4 zu veröffentlichen. Ok. Wir sehen uns im nächsten Video. 56. Einheit 10, Video 2: Ich dachte, ich würde dieses letzte Video hier nehmen, nur um ein paar Tricks zu teilen , die ich bei der Vorbereitung einiger Sequenzen verwende. Im letzten Video haben wir 900 Tipps gerendert. Hier sind all diese Tipps und wieder, es ist jetzt eine Animation. PC-Nutzer, es tut mir leid, dass ich wahrscheinlich nicht viel Hilfe auf einem PC sein werde , weil ich offensichtlich einen Mac in den beiden Empfehlungen verwende. Das ist Mac-Software. Ich bin mir nicht sicher, ob es PC-Versionen gibt oder nicht. Die erste ist, dass Sie Google nach diesem Wort suchen, Sequimago. Sicher. Auch hier gehst du zu Google-Suche. Dies ist für Macintosh und das ist nur ein tolles kleines Programm, das ich gerne benutze, um diese Tipps zu nehmen und sie tatsächlich in QuickTime-Filme zu kompilieren. Also, ich habe bereits heruntergeladen. Dies ist ein Apple-Skript. Ich habe dieses Apple-Skript bereits heruntergeladen und es sitzt tatsächlich in meinem Anwendungsordner und es passiert so, dass ich es auf meine Taskleiste gezogen habe, auf meiner Finderleiste hier. Weil ich immer Filme bauen, so dass Sie hier sehen können Anwendungen Sequimago. Sehen Sie sich an, wie es funktioniert. Also, was ich mache, ist, dass ich in einen Ordner gehe, in diesem Fall habe ich 900 Bilder und ich werde nur alles auswählen. Dann, alles, was ich tun werde, ist, wenn ich all diese 900 Bilder ausgewählt habe, werde ich sie tatsächlich zu diesem kleinen Apple-Skript ziehen. Sobald ich losgelassen habe, wird es dieses Dialogfeld öffnen und es steht, okay, bitte nennen Sie diesen Film, den Sie erstellen möchten. Also, lassen Sie uns das einfach gerendert nennen. Dann werde ich voran gehen und klicken Sie auf Speichern und dann erhalten Sie ein neues Fenster, das sagt, hören Sie müssen das Timing für diese Bildsequenz auswählen. Sie können Frames pro Sekunde oder Sekunden pro Frame ausführen. Nun, ich weiß, dass ich 30 Bilder pro Sekunde machen möchte , weil ich deshalb 900 Bilder gerendert habe. Also, ich klicke auf diese mittlere Schaltfläche hier, Frames pro Sekunde. Es steht, bitte geben Sie einen gewünschten Rahmen pro Sekunde ein. Ich gehe einfach voran und gebe 30 ein. Ich gehe weiter und klicke auf Enter und dann wollten die Macher dieses Apple-Skripts wissen „Hey, wolltest du, dass wir die Bilder nach Dateinamen sortieren, bevor sie verarbeitet werden?“ Ich werde voran gehen und nein sagen, weil es bereits eine Sequenz von Bildern ist. Ich habe das für dich getan, also brauche ich nicht, dass du das für mich machst. Also, ich gehe voran und klicke auf Nein. Wenn Sie auf Nein klicken, werden Sie feststellen, dass Ihr Cursor hier zu diesem kleinen Symbol geändert wurde. Hier ist die Datei rendered.MOV, in die gerade geschrieben wird und Sie werden hier in meinem Dock feststellen, das Apple-Skript tatsächlich läuft. Nun, dieser Renderprozess wird wirklich durch die Menge an RAM bestimmt werden , die Sie haben und was nicht. Ich habe bemerkt, dass, wenn ich eine 900 Frame-Bildsequenz wie diese mache, es ein paar Sekunden dauert. Dies wird vielleicht 30 bis 40 Sekunden dauern, um diesen Film zu rendern , aber das liegt daran, dass dieser spezielle Computer fertig ist. Also dauerte es ungefähr 30 Sekunden. Diese spezielle Maschine hat 32 Gigs RAM. Mein Laptop hat nur etwa 8 Gigs RAM und manchmal könnte ein gerenderter Film 15 bis 30 Minuten dauern. Ich habe gesehen, dass einige bis zu zwei Stunden, drei Stunden dauern. Es variiert also wirklich, wie lange es dauert, um diese QuickTime-Filme zu erstellen. Ich werde das schließen. Also, das ist, was dieses Apple-Skript tut, ist tatsächlich dreht sich, und ich wusste nicht, wie lange es dauert, also habe ich tatsächlich einen Betty Crocker vorgerenderten gemacht, aber offensichtlich brauchen wir es nicht. Auch hier kann ich voran gehen und klicken Sie auf diese MOV-Datei und sicher genug ist es QuickTime-Player. Du kannst voran gehen und spielen. Es läuft 30 Frames pro Sekunde. Es sieht genau wie unsere Skizze aus, außer dass dies Video gerendert wird. Das wird offensichtlich nicht zufällig sein. Es ist nur eine Wiedergabe eines zufälligen Moments. Nun, dies ist eine MOV-Datei und wenn ich tatsächlich wählen Sie diese MOV-Datei und klicken Sie auf Info auf sie, können Sie sehen, dass dieser Film ist ziemlich groß. Auch wenn es 30 hier Dauer ist, können Sie sehen, es sind nur 30 Bilder pro Sekunde, dieser gerenderte Film ist 98,7 Megs. Es scheint ein bisschen groß für mich zu sein. Also, ich möchte das tatsächlich in ein MP4 rendern. Also, das ist das zweite Stück Software, die ich wirklich mag, die mir hilft , Filme in andere Formate zu reißen und das ist dieser Kerl hier, iSkysoft Video Converter, den ich hier habe. Wenn ich vorangehe und das starte, heißt es, dass ich einen beliebigen Film in diesen Bereich ziehen und ihn in ein anderes Format ausgeben kann. Auch hier können Sie all diese verschiedenen Formate erkunden, die auch dadurch gerendert werden können. Wenn ich diesen QuickTime-Film schnappe, kann ich ihn direkt dort ablegen. Ich habe bereits MP4 ausgewählt und schau dir das an. Es sagt, das Ausgangsmaterial ist 640 mal 640, 30 Bilder pro Sekunde. Es sind 98,7 Megs. Ich möchte dich nur wissen lassen, dass es immer noch 640 mal 640 sein wird. Es wird immer noch 30 Sekunden dauern, aber es wird 7,6 Megs sein. Also, ich gehe voran und klicke auf konvertieren. Es dauert satte zwei Sekunden. Es ist jetzt fertig. Es sagt Ihnen: „Herzlichen Glückwunsch! Sie haben ein MP4 gerendert.“ Gehen Sie weiter und klicken Sie auf OK. Ich kann Informationen zu diesem MP4 tun und sicher genug, es ist nicht 7,6 Megs. Es ist 25,2. Du lügst, Software. Du lügst. Aber es ist nicht 98 und ich bin ziemlich glücklich darüber. Also, wenn ich das hier beiseite schiebe, werden Sie feststellen, dass hier die beiden Akten nebeneinander sind. MP4 wieder, sieht sehr ähnlich wie die QuickTime so Josh ist glücklich und endet es ist die MP4, die ich am Ende auf Tumblr teilen, wenn ich bereit bin, dies zu veröffentlichen oder zu Vimeo oder zu welchem Videodienst Sie verwenden. Es gibt eine andere Sache, die ich wirklich an diesem iSkySoft Video Converter mag. Es gibt einen anderen Grund, warum ich es mag, und das liegt daran, dass es diese Spiegelungsfunktion hat. Ich mag Reflexion wirklich. Sie könnten einige kaleidoskopische Spiegelung tun und ich bin sicher, dass die Videobearbeitung Anwendung Ihrer Wahl, ob seine Aftereffects oder Premiere oder was auch immer es ist, dass andere Leute verwenden, aber wieder ist dies einfach schön und einfach. Wenn Sie hier schauen, wenn ich dieses Video nehme, das ich gezogen habe, werden Sie feststellen, dass rechts hier drüben ein Bleistift ist und wenn ich auf diesen Bleistift klicke, gibt es mir einige Bearbeitungsoptionen wie ich schneiden kann, anpassen, fügen Sie einige Effekte, Wasserzeichen, Untertitel, so weiter und so weiter. Also, ich eigentlich möchte ich zu Wirkung gehen und wenn ich auf Effekt klicke, werden Sie feststellen, genau hier ist Spiegel und alles, was es tut, ist nur nimmt Ihre Videodatei und spiegelt sie. Das ist schön, aber ich weiß nicht, ob ich das genau so gemacht hätte. Cool. Sie können tatsächlich auf Anpassen klicken. Wenn Sie auf Anpassen klicken, werden Sie feststellen, dass Sie die Möglichkeit haben, um 90 Grad zu drehen. Also, ich könnte tatsächlich die Rotation ändern, um zu etwas zu gelangen, das mir vielleicht gefällt, oder ich habe die Möglichkeit vertikal zu tauschen und horizontal zu tauschen, so dass ich tatsächlich diese Werkzeuge hier klicken kann , um zu sehen, ob ich eine Reflexion bekomme, die ich denken, ist am optimalsten. Wenn du fertig bist, lass mich sehen, ob ich das umdrehen kann. Das ist ziemlich gut. Ich gehe auf fertig klicken. Ich gehe voran und klicke auf konvertieren. Sie werden bemerken, dass es ein paar Sekunden dauert, bis dieses Ding rendert aber es rendert tatsächlich einen neuen MP4, also war der erste ein MP4, der zweite ist zwei MP4 und so kann ich jetzt diese Anwendung auf dieser Sache hier beenden zur Seite. Ich habe ein MP4, das das ursprüngliche Rendering meines Stückes ist und das zweite zeigt das reflektierte. Ich mag es, dieses Tool zu verwenden, weil es mich sehr schnell versuchen lässt , Reflexionsmöglichkeiten zu nutzen. Wenn Sie sich einige der Stücke ansehen, die auf Tumblr sind, habe ich das benutzt und missbraucht. Ich habe es mehr als bei einer Gelegenheit benutzt. Dies sind zwei Programme, die ich verwende, um meine QuickTime-Filme zu erstellen und sie in MP4 zu rendern und dann einige Möglichkeiten wie Reflexion auszuprobieren. Ok. Wir sind beim letzten Film angekommen und das war fantastisch. Ich hoffe, dass dies erst der Anfang eurer Reise ist. Wie immer, wie der erste, werde ich ständig auf die Projekte schauen, die ihr einreicht. Hoffentlich werden Sie versuchen, einige Dinge hinzuzufügen, die Sie aus der vorherigen Klasse gemacht haben. Hoffentlich haben einige dieser Dateien Sie dazu inspiriert, neue Mutationen auszuprobieren und bitte so viel wie möglich innerhalb des Projektabschnitts zu posten , weil es mich so sehr inspiriert, wie es einige der anderen Schüler, die diese Klasse besuchen. Genau wie die erste, man weiß nie, ich könnte total entgleist werden von etwas, das Sie posten, und ich kann einen neuen Abschnitt machen, wie ich es bei der ersten gemacht habe und einige neue Mutationen anbieten und Sie durch diese führen. Aber das wird nur passieren, wenn Sie mich inspirieren. Also, bitte machen Sie das möglich. Ich freue mich, sagen zu können, dass es tatsächlich eine dritte Klasse geben wird. Die wunderbaren Blicke auf SkillShare sind sehr interessiert an einer dritten Klasse, die Hardware sein wird. In der Hardware werde ich beginnen, einige Dinge wie die Verwendung der Schaltbewegung zu decken , so dass Sie tatsächlich mit Ihren Finger malen können. Wir werden wahrscheinlich in die Schritte der Verwendung eines Microsoft Connect eingehen. Wir werden auch einige Dinge mit Webcam machen, indem wir Frame-Differenzierung verwenden, um einige wunderbare Visualisierungen mit Webcam zu machen. Wir werden wahrscheinlich auch ein paar Sachen mit Audio machen. Wenn du mir auf Twitter gefolgt bist, habe ich einige wirklich lustige Sachen mit minimaler Erkennung gemacht. Also, ich hoffe, dass diese dritte Klasse nur Dinge kapselt, die externe Dinge als Eingabe verwenden, sei es Ton, Mikrofon, Webcam, Connect, Schaltbewegung. Es wird also eine dritte Klasse geben, wenn ich einen anderen Satz von Momenten finde , um eine Klasse mit Hardware zu kompilieren. Also, Twitter, ich bin dran. E-Mail, ich liebe es. Bitte senden Sie mir ein Feedback und ich hoffe wirklich, dass Sie diese Klasse genossen haben und wir werden bald feiern. Kümmere dich um. 57. Processing 3 + HYPE Bibliothek/Update: Um ein schnelles kleines Video von einem Update aufzuzeichnen. Als ich diese Kurse vor vier Jahren zum ersten Mal gemacht habe, war Processing 2 das Richtige. In Verbindung mit der Verwendung von Processing 2 war HYPE und wie ich HYPE in all diesen Klassen beschrieben habe, auch eine.pde-Datei. Also, in diesen drei Klassen, hatten Sie eine Hype.pde. Hype.pde enthielt die gesamte HYPE-Bibliothek, und das bedeutete auch, dass Sie damals Dinge wie Processing.js verwenden konnten. Aber jetzt hat sich viel geändert, es ist vier Jahre später, Processing.js ist wirklich nichts mehr, aber p5.Js ist die neue. Natürlich haben wir Processing 3. Nun, da ich mehr auf Anwendungsbasis gemacht habe und den Browser nicht mehr wirklich benutzte. Wir haben HYPE tatsächlich auf eine richtige Verarbeitungsbibliothek aktualisiert. Also, was ich getan habe, ist, dass ich alle diese Klassen durchlaufen habe, die ich zuvor vor vier Jahren mit Hype.pde und Processing 2 gemacht hatte vier Jahren mit Hype.pde und und sie aktualisiert habe, so dass sie Processing 3 und HYPE die richtige Bibliothek wird verarbeitet. Also, ich wollte dir nur sehr schnell zeigen, wenn du auf github.com/hype gehst , wirst du sehen, dass es HYPE Processing hier gibt. Dies ist das Master-Repo. Ich möchte Ihnen jedoch nur zeigen, dass, wenn Sie auf Zweige und innerhalb von Zweigen klicken , es lib Staging gibt. Lib Staging ist immer die aktuellste, es ist, wo wir die meisten Dinge, die meisten Änderungen, machen Anpassungen. Es ist immer die Arbeit in Arbeit, bevor es tatsächlich zu meistern gedrängt wird. Also, weil wir die neue wollen, die geheime neue, gehen wir voran Ich werde lib Staging und Sie werden nur auf diese grüne Schaltfläche klicken, die sagt „Clone or Download“ und dann werden Sie sagen „Download zip.“ Nun, was dies tut, ist das Herunterladen der gesamten HYPE-Bibliothek, einschließlich des Quellcodes und alles. Aber wir wollen es innerhalb von Processing verwenden. Sie werden also feststellen, dass, wenn Sie zu Ihrer Dokumentendatei „ Verarbeitung“ gehen , ein Ordner namens „Bibliotheken“ vorhanden ist. Im Falle dieses speziellen Beispiels ist mein Ordner leer. Also, ich werde die Zip entpacken, die ich gerade heruntergeladen habe und ich sollte diese Anleitung bekommen. Was das hat, ist es Referenz und Beispiele und Ressourcen hat. Wirklich das einzige, was Sie sich ansehen müssen, ist der Distributions-Ordner. Die Verteilung bedeutet, dies ist der aktuelle Build, den Sie innerhalb Ihres Dokumentverarbeitungsbibliotheksordners verschieben können. Also, gehen Sie in Distribution und Sie werden feststellen, dass es HYPE.jar und HYPE.zip gibt. Lassen Sie uns voran und zip HYPE.zip, und es wird diesen Ordner namens HYPE erstellen und Sie werden nur gehen, um diesen Ordner in Ihre Verarbeitungsbibliotheken Ordner ziehen. Also, innerhalb dieses HYPE sollten Sie Beispiel, Bibliothek, Referenz und Quelle haben . Wenn Sie sich Beispiele wie „Oh mein Gott, es gibt eine Menge Beispiele hier.“ Wenn wir nun die Verarbeitung der IDE starten würden, würden Sie feststellen, dass, wenn Sie kommen, es mir wahrscheinlich sagen wird, dass ich aktualisieren soll. Nein, ja, nein. Gehen wir zur Skizze Import-Bibliothek. Sieh mal, du solltest HYPE dort nicht sehen. Also jetzt, HYPE ist eine richtige Verarbeitungsbibliothek. Also, die Frage ist, ob das heißt, kann ich das in einem Browser verwenden? Nein. Sie können dies nicht in einem Browser verwenden. Wenn Sie möchten, dass es Ihre Sachen in JavaScript ausgibt, schlage ich nicht vor, diese Umgebung zu verwenden oder schauen Sie sich das Projekt p5.Js an, das passiert, das Verarbeitung für den Browser in JavaScript ist. Aber wenn Sie alle diese Klassendateien aktualisieren möchten, die ich in den letzten Jahren gemacht habe, bin ich jetzt auf das System umgezogen, wo Sie Processing 3 verwenden werden, und dann verwenden Sie HYPE die Verarbeitungsbibliothek. Also, cool. Also, wir haben das in Processing und nur zum Teufel davon, wenn ich das beiseite schieben würde und hier sind einige der Skillshare und Gumroad Klassen, an denen ich gearbeitet habe. Sie werden bemerken, wenn ich zu Programming Graphics 001 gehe, habe ich jetzt in diese Zip alle Updates für diesen Code aufgenommen , um Processing 3 zu verwenden und HYPE die Bibliothek zu verwenden. Wenn Sie also zu gehen, sagen wir einfach, Zeichnen Visual Assets und Sie sollten gehen und in den Ordner schauen, werden Sie feststellen, dass Hype.pde jetzt vollständig aus allen Projekten entfernt wird. Wenn Sie auf build.pde klicken, werden Sie hier oben feststellen, dass wir eine neue Struktur haben, die jetzt ist, dass es eine richtige Verarbeitungsbibliothek hat, müssen Sie HYPE als externe Bibliothek importieren. Also, an der Spitze, können Sie sehen, ich habe gesagt Import Hype.Asterix, was bedeutet, geladen in. Wenn Sie andere Dinge verwenden möchten, also wenn Sie nur HYPE importieren, erhalten Sie die nackten Bones, die benötigt werden, um HYPE mit Processing 3 zu verwenden. Wenn du zusätzliche Sachen wie „Hey, ich benutze einen Farbpool oder ich benutze ein Gitter-Layout.“ Dann müssen Sie auch die Klasse manuell importieren, die alles behandelt, was Sie verwenden möchten. Das Beste ist, in ein Beispiel zu gehen und zu sagen: „Hey, ich möchte einen Oszillator benutzen.“ Also, wenn man Oszillatoren sieht, merkt man : „Oh, ich muss Oszillator importieren.“ Das bedeutet, dass dies die HYPE-Bibliothek sehr dünn hält, während Sie vorher mit Hype.pde alles importieren, auch wenn Sie alles verwenden. Also, das ist schlank, das ist gemein, es ist viel effizienter als eine richtige Verarbeitungsbibliothek, Sie importieren die Klassen, mit denen Sie sprechen möchten. Also noch einmal, schauen Sie sich den Ordner Beispiele an, es wird Ihnen zeigen, wie Sie Dinge strukturieren. Darüber hinaus, wenn Sie sich diese Zip-Datei ansehen, werden Sie sehen, dass alle Dateien dort sind, genau wie sie zuvor waren, aber sie alle wurden aktualisiert, um diese neue Struktur zu unterstützen. Ich werde das für alle Klassen tun und ich werde diese Struktur natürlich für alle neuen Klassen verwenden, die in Zukunft gehen. Hoffe, das hilft. Chatten Sie bald. 58. Weitere kreative Kurse auf Skillshare: