1
我有一個帶有WebView控件的wp 8.1應用程序,該應用程序加載位於Assets文件夾中的HTML文件,因此捆綁在軟件包中。c#Windows Phone 8.1 HTML尺寸小於WebView尺寸
WebView控件的大小設置爲width = 320和height = 50。 html包含一個設置爲width = 320px,height = 50px的div。
現在來了一個有趣的部分:呈現的html比實際的WebView大小小得多,如下圖所示。
問題(S):
- 這究竟是爲什麼?它與視口還是比例有關?如果是,我該如何解決?
- 我應該如何解決這個問題,因此HTML適合的WebView大小?
PS:下面的html是我用於演示的最簡單的。在現實世界中,我從API請求html大小,而API給了我格式化的html,並且我無法控制html。所有這些的目的是顯示來自廣告網絡API的html廣告。
PS2:這發生在wp 8.1和10模擬器上,以及我的lumia 925 win 10上。
這裏是的XAML頁面的代碼片段:
<Page
x:Class="TestWebview.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:TestWebview"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Grid>
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<WebView Name="webview" Width="320" Height="50"/>
<Button Grid.Row="1" HorizontalAlignment="Center" Click="Button_Click">Load me</Button>
</Grid>
這裏是背後的代碼:
using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using Windows.Storage;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Navigation;
namespace TestWebview
{
public sealed partial class MainPage : Page
{
public MainPage()
{
this.InitializeComponent();
this.NavigationCacheMode = NavigationCacheMode.Required;
}
private async void Button_Click(object sender, Windows.UI.Xaml.RoutedEventArgs e)
{
StorageFile file = await StorageFile.GetFileFromApplicationUriAsync(new Uri(@"ms-appx:///Assets/index.html"));
Stream stream = await file.OpenStreamForReadAsync();
StreamReader sr = new StreamReader(stream);
string content = sr.ReadToEnd();
webview.NavigateToString(content);
}
}
}
這裏是指數的內容。 html:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style type="text/css">
#test{
width:320px;
height:50px;
background:red;
position:absolute;
}
</style>
</head>
<body>
<div id="test">Test</div>
</body>
</html>
這似乎是工作,但只有當我手動修改HTML。但是,正如我上面提到的,我沒有控制我在那裏顯示的html。我假設我必須使用InvokeScriptAsync來添加元標記,但我無法使其工作。有沒有另外一種方法呢? – ciprian
@ciprian你可以使用[HttpClient的(https://msdn.microsoft.com/en-us/windows/uwp/networking/httpclient)下載網頁的字符串。然後將該字符串與''組合。在這個調用之後[NavigateToString(https://msdn.microsoft.com/library/windows/apps/xaml/windows.ui.xaml.controls.webview.navigatetostring.aspx)顯示在網頁視圖組合頁面。 –
@ XavierXie-MSFT我能夠做到這一點,它的工作原理。該html看起來像這樣: – ciprian