Angenommen, ich möchte TextBlock
, dass ein Width
Wert dem übergeordneten Container Width
(dh von Seite zu Seite) oder einem Prozentsatz des übergeordneten Containers entspricht Width
. Wie kann ich dies erreichen, XAML
ohne absolute Werte anzugeben?
Ich möchte dies tun, damit, wenn der übergeordnete Container-Container später erweitert wird (sein " Width
erhöht"), seine "untergeordneten Elemente" ebenfalls automatisch erweitert werden. (im Grunde wie in HTML und CSS)
Antworten:
Um es auf die gleiche Größe wie den übergeordneten Container zu dehnen, verwenden Sie das folgende Attribut:
Dadurch wird das Textbox-Element horizontal gestreckt und der gesamte übergeordnete Bereich horizontal ausgefüllt (dies hängt tatsächlich vom übergeordneten Bedienfeld ab, das Sie verwenden, sollte jedoch in den meisten Fällen funktionieren).
Prozentsätze können nur mit Rasterzellenwerten verwendet werden. Eine weitere Option besteht darin, ein Raster zu erstellen und Ihr Textfeld mit dem entsprechenden Prozentsatz in eine der Zellen einzufügen.
quelle
Sie können die Textfelder in ein Raster einfügen, um Prozentwerte für die Zeilen oder Spalten des Rasters zu erstellen, und die Textfelder automatisch in ihre übergeordneten Zellen füllen lassen (wie dies standardmäßig der Fall ist). Beispiel:
Dies ergibt # 1 2/5 der Breite und # 2 3/5.
quelle
In der Regel verwenden Sie ein für Ihr Szenario geeignetes integriertes Layout-Steuerelement (z. B. ein Raster als übergeordnetes Element, wenn Sie eine Skalierung relativ zum übergeordneten Element wünschen). Wenn Sie dies mit einem beliebigen übergeordneten Element tun möchten, können Sie einen ValueConverter erstellen, der dies jedoch wahrscheinlich nicht ganz so sauber macht, wie Sie möchten. Wenn Sie es jedoch unbedingt benötigen, können Sie Folgendes tun:
Was so verwendet werden kann, um ein untergeordnetes Textfeld 10% der Breite seiner übergeordneten Zeichenfläche zu erhalten:
quelle
CultureInfo.InvariantCulture
zur doppelten Konvertierung hinzuzufügen , da diesparameter
alsstring
und in Kulturen mit unterschiedlichen Konvertierungendecimal separator
nicht wie erwartet funktioniert.Für alle, die eine Fehlermeldung erhalten wie: '2 *' Zeichenfolge kann nicht in Länge konvertiert werden.
quelle
<RowDefinition Height="auto" />
?Die IValueConverter-Implementierung kann verwendet werden. Konverterklassen, die von IValueConverter vererbt werden, verwenden einige Parameter wie
value
(Prozent) undparameter
(übergeordnete Breite) und geben den gewünschten Breitenwert zurück. In der XAML-Datei wird die Breite der Komponente auf den gewünschten Wert festgelegt:XAML:
quelle
Ich weiß, dass es nicht Xaml ist, aber ich habe dasselbe mit dem SizeChanged-Ereignis des Textfelds gemacht:
Das Textfeld scheint 80% der Größe des übergeordneten Felds zu haben (der rechte Rand beträgt 20%) und wird bei Bedarf gedehnt.
quelle
Ich benutze zwei Methoden für die relative Dimensionierung. Ich habe eine Klasse namens
Relative
mit drei angefügten EigenschaftenTo
,WidthPercent
undHeightPercent
das ist nützlich , wenn ich ein Element soll eine relative Größe eines Element überall in der visuellen Struktur sein und fühle mich weniger hacky als die Konverter Ansatz - obwohl die Verwendung , was für Sie, dass Sie bin glücklich mit.Der andere Ansatz ist eher gerissen. Fügen Sie eine Stelle hinzu,
ViewBox
an der Sie relative Größen möchten, und fügen Sie dann eineGrid
bei Breite 100 hinzu. Wenn Sie dann eineTextBlock
mit einer Breite von 10 hinzufügen , sind dies offensichtlich 10% von 100.Das
ViewBox
wirdGrid
entsprechend dem Platz skaliert, den es erhalten hat. Wenn es also das einzige auf der Seite ist,Grid
wird das in voller Breite skaliert und effektiv wirdTextBlock
es auf 10% der Seite skaliert.Wenn Sie keine Höhe für das festlegen
Grid
, wird es verkleinert, um seinem Inhalt zu entsprechen, sodass alles relativ groß ist. Sie müssen sicherstellen, dass der Inhalt nicht zu groß wird, dh das Seitenverhältnis des zugewiesenen Speicherplatzes ändert,ViewBox
um die Höhe zu skalieren. Sie können dies wahrscheinlich mit einemStretch
von umgehenUniformToFill
.quelle