编程知识 购物 网址 新闻 笑话 | 软件 日历 阅读 图书馆 China
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
图片批量下载器
↓批量下载图片,美女图库↓
图片自动播放器
↓图片自动播放器↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
vbs/VBScript DOS/BAT hta htc python perl 游戏相关 VBA 远程脚本 ColdFusion ruby专题 autoit seraphzone PowerShell linux shell Lua Golang Erlang 其它教程 CSS/HTML/Xhtml html5 CSS XML/XSLT Dreamweaver教程 经验交流
站长资讯 .NET新手 ASP.NET C# WinForm Silverlight WCF CLR WPF XNA VisualStudio ASP.NET-MVC .NET控件开发 EntityFramework WinRT-Metro Java C++ PHP Delphi Python Ruby C语言 Erlang Go Swift Scala R语言 Verilog 其它语言 架构设计 面向对象 设计模式 领域驱动 Html-Css JavaScript jQuery HTML5 SharePoint GIS技术 SAP OracleERP DynamicsCRM K2 BPM 信息安全 企业信息 Android开发 iOS开发 WindowsPhone WindowsMobile 其他手机 敏捷开发 项目管理 软件工程 SQLServer Oracle MySQL NoSQL 其它数据库 Windows7 WindowsServer Linux
   -> Windows Phone -> UWP开发入门(二十三)——WebView -> 正文阅读

[Windows Phone]UWP开发入门(二十三)——WebView

  本篇讨论在UWP开发中使用WebView控件时常见的问题,以及一些小技巧。
  WebView是实际开发中常用的控件,很多大家抱怨的套网页的应用都是通过WebView来实现的。这里要澄清一个问题,套网页的应用并不一定是差的应用,很多网页采用了响应式设计,假设网页不存在复杂的交互,提取网页的正文部分嵌入WebView,可以说方便快捷省时省力。比如亚马逊、驴妈妈这些UWP APP都还挺不错的,京东那个网页就套的比较差了……
  WebView最为简单的用法如下:

<WebView Source="http://www.cnblogs.com/manupstairs/"></WebView>

  直接将某个网页显示出来,感觉没有什么卵用……或者我们稍微高级一点,手动加载一下:

        private void Button_Click(object sender, RoutedEventArgs e)
        {
            this.webViewManual.Navigate(new Uri("http://www.cnblogs.com/"));
        }

  

  通过Navigate方法我们能够做到传递参数,在C#代码中Navigate到某个Html页面,但是这在实际使用中很不方便,我们希望WebView能够通过Binding来动态的呈现内容,这需要实现一个简单的附加属性:

    public class WebViewEx
    {
        public static string GetUri(DependencyObject obj)
        {
            return (string)obj.GetValue(UriProperty);
        }

        public static void SetUri(DependencyObject obj, string value)
        {
            obj.SetValue(UriProperty, value);
        }

        // Using a DependencyProperty as the backing store for WebViewUri.  This enables animation, styling, binding, etc...
        public static readonly DependencyProperty UriProperty =
            DependencyProperty.RegisterAttached("Uri", typeof(string), typeof(WebViewEx), new PropertyMetadata(null, PropertyChangedCallback));

        private static void PropertyChangedCallback(DependencyObject d, DependencyPropertyChangedEventArgs e)
        {
            var webView = d as WebView;
            webView.NavigateToString(e.NewValue.ToString());
        }
    }

  在完成上述附加属性的定义后,就可以在XAML中使用binding了,这里binding的HtmlContent属性返回Html格式的字符串。

<WebView Grid.Column="2" local:WebViewEx.Uri="{x:Bind HtmlContent}"></WebView>

  这种绑定部分Html格式字符串的方式通常都工作地比较好。但是如果Html的字符串中存在CSS的class引用,即使你提供的字符串中包含了CSS的样式定义,NavigateToString方法也是无法识别的。举例如下代码:

            string adaptive = "<style> .M_cur_zoom_out { height: auto; width: 100 %; } </style>";
            string html = "<p> <img id =\"pic\" class=\"M_cur_zoom_out\" src=\"http://ww4.sinaimg.cn/large/41467e42jw1f8himcfgnoj20gj1ax793.jpg\" /> </p> <p> 微信订阅号 zhangzishi_weixin 合作请直接联系 tintin@zhangzishi.cc</p>";
            adaptive += html;

            webViewTest.NavigateToString(adaptive);

  样式M_cur_zoom_out无法被WebView正确解析的。但是直接设置image标签的属性则没有问题,MSDN上的描述是:“NavigateToString 支持带有对外部文件(如 CSS、脚本、图像和字体)的引用的内容。但是,它不提供以编程方式生成或提供这些资源程序的方式。”
  变通的方式也很简单,在解析的时候,给img标签内部加上width=100%即可。

        private static void UriPropertyChangedCallback(DependencyObject d, DependencyPropertyChangedEventArgs e)
        {
            var webView = d as WebView;
            var adaptive = e.NewValue.ToString().Replace("<img", "<img width=100%");
            webView.NavigateToString(adaptive);
        }

  

  效果对比如上图,这个小技巧在嵌入图片时很有用。本篇经过几次修改,内容反而越发的减少了,实在是有些汗颜,希望能给初学者一些帮助。
  GitHub:
  https://github.com/manupstairs/UWPSamples/tree/master/UWPSamples/UseWebView
  Windows Phone 最新文章
[UWP] 自定义一个ItemsPanel
WP8.1程序开发中,如何加载本地文件资源或安
UWP 律师信息 MVVM 2.0版本
Win10 FaceAPI小demo开发问题汇总
【转】UWP 捕获全局异常
x:bind不支持样式文件 或 此Xaml文件必须又
WP模拟器修改语言为中文方法
wp仿系统截图
Windows Phone 8 锁屏背景与通知
博客园新闻WP8.1客户端
上一篇文章      下一篇文章      查看所有文章
加:2016-10-12 16:43:24  更:2017-05-17 02:44:48 
 
360图书馆 软件开发资料 购物精选 新闻资讯 Chinese Culture 三丰软件 开发 中国文化 阅读网 日历 万年历 2019年12日历
2019-12-8 18:07:31
多播视频美女直播
↓电视,电影,美女直播,迅雷资源↓
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
图片批量下载器
↓批量下载图片,美女图库↓
  网站联系: qq:121756557 email:121756557@qq.com  编程知识