Совмещение изображений

Добавлено : 18 Mar 2009, 16:50

Содержание

1 Введение
2 Правила визуализации и пример
3 Совмещение изображений в оперативной памяти
4 Постепенное исчезновение изображения
5 Ссылки и дополнительная информация

Введение

Java 2DTM API обеспечивает поддержку совмещения нескольких изображений при помощи так называемых правил Porter-Duff. Приведенные первоначально в документе SIGGRAPH от 1984 "Композиция цифровых изображений" Thomas Porter и Tom Duff, эти правила описывают, как скомбинировать содержимое нескольких изображений, если одно изображение рисуется поверх второго.

Таких правил двенадцать. Они включают такие правила, как "нарисовать только исходное изображение" и "нарисовать часть другого изображения, которое не перекрывает исходного". На первый взгляд некоторые из этих правил могут показаться сложными. Однако это не так. Если вы посмотрите на картинку, вещи станут намного понятнее.

В Java 2D API правила совмещения поддерживаются классом AlphaComposite. Этот класс предоставляет двенадцать констант, по одной для каждого правила. Для изменения настройки в метод setComposite класса Graphics2D передается конкретная константа. Затем, при выводе изображения связанное с константой правило используется для совмещения нового изображения с существующим содержимым. Java 2D API поддерживает объекты AlphaComposite с частичной прозрачностью. Если вы хотите медленно наложить одно изображение на другое, вы можете изменить процент прозрачности так, что новое изображение будет появляться или исчезать в зависимости от используемого правила совмещения.

Ниже перечислены двенадцать констант и связанные с ними правила:

CLEAR    - Не отображать ничего. Создает пустой вывод. 
DST      - Отобразить только новое изображение. 
SRC      - Отобразить только исходное изображение. 
DST_ATOP - Отобразить исходное изображение. Там, где два изображения перекрываются, отобразить новое изображение. 
SRC_ATOP - Отобразить новое изображение. Там, где два изображения перекрываются, отобразить исходное изображение. 
DST_IN   - Отобразить часть нового изображения, которое перекрывает исходное. 
SRC_IN   - Отобразить часть исходного изображения, которое перекрывает новое. 
DST_OUT  - Отобразить часть нового изображения, которое не перекрывает исходное. 
SRC_OUT  - Отобразить часть исходного изображения, которое не перекрывает новое. 
DST_OVER - Отобразить новое изображение поверх исходного изображения. 
SRC_OVER - Отобразить исходное изображение поверх нового изображения. 
XOR      - Отобразить части нового и исходного изображения, которые не перекрываются. 

Правила визуализации и пример

Для того, чтобы помочь вам визуализировать двенадцать правил, в этой статье используется программа, совмещающая изображения. Программа взята из книги "Овладение Java 2, J2SE 1.4" John Zukowski, опубликованная Sybex. Программа отображает экран, используя все двенадцать правил. В этой программе каждое правило применяется с тремя различными установками процента прозрачности исходного и нового изображений. Исходное изображение представляет собой зеленый треугольник слева. Новое изображение - это пурпурный треугольник справа. Два треугольника перекрываются в середине.

На экране программы находятся два набора рисунков. Первый верхний набор использует настройки совмещения CLEAR, DST, DST_ATOP, DST_IN, DST_OUT и DST_OVER. Нижний набор использует SRC, SRC_ATOP, SRC_IN, SRC_OUT, SRC_OVER и XOR.

Программа предназначена только для демонстрации различных правил. Как реально совместить изображения, будет вскоре объяснено.

import java.awt.*;
import java.awt.geom.*;
import java.awt.image.*;
import javax.swing.*;

