google-chrome - Google Chrome 用户界面是如何工作的？

Question

标签、按钮和多功能框等自定义用户界面在所有平台上看起来都一样。这是如何实现的？似乎没有使用依赖于平台的 UI。

Answer 1

Chrome 使用 Skia。这是一个示例(Gtk+ 3、cairo、skia):

  g_signal_connect(window_container_, "draw",
                   G_CALLBACK(OnWindowContainerDraw), NULL);

gboolean OnWindowContainerDraw(GtkWidget* widget,
                               cairo_t *cr) {                  
  SkBitmap bitmap;
  bitmap.setConfig(SkBitmap::kARGB_8888_Config, 100, 100);
  bitmap.allocPixels();

  SkDevice device(bitmap);
  SkCanvas canvas(&device);
  SkPaint paint;
  SkRect r;

  paint.setARGB(255, 255, 255, 255);
  r.set(10, 10, 20, 20);
  canvas.drawRect(r, paint);

  cairo_surface_t* surface = cairo_image_surface_create_for_data(
      (unsigned char*)bitmap.getPixels(), CAIRO_FORMAT_ARGB32,
      bitmap.width(), bitmap.height(), bitmap.rowBytes());
  cairo_surface_mark_dirty(surface);
  cairo_set_source_surface(cr, surface, 0, 0);
  cairo_paint(cr);

  return FALSE;
}