Begrenzungsbreite der benutzerdefinierten Liste itemrenderer in Flex

Question

Ich verwende einen benutzerdefinierten itemrenderer, um eine Liste von Fotos anzuzeigen, und muss wissen, wie die Breite gesteuert wird. Im Moment tut es dies:

Why so wide? http://tdwright.co.uk/phpplayground/test_tom/img/flex_problem1.png

, die, wie ich bin sicher, Sie werden mir zustimmen, ist Blick bleedingly hässlich.

Die Liste wird wie folgt erstellt:

<mx:Panel width="100%" height="100%" layout="absolute" title="Photos"> 
    <mx:List x="0" y="0" width="100%" height="100%" id="photoList" dataProvider="{photos}" itemRenderer="thumbnails" rowHeight="100"/> 
</mx:Panel> 

Und die itemRenderer Komponente sieht wie folgt aus: in einer ganzen Reihe von Orten

<?xml version="1.0" encoding="utf-8"?> 
<mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml"> 
    <mx:Image source="{data.src}" id="image" scaleContent="true" toolTip="{data.caption}" height="100%" horizontalAlign="center"/> 
</mx:VBox> 

Ich habe versucht, width = "100%" Platzierung , aber ohne Erfolg. Wenn jemand weiß, wie ich das kontrollieren kann, wäre ich sehr dankbar.

Answer 1

Wenn Sie diese Eigenschaften im Inneren des itemRenderer vertical = „off“ horizontalScrollPolicy- = „off“ die Balken gesetzt sind verschwunden

Ich weiß nicht, warum sie für die schreckliche „off“ statt Falsch

wählen

Answer 2

Ein paar Beobachtungen hier, basierend auf einem Miasma ähnlicher schmerzhafter Erfahrungen. (Vorbehalt: Ich habe keine Test-App erstellt, um hier für diesen speziellen Fall alles zu bestätigen.)

Angenommen, Sie möchten die Breite der Liste anhand der Größe der itemRenderer-Elemente anpassen, die sie enthält, der itemRenderer-Elemente müssen Breiteninformationen bereitstellen. Die Verwendung einer VBox auf diese Weise mit zulässigen Bildlaufleisten bedeutet, dass die VBox versucht, zwischen der Größe des Inhalts (Image) und der Größe des übergeordneten Elements zu "entscheiden". Also, als erstes müssen Sie die Bildlaufleisten auf der VBox ausschalten, vorausgesetzt, Sie können die VBox nicht einfach loswerden. (Ich schätze, Sie wollen die VBox, so dass Sie einen Titel oder etwas unter dem Bild als nächsten Schritt setzen können)

Die Liste, wie Sie es angegeben haben, ist zu 100% seiner übergeordneten, das Panel , die selbst zu 100% ihrer Elterngröße ist. Anstatt diese Elemente "von oben nach unten" zu skalieren, sollten Sie ihre Breite nicht angeben, damit Flex die erforderliche Breite von unten nach oben berechnet. Verwenden Sie maxWidth in der Liste oder im Panel, um deren Größe zu beschränken, wenn Sie sie relativ zu ihren Peers festlegen müssen.

Eine weitere wichtige Information ist der Trick "minHeight = 0". Es stellte sich heraus, dass sich der von Flex verwendete Größenanpassungsalgorithmus ziemlich unterschiedlich verhält, wenn minHeight oder minWidth auf etwas anderes als das Standard-NaN eingestellt ist. Die Einstellung auf 0 ist in vielen Fällen äußerst nützlich. Versuchen Sie minWidth = 0 auf der VBox und/oder der Liste.

Answer 3

Neben der Scrolling-Richtlinie deaktivieren, legen Sie links und rechts auf 0 fest. Das sollte die Breite an die Breite des übergeordneten Elements verankern.