Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

HDPI Support? #54

Closed
ajusa opened this issue Dec 25, 2017 · 17 comments
Closed

HDPI Support? #54

ajusa opened this issue Dec 25, 2017 · 17 comments
Labels
need: help Help from the community is requested

Comments

@ajusa
Copy link

ajusa commented Dec 25, 2017

Hi,
I really love this library, and it is super useful to me. I was wondering about HDPI support, at least on windows. On my machine, the opened web browser looks very pixelated. IE10 looks just fine, and supports high definition fonts, but the window that this opens up just looks blocky.

Is there any way I can make the webview work well with HDPI displays?

@zserge zserge added the need: help Help from the community is requested label Jan 7, 2018
@Boscop
Copy link

Boscop commented Jan 14, 2018

I'm also interested in this...

@quadrupleslap
Copy link

@Boscop
Copy link

Boscop commented Jan 15, 2018

Hm, I don't think that's the solution. In my normal IE11 on Win8.1, the same site looks HDPI but if I open it with webview, it looks low-res.. It must be some setting for the MSHTML engine.

@ajusa
Copy link
Author

ajusa commented Jan 16, 2018

Yeah, I noticed that too

@DanielSek
Copy link

DanielSek commented Jan 28, 2018

Probably related to application DPI awareness:

EDIT:
Verified with Visual Studio 2013 Community
Project->Properties->Configuration Properties->Manifest Tool->Input and Output->DPI Awareness
change from None to High DPI Aware.
Per Monitor High DPI Aware needs handling of additional messages, so initially it would be harder, but it would react faster on DPI setting change.
Unfortunately High DPI Aware on Windows 10 needs log off and log in after change to work correctly.

Or edit manifest manually:

<?xml version='1.0' encoding='UTF-8' standalone='yes'?>
<assembly xmlns='urn:schemas-microsoft-com:asm.v1' manifestVersion='1.0'>
    <dependency>
        <dependentAssembly>
            <assemblyIdentity
                type="win32"
                name="Microsoft.Windows.Common-Controls"
                version="6.0.0.0"
                processorArchitecture="*"
                publicKeyToken="6595b64144ccf1df"
                language="*"
            />
        </dependentAssembly>
    </dependency>
    <asmv3:application xmlns:asmv3="urn:schemas-microsoft-com:asm.v3">
    	<asmv3:windowsSettings xmlns="http://schemas.microsoft.com/SMI/2005/WindowsSettings">
            <dpiAware>true</dpiAware>
    	</asmv3:windowsSettings>
    </asmv3:application>
</assembly>

Or early in WinMain call

SetProcessDpiAwareness( PROCESS_SYSTEM_DPI_AWARE );

Or

SetProcessDpiAwareness( PROCESS_PER_MONITOR_DPI_AWARE );

@jiangyibin
Copy link

Right click the exe file -> properties -> compatibility, there's an option "Override high DPI scaling behavior". Check it.
This is equal to write register "/Software/Microsoft/Windows NT/CurrentVersion/AppCompatFlags/Layers" KEY:path/to/exe VALUE:"~HIGHDPIAWARE"

@jiangyibin
Copy link

jiangyibin commented Apr 8, 2018

Use the following code to adjust width and height automatically

  HDC hDC = GetDC(NULL);
  w->width = GetDeviceCaps(hDC, 88)*w->width/96.0;
  w->height = GetDeviceCaps(hDC, 90)*w->height/96.0;
  ReleaseDC(NULL, hDC);

and this works fine for most examples.

@zenakuten
Copy link

I have a pull request which fixes this.

@zserge
Copy link
Collaborator

zserge commented Jun 22, 2018 via email

@zenakuten
Copy link

Woah that was a quick reply. :) I took a drink of coffee, looked back over and here it is. Nice thank you for the great project

@jakenvac
Copy link
Contributor

Did this PR ever get merged?

@mantou132
Copy link

mantou132 commented Feb 18, 2019

When I execute binary files directly, the application is not blurred. But when the application is packaged and run, the window becomes blurred. I use macOS.

https://github.com/mantou132/evernote-webview
screen shot 2019-02-19 at 2 24 01 am
// fixed: NSHighResolutionCapable

@lewisthoma5
Copy link

lewisthoma5 commented Aug 5, 2019

I have a fix for windows that extends the minimal-go example.

package main

import (
	"syscall"
	"github.com/zserge/webview"
)

func scale() {
	modshcore := syscall.NewLazyDLL("Shcore.dll")
	shc := modshcore.NewProc("SetProcessDpiAwareness")
	shc.Call(uintptr(1))
}

func main() {
	// Open wikipedia in a 800x600 resizable window
	scale()
	webview.Open("Minimal webview example",
		"https://en.m.wikipedia.org/wiki/Main_Page", 800, 600, true)
}

No idea about mac so sorry about that but I hope this helps.

@Ciantic
Copy link

Ciantic commented Aug 2, 2020

Was there a regression of sorts? I think the pull request was for old version of this library that used the msedge HTML, and needs to be fixed for webview2 Edge implementation too.

I'm testing the webview_rust in Windows 10, the windows are blurry.


For webview_rust one can fix it like this:

Cargo.toml

[target.'cfg(windows)'.dependencies]
winapi = { version = "0.3.9", features = ["shellscalingapi"] }

main.rs

fn main() {
    #[cfg(target_os = "windows")]
    unsafe {
        winapi::um::shellscalingapi::SetProcessDpiAwareness(2);
    }

    // Rest of the application ...

@raphtlw
Copy link

raphtlw commented Oct 11, 2020

This library also doesn't support display scaling from KDE, when the display is scaled, the GTK+ webkit doesn't scale properly and elements are too small.

@raphtlw
Copy link

raphtlw commented Mar 12, 2021

So recently, I started using this library again and I've found a workaround for Linux. ✨

Use winit to get the scale factor and set the scale factor as the zoom level on the webview instead.

First, get the scale factor

    let scale_factor = {
        use winit::{event_loop::EventLoop, window::WindowBuilder};

        let event_loop = EventLoop::new();
        let window = WindowBuilder::new()
            .with_maximized(false)
            .with_visible(false)
            .build(&event_loop)?;

        let scale_factor = window.scale_factor();
        println!("Scale factor: {}", scale_factor);

        drop(window);

        scale_factor
    };

Then, instantiate the webview and call set_zoom_level on the webview.

webview.set_zoom_level(scale_factor);

@SteffenL
Copy link
Collaborator

Closing as stale. The current situation on Windows is that the library enables DPI awareness.

@SteffenL SteffenL closed this as not planned Won't fix, can't repro, duplicate, stale May 30, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
need: help Help from the community is requested
Development

No branches or pull requests