Я использую DividedBox в Flex, который сначала содержит только datagrid. Когда я щелкаю элемент в Datagrid, второй элемент с шириной 0% (Spark Group) добавляется в разделенное поле для отображения изображения.

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

Вот интересный код:

<mx:DividedBox direction="horizontal" id="divider" borderColor="red" borderStyle="solid" borderVisible="true" right="10" left="10" top="10" bottom="10">
    <s:Group width="100%" height="100%">
        <!--datagrid-->
    </s:Group>
</mx:DividedBox>

А вот фрагмент кода, который добавляет второго дочернего элемента splitBox (упрощенный код):

private var _pdf_preview:Group = new Group();
[Bindable]
[Embed(source="assets/image/llama.jpg")]
private var imgClass:Class;

protected function itemOnClickHandler(event:MouseEvent):void
{
    _pdf_preview = new Group();
    var img:Image = new Image();
    img.source = imgClass;
    _pdf_preview.addElement(img);
    _pdf_preview.percentWidth = 0;
    divider.addElement(_pdf_preview);
}

А вот и скрин проблемы (кстати, не замечайте мои навыки работы с GIMP :)). Как новый пользователь я не могу привязать изображения к своему сообщению: экран, показывающий мою проблему, красная граница показывает пределы splitBox

Спасибо. Надеюсь, в этом не слишком много недостатков, английский не мой родной язык. Приносим извинения за ошибки в английском.

PS: я не мог добавить теги «DividedBox», потому что его раньше не было, а я «новый пользователь», поэтому я не могу создавать новые теги.

1
Alex Ception 28 Июн 2012 в 13:35

1 ответ

Лучший ответ

Вы можете использовать свойство clipContent, чтобы обрезать изображение по краю DividedBox:

<mx:DividedBox clipContent="true" />

При использовании контейнеров Spark clipAndEnableScrolling - это свойство, необходимое для достижения той же цели.

Я также хотел бы отметить, что обычно не требуется динамическое добавление компонентов через ActionScript. Вместо этого вы можете использовать «состояния». Например:

<s:states>
    <s:State name="normal" />
    <s:State name="image" />
</s:states>

<mx:DividedBox clipContent="true">
    <s:DataGrid />
    <s:Image includeIn="image" />
</mx:DividedBox>

Теперь все, что вам нужно сделать, чтобы отобразить изображение, - это установить currentState на image.

1
RIAstar 28 Июн 2012 в 14:06
Спасибо, свойство clipContent сработало! Что касается того, что я могу это сделать в mxml. Возможно, я делаю это неправильно, но я не большой поклонник mxml-части Flex, я бы предпочел делать большинство вещей в ActionScript.
 – 
Alex Ception
28 Июн 2012 в 14:23
Однажды я разделил вашу озабоченность, но больше не разделяю. Делая это в AS, вы усложняете себе жизнь. MXML действительно упрощает некоторые вещи. Вам просто нужно научиться красиво отделить объявления представления MXML от кода поведения ActionScript.
 – 
RIAstar
28 Июн 2012 в 14:37
Иногда это работает, иногда нет. В частности, у меня много проблем с событиями, когда они настроены в mxml, но у меня нет проблем с добавлением к ним Listener, когда он находится в полной AS. Я уверен, что проблемы, с которыми я сталкиваюсь, полностью связаны с моим неправильным пониманием mxml, но я не могу понять, как управлять им в MXML.
 – 
Alex Ception
30 Июн 2012 в 02:27
Я абсолютно согласен. Я почти никогда не подключаю прослушиватели событий в MXML, поскольку там мы погружаемся в сферу поведенческого кода. Я думаю, вам следует изучить механизм снятия скинов Spark. Или вы можете прочитать этот ответ, который я недавно написал, что демонстрирует, что я имею в виду.
 – 
RIAstar
30 Июн 2012 в 02:33