如何在 XCB 窗口中显示图像？

Posted 2023-02-14

【中文标题】如何在 XCB 窗口中显示图像？

【英文标题】：How to display an image into an XCB window?

【发布时间】：2017-08-19 03:53:22

【问题描述】：

我无法在 XCB 窗口中显示图像（使用 libpng 提取的 PNG），它总是完全为空/白色。我很确定 PNG 提取是正确的，因为我可以完美地将其重新写入另一个文件。

我已经尝试了所有我发现的东西（解释、指南、文档），但我的想法已经用完了：

使用从 PNG 获取的数据创建一个 xcb_pixmap_t 调用 xcb_create_pixmap_from_bitmap_data()，然后将 xcb_copy_area() 调用到事件循环的 EXPOSE 部分。 创建一个xcb_image_t* 调用xcb_image_create_from_bitmap_data()，然后尝试使用xcb_image_put() 将其映射到窗口。我什至尝试使用xcb_image_put_pixel() 显示每个像素，但没有成功。

代码示例：

  xcb_pixmap_t pixmap = xcb_create_pixmap_from_bitmap_data(
                            connection, // xcb_connect(0, 0)    (type: xcb_connection_t*)
                            window, // xcb_generate_id(connection)    (type: xcb_window_t)
                            img.getData(), // uint8_t*
                            img.getWidth(), // 128
                            img.getHeight(), // 128
                            img.getBitDepth(), // 8
                            screen->black_pixel, // screen = xcb_setup_roots_iterator(xcb_get_setup(connection)).data    (type: xcb_screen_t*)
                            screen->white_pixel,
                            nullptr);

   // "img" is an instance of my own custom class, result of PNG reading
  xcb_image_t* image = xcb_image_create_from_bitmap_data(
                              img.getData(),
                              img.getWidth(),
                              img.getHeight()); // image->data seems fine

  xcb_image_put(connection,
                window,
                graphicsContext,
                image, 0, 0, 0); // This does nothing

  for (unsigned int i = 0; i < screen->height_in_pixels; ++i)
    for (unsigned int j = 0; j < screen->width_in_pixels; ++j)
      xcb_image_put_pixel(image, j, i, 0); // Displays nothing

  [...]

  // Into event loop
  case XCB_EXPOSE: 
    xcb_expose_event_t* exposeEvent = reinterpret_cast<xcb_expose_event_t*>(event);
    xcb_copy_area(connection,
                  pixmap,
                  window,
                  graphicsContext,
                  exposeEvent->x, exposeEvent->y, // Top left x & y coordinates of the source's region to copy
                  exposeEvent->x, exposeEvent->y, // Top left x & y coordinates of the destination's region to copy to
                  exposeEvent->width,
                  exposeEvent->height);
    xcb_flush(connection);
    break;
  

从我发现的示例中，我看到它不需要颜色图，但可能是这样吗？谁能告诉我哪里出错了？

【问题讨论】：

什么麻烦？请尽可能具体。

img.getBitDepth(), // 8 这可能是您的问题。深度必须与您的窗口深度相同，否则xcb_copy_area 将失败。默认情况下你真的有 8 位深的窗口吗？一般来说，您应该准备好应对所有深度。

@n.m.感谢您的回答！好点，我编辑以指定出了什么问题，我很傻。我实际上不知道我的窗口有什么深度，我在创建窗口时将XCB_COPY_FROM_PARENT 传递给窗口。通过用8 替换此字段，窗口甚至不会出现。

您需要知道您的目标窗口深度是多少，以位为单位，并且您需要将图像数据转换为特定的位深度。如果您知道您的源图像数据表示，它会有所帮助，否则您将无法转换。无操作转换（又名）只是许多可能的情况之一。

其实这是一个不错的开始。我的窗口有 24 位深度（这看起来很大，因为我的 PNG 总是有 8），我已将 PNG 的深度扩展到 24，但它现在显示一个由伪像组成的丑陋正方形。我想还有另一件事出了问题......有没有办法将窗口的深度降级到 8 或 16？

