在Web浏览器中包含内容的问题在Windows窗体应用程序中会自动缩放 [英] Problems having content in webbrowser scale automatically in Windows Form Application

问题描述

我正在尝试创建一个程序，该程序可滚动浏览位于我计算机上的文件并显示这些文件.到目前为止，这对我来说一直有效，但是我正在获取实际大小的内容，因此Web浏览器添加了一个滚动条(显然).我希望内容能够自动缩放，以使其适合浏览器，而无需滚动.

I'm trying to create a program which scrolls through files located on my computer and displays the files. This is working for me so far but I'm getting content in actual size so the webbrowser adds a scrollbar(obviously). I want the content to scale automatically so it fits in the webbrowser without having to scroll.

代码:

 WebBrowser web = new WebBrowser();     
 System.Drawing.Rectangle workingRectangle = Screen.PrimaryScreen.WorkingArea;
 int heightWebcontrol = workingRectangle.Height / 100 * 85;
 int widthwebControl = workingRectangle.Width / 100 * 75;
 web.Size = new Size(widthwebControl, heightWebcontrol);
 web.Location = new Point(0, 0);
 web.Navigate(fileName);
 this.Controls.Add(web);

网络浏览器中的大图片，仅是图片的1/5:

Large image in webbrowser, this is just 1/5th of the image:

因此，基本上，这个大图像需要自动缩放，以使其完全适合浏览器.

So basicly, this large image, needs automatically to be scales so it fits the browser exactly.

谢谢大家.

推荐答案

作为一个选项，您可以处理 WebBrowser 控件的 DocumentCompleted 事件并设置图像样式根据大小.

As an option, you can handle DocumentCompleted event of the WebBrowser control and set the style of image based on the size.

例如:

1)创建一个Windows Forms项目2)在desgn模式下打开Form1，并在其上放置一个 WebBrowser 控件.3)双击表单的标题栏以处理表单的 Load 事件，并使用以下代码:

1) Create a Windows Forms Project 2) Open Form1 in desgn mode and drop a WebBrowser control on it. 3) Double click on title-bar of form to handle Load event of the form and use following code:

private void Form1_Load(object sender, EventArgs e)
{
    this.webBrowser1.Navigate("https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png");
}

4)双击 WebBrowser 控件以处理其 DocumentCompleed 事件，并使用以下代码:

4) Double click on WebBrowser control to handle its DocumentCompleed event and use following code:

private void webBrowser1_DocumentCompleted(object sender, WebBrowserDocumentCompletedEventArgs e)
{
    webBrowser1.Document.Body.SetAttribute("scroll", "no");
    var img = webBrowser1.Document.GetElementsByTagName("img")
                 .Cast<HtmlElement>().FirstOrDefault();
    var w = img.ClientRectangle.Width;
    var h = img.ClientRectangle.Height;
    img.Style = string.Format("{0}: 100%", w > h ? "Width" : "Height");
}

当原始图像尺寸为544x184时，您会看到以下结果:

You will see following result, while the original image size is 544x184:

注释1

这只是您可以执行的操作的一个示例.您可以使决策更加明智，例如检查图像大小是否小于浏览器大小，则无需应用任何缩放比例.

This is just an example of what you can do. You can make the decision more intelligent, for example check if the image size is less than the browser size, then you don't need to apply any scaling.

注释2-(这是我的选择)

如果将 WebBrowser 控件设置为支持显示现代内容图像的样式更好将是:

If you setup WebBrowser control to support showing modern content the better style for the image will be:

img.Style = "max-width:100%;max-height:100%";

这样，当图像大于浏览器时，图像将适合浏览器.当浏览器足够大时，它也不会调整大小.

This way, the image will be fit in the browser when it's larger than browser. Also it will not resize when the browser is large enough.

这篇关于在Web浏览器中包含内容的问题在Windows窗体应用程序中会自动缩放的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！