Nachdem Sie sich mit XAML vertraut gemacht haben, lassen Sie uns als Teil dieser Lernreihe etwas darüber erfahren Silverlight-Layoutsteuerelemente. Das Anordnen der Steuerelemente beim Entwerfen einer Website ist sehr schwierig, da es eine Vielzahl von Browsern gibt und aufgrund unterschiedlicher Bildschirmauflösungen. Wenn Sie jedoch eine Anwendung für Windows Phone entwerfen, können Sie als Entwickler die Steuerelemente besser einrichten, da Windows Phone OS über einige verfügt vordefinierte Bildschirmanforderungen.

Nun werden wir uns die einzelnen Layout-Steuerelemente ansehen. Alle Layout-Steuerelemente können aus der Symbolleiste in den Designer-Bildschirm gezogen werden.

Gitter:

Mit dem Rastersteuerelement können Sie die Anzahl der Zeilen und Spalten hinzufügen und dann Steuerelemente entsprechend in diese Zellen einfügen. Sie können die Zeilen und Spalten entweder über den Code oder über den Designer-Bereich selbst definieren. Durch das Starten und Beenden von Tags wird ein Raster erstellt. () Jetzt, nachdem das Raster definiert wurde, können Sie diesen Code hinzufügen, um mehrere Zeilen und Spalten hinzuzufügen.

Sie können später nach Bedarf mehrere Spalten oder Zeilen hinzufügen. Das Sternchen (*) gibt an, dass die untergeordnete Spalte / Zeile zusätzlichen Platz erhalten sollte, falls vorhanden! Es gibt viele Eigenschaften, mit denen Sie herumspielen können, um die erwartete Funktionalität zu erhalten.

Sie können Zeilen und Spalten auch erstellen, indem Sie in der gewünschten Länge auf den Gitterrand klicken. Das ist viel einfacher, oder? Nachdem Sie ein Raster erstellt haben, können Sie Steuerelemente zwischen Zellen platzieren, indem Sie die Eigenschaften von grid.row und grid.column erwähnen. (Denken Sie daran, dass die Werte für diese Eigenschaften mit 0 beginnen).

Stack Panel:

Stack Panel ist ziemlich einfach. Alle Steuerelemente, die im Stapelbereich platziert sind, werden im vertikalen Stapel angezeigt. Nachdem Sie ein Stack-Panel erstellt haben, können Sie einfach Steuerelemente zwischen den Start- und End-Tags des Stack-Panels hinzufügen.

Segeltuch:

Im Canvas-Bereich können Sie Steuerelemente auf dem Bildschirm platzieren, wo sie angezeigt werden sollen. Anstelle von Marge wird also die catch-Eigenschaft verwendet. Die Leinwand hat jedoch einen Fehler beim Rendern, da bei einer Änderung der Abmessungen des Telefons oder der Ausrichtung des Telefons unerwünschte Ergebnisse auftreten können.

Hier sehen Sie, wir definieren die Position des Textblocks mithilfe der angefügten Eigenschaft der Leinwand. Wenn Sie nun unsere Leinwand verschieben, bewegen sich die Steuerelemente mit.

Damit ist unser Layout-Tutorial zu Ende. Denken Sie daran, während Sie Steuerelemente anlegen, überprüfen Sie diese sowohl im Hoch- als auch im Querformat. Im nächsten Tutorial lernen wir XAML-Ereignisse sowie Eingabesteuerelemente kennen.

Top-Tipps:
Kommentare: