выровнять изображение снизу, когда оно не заполняет пространство, выделенное для

Question

У меня есть изображение, которое не заполняет тег <mx:Image>, потому что это не точные размеры (оно слишком короткое), и у меня maintainAspectRatio установлено в true:

<mx:Image id="theImage"
          source="{data.photo_thumb}"
          horizontalCenter="0"
          verticalCenter="0" 
          width="100%"
          height="100%"
          bottom="0"
          maintainAspectRatio="true"/>

Тег <mx:Image> имеет фиксированную ширину и высоту (это 100% размера плитки - это в ItemRenderer). Как заставить изображение сидеть на нижней части тега <mx:Image>?

Answer 1

verticalAlign="bottom"

Иногда я помещаю изображения в Box es для достижения большего контроля.

Answer 2

Несколько вещей приходят на ум. Во-первых, вы должны поддерживать AspectRatio в true. Это означает, что соотношение сторон изображения всегда будет сохраняться; так что даже с высотой и шириной он может никогда не заполнить все пространство, отведенное для i. Таким образом, простой способ получить изображение, чтобы заполнить все пространство, состоит в том, чтобы установить keepAspectRatio в false. Я не думаю, что это вполне решает ваш вопрос.

Как мне заставить изображение сидеть на нижняя часть тега?

Я не думал, что вы могли бы разместить изображение внутри тега изображения, хотя другой плакат упоминался с использованием стиля verticalAlign; что было бы здорово, если бы это сработало.

Что бы я сделал, это разместил изображение внутри контейнера. Концептуально примерно так должно работать:

<Container id="myContainer">
 <mx:Image id="myImage" y="{myContainer.height=myImage.height}" />
</Container>

Но будьте осторожны с использованием привязки данных внутри средства визуализации. Это часто приводит к снижению производительности.