将 ImgView32 透明图层保存为 PNG

Question

我在将 ImgView32 图层保存为透明 PNG 时遇到问题。我使用 this question 中的代码进行保存。但是，图像以白色背景保存。

以下是我如何初始化 ImgView32，在其上创建一个图层，然后在其上画一条线：

procedure TputLine.FormCreate(Sender: TObject);
var
  P: TPoint;
  W, H: Single;
  imwidth: integer;
  imheight: integer;
begin
  imwidth := Iv1.Width;
  imheight := Iv1.Height;
  with iv1 do
  begin
    Selection := nil;
    Layers.Clear;
    Scale := 1;
    Scaled := True;
    Bitmap.DrawMode := dmTransparent;
    Bitmap.SetSize(imwidth, imheight);
    Bitmap.Canvas.Pen.Width := 4;
  end;
  BL := TBitmapLayer.Create(iv1.Layers);
  try
    BL.Bitmap.DrawMode := dmTransparent;
    BL.Bitmap.SetSize(imwidth,imheight);
    BL.Bitmap.Canvas.Pen.Width := penwidth;
    BL.Bitmap.Canvas.Pen.Color := pencolor;
    BL.Location := GR32.FloatRect(0, 0, imwidth, imheight);
    BL.Scaled := False;
  except
    BL.Free;
    raise;
  end;
end;

所以 iv1 是我的 ImgView32 的名称。然后我用这段代码在上面画一条线：

var 
  bm32:TBitmapLayer;
  ...
begin
  bm32:=(iv1.Layers[0] as TBitmapLayer).Bitmap;
  bm32.canvas.pen.color:=clwhite;
  bm32.canvas.brush.color:=clwhite;
  bm32.canvas.rectangle(0,0,bm32.width-1, bm32.height-1);

  bm32.canvas.Pen.Color:=WinColor(ColorPickerGTK1.SelectedColor);
  bm32.canvas.brush.color:=clWhite;
  bm32.Canvas.Pen.Width:=3;
  bm32.Canvas.MoveTo(0,bm32.Height);
  bm32.Canvas.LineTo(0+150,bm32.Height-250);
end;

如果我在上面的代码中绘制矩形时使用clWhite32，那么在保存PNG时，imgView的背景变黑了...所以我真的不明白这个问题。

我是这样存钱的：

procedure TputLine.Button2Click(Sender: TObject);
var
  myLay:TBitmapLayer;
begin
  mylay := iv1.Layers.Items[0] as TBitmapLayer;
  SavePNGTransparentX(mylay.Bitmap);
end;

和实际保存的代码（来自上面描述的link）

procedure TPutLine.SavePNGTransparentX(bm32:TBitmap32);
var
  Y: Integer;
  X: Integer;
  Png: TPortableNetworkGraphic32;

  function IsWhite(Color32: TColor32): Boolean;
  begin
    Result:= (TColor32Entry(Color32).B = 255) and
             (TColor32Entry(Color32).G = 255) and
             (TColor32Entry(Color32).R = 255);
  end;

begin
    bm32.ResetAlpha;
    for Y := 0 to bm32.Height-1 do
      for X := 0 to bm32.Width-1 do
      begin
        if IsWhite(bm32.Pixel[X, Y]) then
          bm32.Pixel[X,Y]:=Color32(255,255,255,0);
      end;
    Png:= TPortableNetworkGraphic32.Create;
    Png.Assign(bm32);
    Png.SaveToFile('C:\ThisShouldBeTransparent.png');
    Png.Free;
end;

我不明白为什么它不将图层保存为透明PNG。我该如何解决？欢迎任何想法。

您可以使用上面的代码复制我的问题。它使用 GR32_PNG 和 GR32_PortableNetworkGraphic。您只需要在您的窗体中添加一个TImgView32控件并添加上面列出的代码。

Answer 1

问题的原因似乎是 two-fold。