public class CompositeIt extends JFrame {
 
int rules[] = { AlphaComposite.CLEAR, AlphaComposite.DST,
      AlphaComposite.DST_ATOP, AlphaComposite.DST_IN,
      AlphaComposite.DST_OUT, AlphaComposite.DST_OVER,
      AlphaComposite.SRC, AlphaComposite.SRC_ATOP, AlphaComposite.SRC_IN,
      AlphaComposite.SRC_OUT, AlphaComposite.SRC_OVER, AlphaComposite.XOR
};
 
float percents[] = { .33f, .67f, 1.0f };
  BufferedImage source, dest;
  GeneralPath sourcePath, destPath;

 
public CompositeIt() {
   
sourcePath = new GeneralPath();
    sourcePath.moveTo
(0, 0);
    sourcePath.lineTo
(50, 0);
    sourcePath.lineTo
(50, 25);
    sourcePath.closePath
();
    source =
new BufferedImage(80, 30, BufferedImage.TYPE_INT_ARGB);
    destPath =
new GeneralPath();
    destPath.moveTo
(25, 0);
    destPath.lineTo
(75, 0);
    destPath.lineTo
(25, 25);
    destPath.closePath
();
    dest =
new BufferedImage(80, 30, BufferedImage.TYPE_INT_ARGB);
 
}

 
public void paint(Graphics g) {
   
Graphics2D g2d = (Graphics2D) g;
    Graphics2D sourceG = source.createGraphics
();
    Graphics2D destG = dest.createGraphics
();
    AffineTransform at =
new AffineTransform();
    Composite originalComposite = g2d.getComposite
();
   
for (int i = 0; i < 3; i++) {
     
for (int j = 0, n = rules.length; j < n; j++) {
       
at = AffineTransform.getTranslateInstance(j * 80 + 10,
            i *
30 + 30);
       
if (j >= rules.length / 2) {
         
at.translate(-rules.length / 2 * 80, 120);
       
}
       
g2d.setTransform(at);
        g.drawRect
(0, 0, 80, 30);
        destG.setComposite
(AlphaComposite.Clear);
        destG.fillRect
(0, 0, 80, 30);
        destG.setComposite
(AlphaComposite.getInstance(
           
AlphaComposite.XOR, percents[i]));
        destG.setPaint
(Color.MAGENTA);
        destG.fill
(destPath);
        sourceG.setComposite
(AlphaComposite.Clear);
        sourceG.fillRect
(0, 0, 80, 30);
        sourceG.setComposite
(AlphaComposite.getInstance(
           
AlphaComposite.XOR, percents[i]));
        sourceG.setPaint
(Color.GREEN);
        sourceG.fill
(sourcePath);
        destG.setComposite
(AlphaComposite.getInstance(rules[j]));
        destG.drawImage
(source, 0, 0, null);
        g2d.drawImage
(dest, 0, 0, this);
     
}
    }
  }

 
public static void main(String args[]) {
   
JFrame f = new CompositeIt();
    f.setDefaultCloseOperation
(JFrame.EXIT_ON_CLOSE);
    f.setTitle
("CompositeIt");
    f.setSize
(525, 275);
    f.show
();
 
}
}

Вот совмещенное изображение, отображаемое программой:

Cовмещенное изображение, отображаемое программой

Совмещение изображений в оперативной памяти

Можно совместить изображения в оперативной памяти, а не с использованием текущего контекста Graphics экрана. При применении объекта BufferedImage для двойной буферизации в буфер отображается одно изображение. Затем отображается второе изображение на первом с применением желаемого правила. И, наконец, комбинированное изображение отображается на экране. Вот пример этого подхода:

// Создать буфер изображения в оперативной памяти
 
BufferedImage dest = new BufferedImage(
 
width, height,
  BufferedImage.TYPE_INT_ARGB
);

 
// Получить контекст Graphics
 
Graphics2D destG = dest.createGraphics();

 
// Отобразить первое изображение в нем
 
destG.drawImage(image1, 0, 0, this);

 
// Скомбинировать их
 
destG.setComposite(mode);
  destG.drawImage
(source, 0, 0, this);

 
// Отобразить изображение на экране
 
g2d.drawImage(dest, 0, 0, this);

