Abschnitt & SektionSpalte

Die und SectionColumn Komponenten Section bieten ein responsives mehrspaltiges Layout zur Organisation von Formularfeldern und Inhalten. Die Spalten sind horizontal angeordnet und werden automatisch in die nächste Zeile umgewickelt, wenn die verfügbare Breite begrenzt ist.

Säulen

Platziere eine oder mehrere SectionColumn Komponenten in ein Section. Die Säulen verteilen sich gleichmäßig über die verfügbare Breite. Verwenden ColumnCount Sie, um explizit die Anzahl der Spalten festzulegen (1–4); wenn weggelassen, wird standardmäßig die Anzahl der SectionColumn Kinder verwendet.

Minimale Spaltenbreite

Stelle auf ColumnMinWidth die Section Steuerung ein, wenn Spalten in die nächste Zeile umlaufen. Wenn die verfügbare Breite pro Spalte unter diesen Schwellenwert fällt, stapeln sich die Spalten vertikal. Standardmäßig gilt 340px.

Spaltenbreiten

Benutze Width a, SectionColumn um ihm einen größeren oder kleineren Anteil der Reihe zu geben. Breiten sind Verhältnisse, keine CSS-Prozentsätze: drei Spalten mit Width="3", Width="4", Width="3" angeordnet als 30 % / 40 % / 30 % (3 + 4 + 3 = 10 Teile). Spalten ohne Rückgriff Width auf die Standard-Gleichverteilung.

Kopf- und Fußseiten

Sowohl als auch SectionColumn Section unterstützen HeaderText/Header und FooterText/ ParameterFooter. Verwenden HeaderText Sie sie für einfache Textüberschriften oder Header für benutzerdefinierte Render-Fragment-Inhalte.

Grenzen

Setze BorderVisible="true" es auf ein Section oder SectionColumn um einen Rand darum herum zu zeigen. Die Ränder können unabhängig auf den Abschnitt und jede Spalte gesetzt werden.

Inhaltsorientierung

Standardmäßig werden Editor-Komponenten innerhalb von a SectionColumn vertikal gestapelt. Stelle sie stattdessen so ein, ColumnContentOrientation="ComponentOrientation.Horizontal" dass sie horizontal ausgelegt werden. Verwenden HorizontalGap Sie und VerticalGap um den Abstand zwischen den Gegenständen zu kontrollieren.