首先，当您在单元 GR32_PNG 中调用 Png.Assign(bm32); 时，它会尝试找出存储图像的最小格式。如果图像的不同颜色少于 256 种，它创建了一个调色板格式，并且根据它找到的颜色数量，位深度可以变为 1、2、4 或 8。据我所知，只有具有 TrueColor 和 Alpha 的图像可以保存为可变透明度 png 图片。
其次，您只用一种颜色绘制，从而触发了上述问题。这当然不是你的错，IMO上面提到的分析应该是可以绕过的。

TPortableNetworkGraphic32 class 有两个属性，BitDepth 和 ColorType 控制 png 图像的格式，如果他们是可设置的！尝试在代码中将它们设置为：

Png.BitDepth := 8;
Png.ColorType := ctTrueColorAlpha;

导致异常

EPngError with message 'Bit depth may not be specified directly yet!
EPngError with message 'Color Type may not be specified directly yet!

从措辞我们可以假设未来会有一些进一步的发展。

治愈

要绕过上述图像分析，您可以更改 GR32_PNG.pas 中的第 459 行。

procedure TPortableNetworkGraphic32.AssignPropertiesFromBitmap32()
var
  ...
begin
  ...
   IsPalette := True; // <--- change to False
  ...

这将负责位深度分析并在少于 256 种颜色时阻止创建调色板。在此 hack 之后，您可以使用 SavePNGTransparentX() 过程将 TBitmap32 保存到 .png 文件并保持透明度。

然后，关于 SavePNGTransparentX() 程序，还有一项您可能感兴趣的更改。如您所见，它要求绘图表面的背景为白色，因为它专门将所有白色像素的 Alpha 通道设置为零。然而，A TBitmapLayer 被初始化为所有像素 (RGBA) 都为零，因此每个像素的颜色分量构成黑色（这是不可见的，因为 alpha 通道为零）。因此，您需要用白色填充绘图层，使其不透明，再次覆盖所有较低层（绘图层下方）。

要对此进行更正，您可以

去除绘图层的初始化为全白
将 IsWhite 函数更改为 IsBlack 函数
更改透明像素的分配

代码会变成

procedure TForm8.SavePNGTransparentX(bm32:TBitmap32);
var
  Y: Integer;
  X: Integer;
  Png: TPortableNetworkGraphic32;

  function IsBlack(Color32: TColor32): Boolean;
  begin
    Result:= (TColor32Entry(Color32).B = 0) and
             (TColor32Entry(Color32).G = 0) and
             (TColor32Entry(Color32).R = 0);
  end;

  function IsWhite(Color32: TColor32): Boolean;
  begin
    Result:= (TColor32Entry(Color32).B = 255) and
             (TColor32Entry(Color32).G = 255) and
             (TColor32Entry(Color32).R = 255);
  end;

begin
    bm32.ResetAlpha;
    for Y := 0 to bm32.Height-1 do
      for X := 0 to bm32.Width-1 do
      begin
//        if IsWhite(bm32.Pixel[X, Y]) then
//          bm32.Pixel[X,Y]:=Color32(255,255,255,  0);
        if IsBlack(bm32.Pixel[X, Y]) then
          bm32.Pixel[X,Y]:=Color32(  0,  0,  0,  0);
      end;

    Png:= TPortableNetworkGraphic32.Create;
    Png.Assign(bm32);
    Png.SaveToFile('C:\tmp\imgs\ThisShouldBeTransparent3.png');
    Png.Free;
end;

进行此更改后，您可以看到绘图层下方的图层，绘图层的生成文件将所有 non-drawn 像素透明。然而，上述过程总的来说仍然存在一个问题，那就是部分透明的像素失去了透明度，但这将在以后的练习中保留。

这里有几张图片，首先是在底层加载了位图的ImageView：

然后，我基本上使用 Button1Click() 中的代码在 BL 层（参考您的代码）上画了一个蓝色十字，但没有白色矩形。

然后我将 BL 层保存到 .png 文件并使用 Windows Explorer 查看它 "Preview":

将 ImgView32 透明图层保存为 PNG

Saving ImgView32 transparent layers to PNG

delphi

graphics32

delphi-xe