Wie zeichnet Firefox/Chrome die Bildlaufleiste?

Question

Scrollbas in Chrom oder Firefox hat keinen Griff. Sie sind handlesefrei, aber sie haben dasselbe Aussehen und Verhalten wie die Standard-Bildlaufleiste des Systems. Daraus können wir schließen, dass diese Browser die Windows-Design-API wie DrawThemeBackground verwenden, um die Bildlaufleiste zu zeichnen.

Aber APIs wie DrawThemeBackground sind GDI, Chrome/Firefox verwenden skia/cario, um die gesamte Leinwand zu rendern. Mein Problem ist, wie kombinieren sie diese zwei Arten von Technologie?

Pesudo Code:

WM_PAINT: 
    prepare canvas; 
    draw the canvas with skia/cario; 
    bitblt to the dc; 
    draw the theme-related handless control;(???) 
    bitblt to the dc or directly draw to the dc;(???) 

Sie die Prozedur die oben ein ähneln?

Answer 1

Firefox

Eigentlich kairo hat eine Funktion DC von einer kairo Oberfläche zu erhalten. Beispielcode:

VOID OnPaint(HWND hwnd, HDC hdc) 
{ 
    RECT rc; 
    ::GetClientRect(hwnd, &rc); 
    //draw one line 
    cairo_surface_t* surface = cairo_win32_surface_create(hdc); 
    cairo_t* cr = cairo_create(surface); 
    cairo_set_source_rgb(cr, 0xff, 0, 0); 
    cairo_set_line_width(cr, 1); 
    cairo_move_to(cr, 0, 0); 
    cairo_line_to(cr, rc.right, rc.bottom); 
    cairo_stroke(cr); 
    cairo_destroy(cr); 

    //draw the theme background 
    HDC hdcNew = cairo_win32_surface_get_dc(surface); 
    HTHEME hTheme = OpenThemeData(NULL, L"SCROLLBAR"); 
    RECT rcArrow; 
    SetRect(&rcArrow, 30, 30, 45, 45); 
    DrawThemeBackground(hTheme, hdcNew, SBP_ARROWBTN, ABS_DOWNDISABLED, &rcArrow, NULL); 
    cairo_surface_destroy(surface); 
} 

gfxWindowsNativeDrawing::BeginNativeDrawing() Anruf HDC gfxWindowsSurface::GetDCWithClip(gfxContext *ctx) schließlich kairo win32 nennen.

Chrome

Skia bietet keine Transformation Funktionalität von skia Leinwand zu hdc, aber das Projekt Chrom eine Erweiterung skia hinzufügen und diese Funktionalität erfüllen.

in skia/ext/bitmap_platform_device_win.cc:

HDC BitmapPlatformDevice::BitmapPlatformDeviceData::GetBitmapDC() { 
} 

, die einen Speicher dc von der Leinwand interne Bitmap erstellen.

Also, wenn Farbe, ob Sie brauchen, verwenden Sie native dc oder die allgemeine Kairo/Skia Leinwand ist nicht mehr wichtig.

Beispielcode:

void TestChromeExt(HWND hwnd, HDC hdc) 
{ 
    RECT rc; 
    GetClientRect(hwnd, &rc); 
    skia::BitmapPlatformDevice* pBmpDevice = skia::BitmapPlatformDevice::Create(rc.right, rc.bottom, true); 
    skia::PlatformCanvas *pCanvas = new skia::PlatformCanvas(pBmpDevice); 
    pCanvas->clear(SK_ColorWHITE); 
    SkPaint paint; 
    paint.setColor(SK_ColorRED); 
    paint.setStrokeWidth(3); 
    paint.setStyle(SkPaint::kStroke_Style); 
    pCanvas->drawLine(0, 0, rc.right, rc.bottom, paint); 
    HDC memdc = skia::BeginPlatformPaint(pCanvas); 
    RECT rcArrow; 
    SetRect(&rcArrow, 100, 200, 120, 220); 
    DrawThemeBackground(OpenThemeData(NULL, L"SCROLLBAR"), memdc, SBP_ARROWBTN, ABS_DOWNDISABLED, &rcArrow, NULL); 
    skia::EndPlatformPaint(pCanvas); 
    skia::DrawToNativeContext(pCanvas, hdc, 0, 0, &rc); 
} 

für Windows, das native Look zu gewährleisten und fühlen, wenn visueller Stil aktiviert ist, würde dieser Browser DrawThemeBackground verwenden. Wenn jedoch der visuelle Stil deaktiviert ist (der klassische Modus ist einer), verwenden sie DrawFrameControl, um die Steuerelemente zu zeichnen.