【参考方案1】：

大约 4 年前，我组装了一个简单的 xcb 图像查看器，但刚刚注意到这个问题，所以为死灵法致歉。

它使用 xcb_image、stb_image 和 nanosvg，但编译为相对较小的静态二进制文件（使用 musl 或 uclibc 工具链）

#include <xcb/xcb.h>
#include <xcb/xcb_image.h>
#define STBI_NO_HDR
#define STBI_NO_LINEAR
#define STB_IMAGE_IMPLEMENTATION
#include "stb_image.h"
#define NANOSVG_IMPLEMENTATION
#include "nanosvg.h"
#define NANOSVGRAST_IMPLEMENTATION
#include "nanosvgrast.h"

int main(int argc, char **argv)
   xcb_connection_t *c = xcb_connect(0, 0);
   xcb_screen_t *s = xcb_setup_roots_iterator(xcb_get_setup(c)).data;
   int w, h, n,
      depth = s->root_depth,
      win_class = XCB_WINDOW_CLASS_INPUT_OUTPUT,
      format = XCB_IMAGE_FORMAT_Z_PIXMAP;
   xcb_colormap_t colormap = s->default_colormap;
   xcb_drawable_t win = xcb_generate_id(c);
   xcb_gcontext_t gc = xcb_generate_id(c);
   xcb_pixmap_t pixmap = xcb_generate_id(c);
   xcb_generic_event_t *ev;
   xcb_image_t *image;
   NSVGimage *shapes = NULL;
   NSVGrasterizer *rast = NULL;
   char *data = NULL;
   unsigned *dp;
   size_t i, len;
   uint32_t mask = XCB_CW_BACK_PIXEL | XCB_CW_EVENT_MASK,
      value_mask = XCB_EVENT_MASK_EXPOSURE | XCB_EVENT_MASK_BUTTON_PRESS,
      values[] =  s->black_pixel, value_mask ;

   if (argc<2) return -1;
   if ((data = stbi_load(argv[1], &w, &h, &n, 4)))
      ;
   else if ((shapes = nsvgParseFromFile(argv[1], "px", 96.0f))) 
      w = (int)shapes->width;
      h = (int)shapes->height;
      rast = nsvgCreateRasterizer();
      data = malloc(w*h*4);
      nsvgRasterize(rast, shapes, 0,0,1, data, w, h, w*4);
   else return -1;
   for(i=0,len=w*h,dp=(unsigned *)data;i<len;i++) //rgba to bgra
      dp[i]=dp[i]&0xff00ff00|((dp[i]>>16)&0xFF)|((dp[i]<<16)&0xFF0000);
   xcb_create_window(c,depth,win,s->root,0,0,w,h,1,win_class,s->root_visual,mask,values);
   xcb_create_pixmap(c,depth,pixmap,win,w,h);
   xcb_create_gc(c,gc,pixmap,0,NULL);
   image = xcb_image_create_native(c,w,h,format,depth,data,w*h*4,data);
   xcb_image_put(c, pixmap, gc, image, 0, 0, 0);
   xcb_image_destroy(image);
   xcb_map_window(c, win);
   xcb_flush(c);
   while ((ev = xcb_wait_for_event(c))) 
      switch (ev->response_type & ~0x80)
      case XCB_EXPOSE: 
         xcb_expose_event_t *x = (xcb_expose_event_t *)ev;
         xcb_copy_area(c,pixmap,win,gc,x->x,x->y,x->x,x->y,x->width,x->height);
         xcb_flush(c);
      break;
      case XCB_BUTTON_PRESS: goto end;
      default: break;
      
   
end:
   xcb_free_pixmap(c, pixmap);
   xcb_disconnect(c);
   return 0;

【讨论】：

分配的数据在哪里释放？ xcb_image_destroy() 或 xcb_free_pixmap() 是否在您提供的指针上调用 free()？