Добавить водяной знак к изображению перед загрузкой? AS3 + Flex


В течение последних нескольких часов я пытался придумать способ добавления водяного знака в файл изображения перед его загрузкой с помощью метода FileReference.upload();. Загрузка уже работает. Мне просто нужно выяснить, как получить небольшой водяной знак (изображение PNG с Альфа-прозрачностью) в правом нижнем углу файла изображения. Другое дело, что я не хочу изменять исходный файл. Я просто хочу добавить водяной знак при загрузке.

Какой подход вы бы рекомендовали для такого типа установки? Я также не могу найти уже готовых классов, которые я мог бы использовать для этой конкретной вещи. Разве это не очень распространенная задача? И нет я не могу использовать серверную часть (PHP) для водяных знаков, потому что я связываюсь непосредственно с API сервиса, а не через мой сервер.

2 2

2 ответа:

Вы можете установить водяной знак (Альфа-изображение) как более высокий дочерний индекс, чем ur, загружающий изображение в группу или коробку, и вы можете сохранить эти контейнеры в виде растрового изображения или изображения jpeg.

   <s:BorderContainer width="100%" height="100%" backgroundColor="0x3322ff" id="comp">
        <s:Image source="{upload-image-source}" width="100%" height="100%"/> 
        <s:Image source="{water-mark-image-source(alpha png file)}" width="100%" height="100%"/> 
    </s:BorderContainer>

Вы можете сохранить этот контейнер как изображение.

        var bmpd:BitmapData = new BitmapData(comp.width,comp.height);
        bmpd.draw(comp);

        var jpgenc:JPEGEncoder = new JPEGEncoder(80);
        var imgByteArray:ByteArray = jpgenc.encode(bmpd);

В основном просто добавьте изображение и водяной знак в BitmapData, а затем используйте кодер PNG, такой как http://www.kaourantin.net/2005/10/png-encoder-in-as3.html чтобы создать PNG из полученного изображения. Затем вы можете загрузить его на свой сервер, и исходное изображение останется неизменным.