Но есть еще и дополнительные возможности. Пример не показывает, как накладываются изображения. Конкретнее, вы не увидите, как исчезает одно изображение и постепенно появляется другое. Используя правильно подобранные по размерам изображения, вы можете увидеть, как фотография ребенка плавно переходит в фотографию подростка, либо щенок превращается во взрослую собаку.

Постепенное исчезновение изображения

Для получения постепенного исчезновения изображения становится необходимым отображение исходного и нового изображений с изменяемым процентом прозрачности. Класс AlphaComposite предоставляет метод getInstance, дающий возможность указать правило Porter-Duff и процент прозрачности для операций отображения. Применяя операцию отображения, можно эффективно устанавливать в изображении различную степень прозрачности. Затем, после отображения двух изображений одного поверх другого можно получить эффект исчезновения путем изменения степени прозрачности.

В следующей программе демонстрируется эта возможность и выполняется плавное превращение изображения дилижанса:

Плавное превращение изображения

в крытый автомобиль:

Плавное превращение изображения

Вы можете взять изображения с сайта Cowboy Clip Art или свои собственные. Изображение автомобиля находится в файле saloon.gif, дилижанса - oldstage.gif. В программе используется TimerTask и Timer для цикла по фиксированному набору шагов вывода изображений. Можете свободно менять значение STEPS для изменения этого счетчика, или значение SLEEP_DELAY для изменения скорости смен изображений. Чем больше значение SLEEP_DELAY, тем дольше время между шагами.

import java.awt.*;
import java.awt.image.*;
import javax.swing.*;
import java.util.Timer;
import java.util.TimerTask;

public class Converge extends JFrame {

 
ImageIcon saloonIcon = new ImageIcon("saloon.gif");
  ImageIcon coachIcon =
new ImageIcon("oldstage.gif");
  Image saloon = saloonIcon.getImage
();
  Image coach = coachIcon.getImage
();

  BufferedImage dest;

 
float sourcePercentage = 1, destinationPercentage = 0;
 
private static int STEPS = 100;
 
private static float STEP_CHANGE = 1.0f / STEPS;
 
private static int SLEEP_DELAY = 100;

  Insets insets;

 
public Converge() {
   
super("Image Blending");
    setDefaultCloseOperation
(JFrame.EXIT_ON_CLOSE);
    dest =
new BufferedImage(200, 200, BufferedImage.TYPE_INT_ARGB);
    setSize
(200, 200);
    TimerTask task =
new TimerTask() {
     
public void run() {
       
repaint();
        sourcePercentage -= STEP_CHANGE;
        destinationPercentage += STEP_CHANGE;
       
if (sourcePercentage < 0) {
         
sourcePercentage = 0;
          destinationPercentage =
1;
          cancel
();
       
}
      }
    }
;
    Timer timer =
new Timer();
    timer.schedule
(task, 0, SLEEP_DELAY);
 
}

 
public void paint(Graphics g) {
   
if (insets == null) {
     
insets = getInsets();
   
}
   
g.translate(insets.left, insets.top);
    Graphics2D g2d =
(Graphics2D) g;
    Graphics2D destG = dest.createGraphics
();

    destG.setComposite
(AlphaComposite.getInstance(AlphaComposite.SRC,
        sourcePercentage
));
    destG.drawImage
(coach, 0, 0, this);
    destG.setComposite
(AlphaComposite.getInstance(AlphaComposite.XOR,
        destinationPercentage
));
    destG.drawImage
(saloon, 0, 0, this);
    g2d.drawImage
(dest, 0, 0, this);
 
}

 
public static void main(String args[]) {
   
new Converge().show();
 
}
}

Вот копия экрана совмещенных изображений, которые отображает программа:

Плавное превращение изображения

Ссылки и дополнительная информация

Платформа Java 1.4 включает несколько графических новшеств, относящихся к Java 2D API. Описание этих новшеств находится в статье "Улучшения производительности графики в Java 2 SDK, версия 1.4".

Также посмотрите презентацию "Полупрозрачность, альфа-наложение и анимация: использование преимуществ технологии Java в вашем клиентском приложении".

Теги: images