2009-07-02 12 views
11

Ich bin auf der Suche nach einer Meinung über die Verwendung von Canvas vs. Grid Panels in WPF. Ich muss klassische Eingabeformulare erstellen, die im Grunde Raster-Layouts haben, einige können kleine Datargids innerhalb haben, Gruppenboxen, aber alle im Raster-Layout ausgerichtet. Ich habe Probleme mit der Verwendung des Grid- oder Canvas-Bereichs für alle meine Formulare. Grid gibt mir eine gute Struktur; Ich kann die Ausrichtung der Kontrollen leichter aufrechterhalten. Ich werde Basisklasse (die Window-Klasse erbt) für alle Fenster, so dass Designer in Visual Studio wird nutzlos sein, da es Probleme für diese Art der Vererbung hat, und mit Grid-Panel ich brauche nicht wirklich Designer, und ich kann setze das Fenster SizeToContent, damit alles passt. Aber wieder mit Canvas habe ich die Möglichkeit, die Steuerelemente beliebig zu positionieren, und das ist nur ein Vorteil, den ich bei der Verwendung von Canvas sehe.Grid vs. Canvas

Ich hatte nicht viel Erfahrung in WPF, um vorherzusagen, welche Art von Problemen ich von Kundenanfragen auf dem Layout bekommen könnte. Auf Webformularen verwende ich manchmal absolute Positionierung für Formulare, nur für den Fall, dass der Kunde eine "spezielle" Anfrage hat, ob er das Kontrollpixel rechts oder links höher haben soll usw. Jeder, der mit anspruchsvollen Kunden arbeitet, weiß was ich meine.

Ich würde gerne sehen, was Sie denken, was sind Vor- und Nachteile für beide in Business-Anwendung Formularlayout Gebäude? Warum ist einer besser als der andere? Irgendwelche Fälle, in denen ein Panel schlecht zu benutzen wäre und andere nicht? Was sind die Nachteile eines Panels zu einem anderen? Welches Panel würden Sie verwenden?

Dank

Antwort

16

Canvas ist vor allem für benutzerdefinierte Zeichnen Funktionalität mehr als alles andere bestimmt. Das Raster ist definitiv die beste Wahl für die Anpassung Ihres Layouts.

+0

ich mit CSharperWithJava zustimmen - ist ein weitaus praktisches Element für die allgemeine UI-Layout. – Giffyguy

+1

Sie möchten mit einem Grid oder Panel-basierten Layout gehen. Werfen Sie einen Blick auf die MSDN-Übersicht über das WPF-Layoutsystem: http://msdn.microsoft.com/en-us/library/ms745058.aspx – rmoore

+0

Hier ist ein Tutorial, um Starter mit Rasterlayouts zu erhalten: http: // www .wpftutorial.net/GridLayout.html – CodeFusionMobile

2

Bestimmt Grids scheinen, was Sie für Ihre Anforderungen benötigen.

Ich würde Grids zu Tabellen in HTML vergleichen (sehr nützlich, wenn sie entsprechend verwendet werden), während Canvas eher wie ein Div ist. Der Unterschied ist, dass Grids Tabellen sind, die in HTML und ebenso mit Divs vs Canvas sein sollten.

Zum Thema Grids sollten Sie sich Zeit nehmen, Ihre RowDefinitions und ColumnDefinitions zu definieren, statt die Ränder auf Ihre Steuerelemente zu setzen, um alles korrekt zu positionieren. Du wirst es bereuen, wenn du es nicht tust.

+2

Huh ... Sie wissen, dass die Verwendung von Tabellen für Layoutzwecke nicht empfohlen wird, oder? – luiscubal

+0

absolut, aber wegen dieses Beispiels wollte ich etwas als ein Beispiel verwenden, ich dachte, das wäre das beste Beispiel. Wie ich bereits erwähnt habe, sind Grids in WPF Tabellen, die versuchen, in HTML zu sein. –

3

Sie können ziemlich eingehend mit dem tatsächlichen Layout der Gitter, Spalte/Zeile spanning, Breite, Höhe, etc. erhalten

