Am 14. September 2017 haben wir eine überarbeitete Fassung unserer Datenschutzrichtlinie veröffentlicht. Wenn Sie video2brain.com weiterhin nutzen, erklären Sie sich mit diesem überarbeiteten Dokument einverstanden. Bitte lesen Sie es deshalb sorgfältig durch.

Visual C# 2011 Grundkurs

Der Designer

LinkedIn Learning kostenlos und unverbindlich testen!

Jetzt testen Alle Abonnements anzeigen
Der Designer hilft uns dabei, auf grafische Art und Weise Oberflächen zu entwerfen, ohne Code schreiben zu müssen. Außerdem erfahren Sie, welche Hilfestellungen der Designer darüber hinaus bietet.
07:27

Transkript

Wir schauen uns jetzt mal den grafischen Designer für Windows Forms innerhalb von Visual Studio an. Der grafische Designer ist ein Hilfsmittel, was uns dabei hilft, Oberflächen zu designen. Normal müssten wir diese Oberflächen alle in Code schreiben. Das heißt wir müssten z.B. für diese Form hier hinten, das ist eine sog. Form, müssten wir eine Klasse erstellen. Diese Klasse müssten wir dann z.B. einen Button hinzufügen. Diesen Button müssten wir positionieren. Diesen Button müssten wir eine Aufschrift geben und das alles im Code machen. Deswegen kann ich im Designer das Ganze ein bisschen einfacher machen, weil das ziemlich kompliziert ist und kann z.B. sagen, wenn ich einen Button haben will, dann nehme ich den Links hier aus der sogenannten Toolbox und ziehe ihn per Drag & Drop hier auf dieses "Control". Damit habe ich einen Button erstellt. Wenn ich das Ganze jetzt hier oben ausführe, habe ich zum einen diese Form im Hintergrund und diesen Button. Und diesen Button kann ich bereits klicken. Auf diesem Button ist ein Text drauf und alles andere, was man von einem Button auch erwartet. Was Visual Studio im Hintergrund macht. Visual Studio generiert uns aus dem Design heraus im Hintergrund Code. Diesen Code können wir uns hier in der "Form1.Designer.cs" anschauen. Mit einem Rechtsklick darauf, schauen wir uns den Code einmal an und sehen hier, das da eine ganze Menge Code schon generiert wurde. Unter anderem wurde hier ein neues Objekt für unseren Button angelegt. Der Button ist eine normale Klasse. Und an dieser Stelle wird der Button dann parametisiert. D.h. er befindet sich an einer bestimmten Location, also an einer bestimmten Position. An der X-Koordinate 220, an der Y-Koordinate 104. Hat eben hier einen Namen, hier unten ist die Aufschrift des Button und hier befindet sich z.B. die Größe. Wir schauen jetzt hier mal 75 und 23, wenn wir diesen Button jetzt ein bisschen größer ziehen, dann sehen wir, dass die Größe hier angepasst wird. Also "Visual Studio" pflegt diese Code-Datei die ganze Zeit, sobald wir etwas im Designer ändern. Tun Sie sich selber den Gefallen und ändern Sie an dieser Datei nie irgend etwas, weil der Designer ist da sehr sehr penibel. Und wenn man irgendeinen kleinen Fehler macht, dann verzeiht einem das der Designer eher selten und bestraft einen dafür mit zahlreichen Fehlermeldungen, die einem nicht immer unbedingt helfen, diesen Fehler dann auch tatsächlich zu finden. Deswegen am besten in dieser Datei nie irgendwas machen. Also der Designer hilft uns schon einmal, Code zu generieren. Das ist super. Wo uns der Designer noch hilft, ist bei der Platzierung z.B. von diesen sogenannten "Controls". Wenn ich jetzt hier z.B. einen Button nehme und nähere mich mit diese Button der linken Seite, dann merkt man, dass irgendwann hier dieser blaue Strich erscheint und dann ist das "Control" für einen Moment in dieser Stellung. D.h. das ist ein Mindestabstand. Damit hilft, im Visual Studio das ich immer schön links, rechts, oben und unten-- das gilt übrigens überall, wie man hier sieht-- immer Abstand zu meiner Form zu halten, damit es nachher eben auch ordentlich und sauber aussieht. Und wir löschen diesen Button mal und ziehen mal einen Button hinein und platzieren ihn rechts unten mit Hilfe dieser Snap-Funktion. Wenn wir dann einen zweiten Button nehmen und möchten diesen Button jetzt auf derselben Höhe platzieren wie unser anderer Button, dann nähern wir uns der ganzen Sache wieder an. Man sieht hier schon, es wird so eine magentafarbene Linie angezeigt. D.h. dass jetzt beide Buttons mittig ungefähr ausgerichtet sind und zusätzlich mit der Snap-Funktion nach unten und dieser Abstandsfunktion nach rechts zu einem anderen "Control" können wir die jetzt wunderbar nebeneinander platzieren. Das ist also auch ein sehr hilfreiches Feature innerhalb dieses Designers, was uns dann hilft wirklich schön symmetrische Designs zu entwickeln. Ein anderes Hilfsmittel im Designer ist hier unten rechts das Eigenschaftenfenster. Das Eigenschaftenfenster, falls es bei Ihnen nicht sichtbar ist, gehen Sie oben auf "Ansichten" und dann unten "Eigenschaftenfenster". Alternativ können Sie F4 drücken. In diesem Eigenschaftenfenster werden jetzt die Eigenschaften dieser Form dargestellt. Wir haben eben gesagt, dass der Button dort unten z.B. eine Klasse ist. Eine Klasse hat Eigenschaften und diese "Controls" haben sehr viele Eigenschaften. Und alle diese Eigenschaften finde ich hier in diesem Eigenschaftenbereich und kann die ganz bequem ändern. Z. B., ich habe hier einmal unsere Form markiert und in der Form habe ich hier in dem Eigenschaftenfenster eine Eigenschaft "Text". Dieser Text ist der Text, der hier oben in der Titelzeile angegeben wird. Wir nennen das mal "Hello World Windows Forms". So. Sobald wir jetzt einen Klick hierhin machen, wird das Ganze übernommen. Man sieht es wird in unserem Designer sofort geupdatet. Dann gehen wir mal hier unten auf einen Button und auch so ein Button hat so ein Textproperty und wir sagen hier mal, da steht "OK" und auf dem Button hier steht "Abbrechen". So wie es halt in normalen Windowsdialogen der Fall ist. Das sieht ja schon eigentlich ganz gut aus. Das war jetzt nur eins von diesen Eigenschaften, aber es gibt natürlich sehr sehr viele hier drin. Man kann das mal ganz in Ruhe durchgucken und im Laufe dieses Kapitels werden wir uns noch das eine oder andere noch genauer anschauen. Es gibt in "Visual Studio" ein weiteres nützliches Fenster. Das finden wir unter "Ansicht" und dann unter "Weitere Fenster" und dann unter "Dokumentengliederung". In der Dokumentengliederung wird hier so eine Art Baumstruktur von unserer Form dargestellt. D. h., wenn ich jetzt hier neue Elemente hineinziehe, dann werden die innerhalb meiner Dokumentengliederung angezeigt. Wir nehmen mal die Dokumentengliederung, docken die einmal hier unten an. Ich kann diese einzelnen Fenster nehmen und sie andocken,wo ich möchte. So, damit wir quasi gleichzeitig die Toolbox und die Dokumentengliederung haben. Ich platziere jetzt mal auf meiner Form ein sogenanntes Panel. Und ein Panel ist so ein Inhaltssteuerelement, d.h. ich kann jetzt hier drin z.B. einen Button erzeugen und dann kann ich das Ganze so hier verschieden. Ja ich kann hier drin quasi eine eigene Form in der Form machen, aber es ist eben keine Form, sondern ein sogenanntes Panel. So und jetzt machen wir in dieses Panel mal noch ein Panel rein. Und in diesem Panel platzieren wir mal noch einen Button. Also das könnte ich jetzt hier munter hin- und herschieben. Wenn ich mir jetzt hier und die Dokumentengliederung angucke, dann habe ich hier genau diese Struktur. Ich habe auf der obersten Ebene unsere Form. Dann habe ich das erste Panel, das ist dieses umgebene hier, das ich durch die Gegend schieben kann. Und auf derselben Ebene sind hier unten diese Buttons. In diesem Panel befindet sich noch mal ein anderes Panel und in diesem Panel befindet sich noch ein Button. In dem Panel hier oben befindet sich aber auch ein Button und später, wenn man größere Oberflächen hat, dann kann das ganz schnell sehr verwirrend werden. Wenn man viele "Controls" auf dieser Oberfläche hat und die nicht immer sofort selektieren kann und nicht genau weiß, in welche Ebene die gehören. Da ist diese Dokumentengliederung eine sehr sehr nützliche Hilfe und deswegen sollten Sie sich direkt von Anfang an daran gewöhnen, damit zu arbeiten. Wir haben uns in diesen Video mal den Designer für Windows Form in Visual Studios angeschaut. Wir haben zunächst gesehen, dass der Designer uns auf grafische Art und Weise unterstützt und wir keinen lästigen Code schreiben müssen, sondern einfach nur unsere "Controls" so wie man das intuitiv macht, auf unserer Oberfläche platzieren kann und dann ganz einfach über das Eigenschaftenfenster rechts diese Eigenschaften von diesen eigentlichen Objekten, die man dort benutzt, ganz bequem ändern kann. Dieser Code, der von Visual Studio generiert wird, haben wir gesehen, wird in dieser "Designer.cs"-Datei gespeichert. Dieser Code wird, wie gesagt, vom Designer geschrieben und er sollte nur vom Designer geschrieben werden und nicht von Ihnen. Deswegen tun Sie sich den Gefallen, bleiben Sie aus Ihrer Datei heraus und ändern Sie dort nie irgendwas. Wenn wir auf unserer Oberfläche "Controls" platzieren, dann hilft uns dieser Designer auch. Er hilft uns z.B., Abstände richtig einzuhalten. Er hilft uns, "Controls" gut im Verhältnis zu anderen "Controls" auszurichten, mit eben diesen Snap-Linien. Und das haben wir jetzt am Beispiel des Buttons gesehen, aber das funktioniert natürlich mit allen von diesen "Controls", die Sie links in der Toolbox finden. Wenn wir von diesen eigentlichen Objekten, die wir dort auf unserer Oberfläche platzieren, irgendwelche Eigenschaften ändern wollen, haben wir dann das Eigenschaftenfenster. Im Eigenschaftenfenster werden all die Eigenschaften angezeigt, die wir ändern können und direkt auf unserer Oberfläche sieht man dann diese Änderung. Als letztes nützliches Helferlein haben wir uns hier die Dokumentengliederung angeguckt. In der Dokumentengliederung wird der Inhalt unserer Form mehr oder weniger in einer baumartigen Struktur dargestellt und das hilft uns somit dabei, unsere Oberfläche besser zu verstehen und vor allen Dingen, gezielter "Controls" auszuwählen.

