如何在Windows Phone 7中自动调整WebBrowser控件高度? [英] How to auto adjust WebBrowser control height in Windows Phone 7?

查看:105
本文介绍了如何在Windows Phone 7中自动调整WebBrowser控件高度?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我在xaml中创建了一个WebBrowser控件,
并通过字符串绑定了一些html。它工作正常。
但WebBrowser永远不会自动调整其高度。

 < phone:WebBrowser 
Horizo​​ntalAlignment =Stretch
Margin =0,6,0 ,0Name =myWebView
VerticalAlignment =Top/>

private void WebBrowser_OnLoaded(object sender,RoutedEventArgs e)
{
String htmlTags =< html>< head>< meta charset ='UTF-8'/ >< meta name = \viewport\content = \width ='480',initial-scale ='1'\>< / head>< body>< center> {0}< /中心],[< /体>< / HTML>中;
myWebView.NavigateToString(String.Format(htmlTags,getHTMLContent());
}

public string getHTMLContent()
{
StringBuilder htmlBody = new StringBuilder();
htmlBody.Append(< table cellpadding = \0 \cellspacing = \0 \width = \704 \height = \484\\ \\background = \https://known.com/img/back/123456.jpg\style = \background-repeat:no-repeat; background-position:center; \> );
htmlBody.Append(< tr>);
htmlBody.Append(< td valign = top>);
htmlBody.Append(< div style = \position:absolute; \>);
htmlBody.Append(< div style = \position:absolute; display:table; width:132px; height:132px; top :44px; left:44px; z-index:0; \>);
htmlBody.Append(< img src = \https://known.com/img/icon/ 87654.jpg \width = \100%\height = \100%\/>);
htmlBody.Append(< / div>) ;
htmlBody.Append(< div style = \position:absolute; display:table; width:704px;身高:484px; top:0px; left:0px;的z-index:0; \ > 中);
htmlBody.Append(< img src = \https://known.com/img/icon/234255.jpg\width = \100%\height = \ 100%\ /> 中);
htmlBody.Append(< / div>);
htmlBody.Append(< div style = \position:absolute; display:table; width:440px; height:264px; top:184px; left:184px; z-index:0; font-family :times; font-size:14px; color:#FFFFFF; \align = \center \>);
htmlBody.Append(< div style = \display:table-cell; vertical-align:middle; \>);
htmlBody.Append(< / div>);
htmlBody.Append(< / div>);
htmlBody.Append(< / div>);
htmlBody.Append(< / td>);
htmlBody.Append(< / tr>);
htmlBody.Append(< / table>);
返回htmlBody.ToString();
}

我想让WebBrowser成为



<1>自动调整其高度取决于HTML字符串。如果我只传递一个图像的意思,它应该自动调整取决于图像。
它没有内容的意思,浏览器应该隐藏自己。



<2>不应该滚动,因为WebBrowser已经伸展到适合内容的高度。 / p>

我该怎么做?请让我有任何想法来解决我的问题。

解决方案

您需要使用JavaScript来获取呈现的html的高度并设置它给你的WebBrowser控件。

以下是这个


I have created a WebBrowser control in the xaml, and bind some html via string to it. It's working fine . But the WebBrowser will never auto adjust its height.

<phone:WebBrowser
    HorizontalAlignment="Stretch" 
    Margin="0,6,0,0" Name="myWebView" 
    VerticalAlignment="Top" />

private void WebBrowser_OnLoaded(object sender, RoutedEventArgs e)
{
    String htmlTags = "<html><head><meta charset='UTF-8'/><meta name=\"viewport\" content=\"width='480', initial-scale='1'\"></head><body><center>{0}</center></body></html>";
    myWebView.NavigateToString(String.Format(htmlTags, getHTMLContent());
}

public string getHTMLContent()
{
    StringBuilder htmlBody = new StringBuilder();
    htmlBody.Append("<table cellpadding=\"0\" cellspacing=\"0\" width=\"704\" height=\"484\" background=\"https://known.com/img/back/123456.jpg\" style=\"background-repeat: no-repeat; background-position: center;\">");
    htmlBody.Append("<tr>");
    htmlBody.Append("<td valign=top>");
    htmlBody.Append("<div style=\"position: absolute;\">");
    htmlBody.Append("<div style=\"position: absolute; display: table; width: 132px; height: 132px; top: 44px; left: 44px; z-index:0;\">");
    htmlBody.Append("<img src=\"https://known.com/img/icon/87654.jpg\" width=\"100%\" height=\"100%\"/>");
    htmlBody.Append("</div>");
    htmlBody.Append("<div style=\"position: absolute; display: table; width: 704px; height: 484px; top: 0px; left: 0px; z-index:0; \">");
    htmlBody.Append("<img src=\"https://known.com/img/icon/234255.jpg\" width=\"100%\" height=\"100%\"/>");
    htmlBody.Append("</div>");
    htmlBody.Append("<div style=\"position: absolute; display: table; width: 440px; height: 264px; top: 184px; left: 184px; z-index:0;  font-family:times;  font-size:14px;  color:#FFFFFF; \" align=\"center\">");
    htmlBody.Append("<div style=\"display: table-cell;vertical-align: middle;\">");
    htmlBody.Append("</div>");
    htmlBody.Append("</div>");
    htmlBody.Append("</div>");
    htmlBody.Append("</td>");
    htmlBody.Append("</tr>");
    htmlBody.Append("</table>");
    return htmlBody.ToString();
}

What I want the WebBrowser to be

1) Auto adjust its height depends on the HTML String. If i pass only one image mean, it should auto adjust depends on the image. It there is no content mean, browser should hide itself.

2) Should not scrollable, because the WebBrowser already stretch its height to fit the content.

How can I make it? Please let me any idea to resolve my problem.

解决方案

You need to use javascript to get the height of the rendered html and set it to your WebBrowser control.

Here is an implementation of this.

这篇关于如何在Windows Phone 7中自动调整WebBrowser控件高度?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