Meiner Meinung nach ist wäre einfacher, das Layout der verschiedenen Elemente auf einem zu tun Raster, indem Sie die Zeilen- und Spaltengröße steuern, als alles, was in einer Zeichenfläche fest codiert ist. Es wird auch die Dinge erleichtern, wenn sie beschließen, später die Auflösung zu ändern.

Von Adam Nathans WPF Unleashed (. S. 168):

eine Leinwand mit Grid Imitieren Wenn Sie verlassen Gitter mit einer einzigen Zeile und Spalte und stellen Sie die Horizontal und Vertical aller Kinder auf andere Werte als Stretch, die Kinder werden die einzelne Zelle wie ein Canvas hinzugefügt. Setzen Sie HorizontalAlignment auf Left und VerticalAlignment auf Top ist wie Einstellung Canvas.Left und Canvas.Top auf 0. Einstellung HorizontalAlignment nach rechts und VerticalAlignment nach unten ist wie Einstellung Canvas.Right und Canvas.Bottom auf 0.Darüber hinaus kann das Anwenden von Margin-Werten auf jedes Element denselben Effekt wie das Festlegen der angefügten Canvas-Eigenschaften für dieselben Werte haben.

Sie können auch mit dem Inhalt Ihrer Steuerelemente im Raster kreativ werden, um eine feinere Ebene der Layoutsteuerung zu erhalten.

Ein Canvas wäre gut für so etwas wie ein Dialogfeld, das selten die Größe ändert und nur ein paar Steuerelemente hat, weil es zeitaufwändig werden würde, alle auszugeben, wenn die Zahl wächst.

Ich persönlich benutze Grids selbst. Es kann ein bisschen mehr Arbeit sein, Dinge auf die Pixelebene zu bringen, aber für die 5% der Zeit, die notwendig ist, lohnt es sich, eine Menge Ärger abstrahieren zu lassen. Es ist auch schön, wenn es erforderlich ist, Zeilen und Spalten im laufenden Betrieb zu ändern, macht der GridSplitter dies zu einem Kinderspiel.

0

Auch wenn Sie VS Designer nicht verwenden können, können Sie dennoch einen visuellen XAML-Designer zum Erstellen/Bearbeiten Ihres Rasterinhalts verwenden.

Einer der wichtigsten UX-Vorteile von WPF/SL/XAML ist die HTML-ähnliche "flüssige" Layout-Funktion. Auch wenn Sie es mit Ihrem aktuellen Design vielleicht nicht brauchen, ist es eindeutig die Zukunft und es lohnt sich, Finesse zu lernen.

prüft Rob Relyea ausgezeichnete Liste der verfügbaren XAML editors

+0

Fehlerhafter Link, bitte korrigieren – kbo4sho88

0

ich mit einem Gitter oder einer spezialisierten Grid Unterklasse gehen würde. Sie haben Recht mit Vererbung anzeigen. Der Visual Studio-Designer in UWP, WPF generiert Support-Code für die Basis und die Unterklasse mit den gleichen Methodennamen. Es kompiliert nicht.

Da ich Generika vor dem Datum bin, können wir zurück zu früheren Methoden gehen. Eine davon ist eine Hilfsklasse. Jede Ansicht implementiert IBaseView und hat eine Eigenschaft ViewHelper oder ViewHelper<T>. enum ViewHelperOptions kann durchaus benötigt werden. Bei Bedarf kann jeder ViewHelp-Benutzer die Vererbung verwenden, ohne Visual Designer zu beschädigen. Dies ermöglicht die Verwendung von generischem Code sowie von spezifischem Sichtcode, ohne das MVVM-Modell zu zerstören. Nennen wir es MVHVM, da der ViewHelper über den ViewHelper verfügt. Dies trennt das V weiter von der VM.

Die vollständige Implementierung erfordert möglicherweise die Verwendung von Activator.CreateInstance. Eine weitere Überlegung sind die Konstruktoren, die vom Designer aufgerufen werden. Sie müssen den Code "will-crash-if-not-running" in eine Initialisierung verschieben, die beispielsweise aus dem Loaded-Ereignis hervorgegangen ist. Alternativ können Sie nutzen (UWP) machen:

if (!Windows.ApplicationModel.DesignMode.DesignModeEnabled) 
{ DoStuffWhichShouldOnlyBeDoneAtRunTime(); }