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

Layout

LinkedIn Learning kostenlos und unverbindlich testen!

Jetzt testen Alle Abonnements anzeigen
Ausgangspunkt jeder Oberfläche ist stets ein grundlegendes Layout. Setzen Sie dafür auf die Mechanismen Anchoring und Docking, sowie auf die vorgefertigten LayoutControls.
07:09

Transkript

Wir schauen uns jetzt einmal ein bisschen das Layouting bei Windows Forms an. Wir ziehen uns dazu einen Panel in unsere Form, platzieren es etwa in der Mitte und legen hier mal rechts unter "Eigenschaften" den Borderstyle, also den Rand auf "fixing" fest. Normal hat unser Panel keinen Rand. Wenn ich das hier festlege, sieht man, habe ich einen schwarzen Rand. Ich führe das Ganze einmal aus, und wenn ich hier die Form nach rechts vergrößere, bleibt das Panel relativ zu dieser linken und oberen Ecke konstant. Das sieht man auch, wenn man das jetzt hier unten in der Größe verändert. Wenn ich von hier oben die Form nach unten verkleinere, dann sieht man, bleibt dieser Abstand konstant. Auch von links nach rechts bleibt dieser Abstand konstant. Das sind die so genannten Anchor. Anchor sind mehr oder weniger Ankerungspunkte, die diesem Panel hier in der Mitte sagen, dass der Abstand von hier zu diesem Bereich, also zu der äußeren Kante des umgebenden Control, das ist in diesem Fall der Form, konstant bleiben soll. Diese Anchor kann ich hier im Eigenschaften-Fenster festlegen. Das heißt, momentan ist es auf "top left" eingestellt. Wir entfernen die einfach mal alle und führen das nochmal aus. Und dann sehen wir, dass der Abstand nach oben nicht mehr konstant ist, und nach links auch nicht. Es hat nirgendwo angeankert. Wenn wir hingehen und legen an dieser Stelle einen neuen Anchor fest, und zwar nehmen wir jetzt mal alle vier Seiten, dann bleibt der Abstand zu allen vier Seiten konstant. Und egal wie wir unsere Form vergrößern, der innere Bereich, also dieses Panel, wächst immer mit und hält zu allen Rändern einen konstanten Abstand. Das ist immer sehr hilfreich, wenn man sich so eigene Layouts aufbaut, dass man eben diese Controls fest verankern kann. Und wenn man dann die Form dann in irgendeiner Weise in der Größe verändert, bleiben diese Proportionen eben erhalten. Das Zweite, was wir uns angucken möchten, ist das Docking. Beim Docking kann ich am Control sagen, dass er den komplett verfügbaren Bereich zum Beispiel oben belegen soll oder den komplett verfügbaren Bereich links, rechts, unten, oder ob er eben alles ausfüllen soll. Das Docking findet man ebenfalls rechts hier in dieser Eigenschaften-Liste. Hier unter "Dock" habe ich die Möglichkeit, die verschiedenen Docking-Möglichkeiten "oben", "links", "unten", "rechts" oder "füllen" zu wählen oder eben gar nichts. Wenn ich "oben" auswähle, dann wird diese Form hier oben angedockt, ich kann sie also nicht mehr entfernen. D.h. das Panel dockt jetzt quasi am oberen Bereich dieser Form an, füllt den kompletten Bereich von links bis rechts aus, und die einzige Möglichkeit die ich jetzt hier noch habe, dieses Panel zu verändern, ist in der Höhe. Jetzt gibt es hier natürlich verschiedene Dock-Styles. Wir versuchen jetzt mal den Dock-Style "links", sieht man er ist links angedockt, und ich kann jetzt auch nur noch hier dieses hier bestimmen, aber nicht mehr die Höhe, weil er eben links angedockt ist. Zusätzlich kann ich jetzt noch hier unten sagen, ich könnte es nach unten andocken. Dann habe ich noch die Möglichkeit, das hier zu bestimmen und rechts natürlich ebenfalls möglich. Und dann auch ein relativ interessanter Fall ist das "Dock-Fill", d.h. dass er den gesamten verfügbaren Platz ausfüllt. Mit den Dingen, die wir jetzt gesehen haben, kann man natürlich schon erste Layouts erstellen. Allerdings sollte man vorher immer sich diese Container-Controls hier links an der Seite anschauen. Da haben wir so etwas z.B. wie ein Flow-Layout-Panel, das kann ich hier kurz mal hier reinziehen, und in diesen Flow-Layout-Panel kann ich jetzt andere Steuerelemente hinzufügen. Diese Steuerelemente kann ich nicht platzieren, sondern die werden hintereinander aufgelistet, und sobald die Zeile zu Ende ist, wird eine neue Zeile angefangen. Das ist ein sehr hilfreiches Mittel, und davon gibt es hier unten noch ein paar mehr. Wir haben das Panel gerade gesehen. Wir haben den Split-Container. Beim Split-Container habe ich eben in der Mitte so eine Leiste, die ich hin- und herschieben kann, und dann auf der linken Seiten einen Panel und auf der rechten Seite einen Panel. Und dann kann ich natürlich das Ganze auch in meinem Programm verändern. Auch das eignet sich sehr gut zum Layouting. Dann haben wir natürlich noch das Tap-Control, Untap-Control. Das kann ich auch mal hier reinziehen. Und dieses Tap-Control hat hier oben mehrere von diesen Tap-Reitern. Und bei diesen Tap-Reitern kann ich unten, über ein Property "Tap Pages" kann ich neue Tap-Pages hinzufügen, und dann werden die hier oben aufgelistet. Und auch das könnte ich z.B. hier mit "Dock-Fill" quasi so einstellen, dass es den ganzen verbleibenden Platz auf dieser Form einnimmt. Dann haben wir so ein Table Layout Panel. Und diesem Table Layout Panel haben wir eine  Anzahl von Spalten und Zeilen und können diese dann anpassen und daran unsere Controls platzieren. Um am Ende mal so ein Layouting ein bisschen zu demonstrieren, bauen wir einfach mal so eine mehr oder weniger kleine Anwendung. Ich würde mal sagen, so etwas ähnliches wie Word. Zunächst fangen wir natürlich immer bei allem an mit so einem Menu-Strip oben, d.h. oben mit so einer Menü-Leiste. Dann nennen wir es "erste Datei" und hier mal "Bearbeiten". Und in dem "Datei" haben wir mal ein "Beenden". Zusätzlich haben wir in solchen Textverarbeitungsdateien immer unten so ein Tool-Strip. In diesem Tool-Strip haben wir dann z.B. eine Progress-Bar, die uns irgendwelche Zustände, die im Hintergrund laufen, anzeigen, also welchen Fortschritt die haben. Dann haben wir meistens noch einen Bereich, in dem wir unseren Text ändern können. Dazu gibt es hier das Rich-Text-Box-Element. Das Rich-Text-Box-Element ziehen wir hier rein. Und das soll den ganzen Platz ausfüllen, also stellen wir das Docking auf "Fill", und dann führen wir unsere Anwendung mal aus. Und dann haben wir hier quasi so ein grobes Layouting gemacht. Wir haben hier oben eine funktionierende Menü-Leiste, also funktionierend im Sinne von, dass sie auf der Oberfläche dargestellt wird und bestimmte Aktionen macht, dass ich z.B. dieses Untermenü anzeigen kann. Hier habe ich eine Textbox in der ich Text eingeben kann. Und hier unten habe ich eine Statusleiste. Das Beispiel jetzt gerade war relativ schnell. Es ging jetzt einfach nur darum zu sehen, wie schnell mal eigentlich mit Windows Forms solche relativ hübsch aussehenden Oberflächen designen kann, und dass das eigentlich gar kein großes Hexenwerk ist. Wir haben uns in diesem Video angeschaut, wie man das Layouting in Windows Forms macht. Zunächst haben wir die Möglichkeit des Anchoring. Beim Anchoring können wir die Abstände zu linken, rechten, oberen oder unteren Kanten eines umgebenden Controls festlegen und sagen, dass dieser Abstand fix ist. Wir haben gesehen, wenn wir links, rechts, oben und unten festgelegt haben, dann hatten wir nämlich dieses Panel. Und dieses Panel hat sich, egal welche Seite wir verändert haben von dieser Form, immer mitverändert, so dass der Abstand konstant war. Das zweite Layout-Verfahren, das wir uns angekuckt haben, war das Docking. Beim Docking kann ich dem Control sagen, sie sollen sich an der oberen Seite, an der unteren Seite, links oder rechts andocken oder den gesamten verfügbaren Platz ausfüllen. Wenn ich sage, es soll sich beispielsweise oben andocken, dann wandert das Control nach oben, füllt die gesamte Breite aus, und die einzige Möglichkeit, die ich habe, dieses Control zu verändern, ist in der Höhe an der unteren Kante. So kann ich eben relativ schnell sehr schöne Layouts erstellen, also in Kombination von Anchoring und Docking. Wenn wir so ein Layout erstellen wollen, können wir auf bereits bestehende Layout-Controls zurückgreifen. Wir haben gesehen, es gibt so ein Table Layout Panel, es gibt einen Split-Container, es gibt natürlich die normalen Panels und Tab-Pages. Und mit diesen Sachen kann man eigentlich schon die meisten Layouting-Anforderungen unter Windows Forms mit durchführen, und das alles geht relativ schnell. Wie schnell das geht, haben wir uns am Ende angeguckt. Wir haben mal so eine kleine Textverarbeitung gebaut, und das war innerhalb von einer halben Minute ungefähr getan. Natürlich hat das nicht viele Funktionen, aber die Geschwindigkeit vom Design dieser Oberfläche war eigentlich schon relativ beeindruckend.

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!