Visual C# 2011 Grundkurs

Steigen Sie in die C#-Programmierung ein und lernen Sie sowohl die Grundlagen der Sprache C# als auch die Entwicklungsumgebung Visual Studio 2010 und .NET-Framework kennen.

7 Std. 28 min (81 Videos)
Derzeit sind keine Feedbacks vorhanden...
 
Hersteller:
Software:
Visual Studio Visual Studio 2010
Exklusiv für Abo-Kunden
Erscheinungsdatum:27.06.2011

Dieser Online-Kurs ist als Download und als Streaming-Video verfügbar. Die gute Nachricht: Sie müssen sich nicht entscheiden - sobald Sie das Training erwerben, erhalten Sie Zugang zu beiden Optionen!

Der Download ermöglicht Ihnen die Offline-Nutzung des Trainings und bietet die Vorteile einer benutzerfreundlichen Abspielumgebung. Wenn Sie an verschiedenen Computern arbeiten, oder nicht den ganzen Kurs auf einmal herunterladen möchten, loggen Sie sich auf dieser Seite ein, um alle Videos des Trainings als Streaming-Video anzusehen.

Wir hoffen, dass Sie viel Freude und Erfolg mit diesem Video-Training haben werden. Falls Sie irgendwelche Fragen haben, zögern Sie nicht uns zu kontaktieren!