将 WPF 浏览器调整为其 HTML 内容答案

【问题标题】：Size WPF Browser to its HTML-Content将 WPF 浏览器调整为其 HTML 内容
【发布时间】：2016-11-21 11:34:39
【问题描述】：

我想在 WPF Browser 控件中展示我的天赋并将其调整为尽可能小的尺寸。

XAML：

<Window x:Class="TestProject.MainWindow"
        [...]
        Title="MainWindow" 
        MaxHeight="500" 
        MaxWidth="500"
        Loaded="Window_Loaded"
        SizeToContent="WidthAndHeight" 
        Height="86.453" 
        Width="163.44">
<Grid>
    <WebBrowser x:Name="browser"></WebBrowser>        
</Grid>

这是我的代码隐藏：

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
    }

    private string CreateHTML()
    {
        StringBuilder builder = new StringBuilder();
        builder.AppendLine("<!DOCTYPE html>");
        builder.AppendLine("<html>");
        builder.AppendLine("<body>");
        builder.AppendLine("<a href=\"http://stackexchange.com/users/5852250\">");
        builder.AppendLine("<img src=\"http://stackexchange.com/users/flair/5852250.png?theme=dark\" width=\"208\" height=\"58\" alt=\"profile for Felix D. on Stack Exchange, a network of free, community-driven Q&amp;A sites\" title=\"profile for Felix D. on Stack Exchange, a network of free, community-driven Q&amp;A sites\">");
        builder.AppendLine("</a>");
        builder.AppendLine("</body>");
        builder.AppendLine("<html>");
        return builder.ToString();
    }

    private void Window_Loaded(object sender, RoutedEventArgs e)
    {
        string htmlString = CreateHTML();            
        browser.NavigateToString(htmlString);            
    }        
}

我希望浏览器（其内容表现得像 SizeToContent="WidthAndHeight"）。

我还没有找到可行的解决方案。

我嵌入了Microsoft.mshtml 并试图得到某事。出browser.Document，但到目前为止我没有取得任何进展。

任何人都做过某事。类似？

【问题讨论】：

你不需要完整的网络浏览器，WPF的Image控件可以直接指向flair，像这样<Image Name="WB" Height="58" Width="208" Source="http://stackoverflow.com/users/flair/403671.png?theme=clean" />

标签： c# html wpf webbrowser-control

【解决方案1】：

您可以在导航之前将浏览器的大小设置为0,0，然后在文档加载完成后，您可以将控件的Width和Height设置为文档的scrollWidth和scrollHeight：

private void browser_LoadCompleted(object sender, NavigationEventArgs e)
{
    browser.Width = ((dynamic)browser.Document).Body.parentElement.scrollWidth;
    browser.Height = ((dynamic)browser.Document).Body.parentElement.scrollHeight;
}
private void browser_Navigating(object sender, NavigatingCancelEventArgs e)
{
    browser.Width = 0;
    browser.Height = 0;
}

注意

1)这篇文章是对将 WPF 浏览器调整为 HTML 内容的答案。如果问题正好显示图像，您可以依赖Image 控件，如第一条评论中所述。

2) 在使用WebBrowser 控件显示您的天赋时，您需要通过为body 标签设置scroll="no" 属性来关闭滚动。您还需要为body 标签设置style=\"padding:0px;margin:0px;\"。还可以通过为img 标记设置style="border:0px;" 来删除图像的边框，还可以对其他一些html 和css 进行更正。

3)在 DPI 设置为 125% 的窗口中，您需要将值乘以 0.8。

【讨论】：

测试时请考虑以下注意事项：1) 在 DPI 设置设置为 120% 的窗口中，您需要将值乘以 0.8。 2) 您可以通过导航到http://www.google.com 之类的网站来对其进行测试。 3) 要使用您的 html 进行测试，请将 body 标签更改为 builder.AppendLine("<body scroll=\"no\">");
你测试过这个吗？因为我得到了 Microsoft.CSharp.RuntimeBinder.RuntimeBinderException 导致 ((dynamic)WebBrowser.Document).Body 为空 ....
这篇文章是对Size WPF Browser to its HTML-Content 的回答。如果问题恰好显示了您的天赋，您可以依赖Image 控件：<Image Source="http://stackexchange.com/users/flair/5852250.png?theme=dark" Stretch="None"/>，如第一条评论中所述。此外，如果出于任何原因您想在WebBrowser 控件中显示风格，则需要为body 标签设置style=\"padding:0px;margin:0px;\" 和scroll=\"no\"。此外，您应该删除图像的边框并进行一些调整，以使内容尽可能少地占用空间。
好的，我知道了。我把你的代码放在Loadednot LoadCompleted。不知何故，Height 适合，但 Width 不适合（设置为 3819）。但我想我会让它发挥作用。谢谢！
在Navigating 事件中设置browser.Width = 0; browser.Height = 0; 后宽度将起作用。另外不要忘记纠正正文：builder.AppendLine("<body scroll=\"no\">"); 运行代码后，这是我得到的初始结果：Screenshot

【解决方案2】：

http://setmy.browsersize.com/ 这有帮助吗？这似乎允许您将浏览器设置为用于开发目的的设置大小。我觉得这可能是朝着正确方向的推动？

<a href='javascript:(function(w,h){
var n=window,d=document,s=n.screen;
function r(o){      
    n.resizeTo(Number(w)+o,h);
    return n.innerWidth||d.body.clientWidth;
} 
function c(t,u){
    return t>u?(t-u)>>1:0;
}
if(r(1)==r(0)) { 
    if(typeof p=="undefined"||p.closed){
        $("info").className="no_popup";
        p=n.open(n.location.href,
            "resize_popup",
            "menubar,
            toolbar,
            location,
            directories,
            status,
            resizable,
            titlebar,
            ".split(",").join("=yes,")+",
            width="+w+",height="+h+",
            left="+c(s.width,w)+",
            top="+c(s.height,h));
     } else {
            p.focus();
     }
     p.resizeTo(w,h);n=p;
}
if(w>s.width||h>s.height){
    n.moveTo(0,0);
}
})(640, 480);'>640 x 480</a>

【讨论】：

感谢您的努力，但这似乎不是我正在寻找的解决方案。它只是为浏览器设置一个固定的宽度/高度。我希望浏览器随内容缩放。如果我可以获得内容尺寸，则设置固定尺寸只是一种解决方案。
我认为有一些方法可以从 JQuery 中获取这些信息 - 然后你需要做的就是将它传递给函数来设置浏览器尺寸。
例如 - $(document).height() 返回 HTML 文档的高度（与返回视口高度的 $(window).height() 相反。与 .width 相同()
好吧，这似乎可行。但是（如何）我可以在 WPF 中将它放入我的Browser Control 中吗？ - 请注意，html 是在代码中创建的。没有文件或网址！
总有可能以与编写 HTML 相同的方式将内联 javascript 直接写入浏览器控件 - 您甚至可以缩小 JS 以使其适合。我确信有一种更简单的方法可以做到这一点 - 它调用归结为在渲染窗口之前知道内容的大小。如果它真的是一个“天赋”，那么你就会知道它的大小，但我相信这只是一个例子！