在WP8中，控件WebBrowser没有提供对滚动条的支持，而在内置的IE中，却可以显示出滚动条（微软这是在坑我们吗），但如果在客户端使用Webbrowser的话，自己构造ScrollBar来显示

　　通过javascript监听onscroll事件，然后传递给Webbrowser，通过onscroll的位置来确定自定义的ScrollBar的位置

下面演示方法：

1、在Html代码中添加javascript代码





function initialize() {

    window.external.notify("scrollHeight=" + document.body.scrollHeight.toString());

    window.external.notify("clientHeight=" + document.body.clientHeight.toString());

    window.onscroll = onScroll;

}

function onScroll(e) {

    var scrollPosition = document.body.scrollTop;

    window.external.notify("scrollTop=" + scrollPosition.toString());

}

window.onload = initialize;






2、在xaml中定义控件




        <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">

            <phone:WebBrowser x:Name="ContentWebBrowser" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"IsScriptEnabled="True" ScriptNotify="ContentWebBrowser_ScriptNotify"/>

            <ScrollBar x:Name="DisplayScrollBar" Orientation="Vertical" HorizontalAlignment="Right" VerticalAlignment="Stretch" Minimum="0" Maximum="100" Value="0"/>

        </Grid>




3、在Webbrowser添加 ScriptNotify 事件方法（注意：需要将Webbrowser的IsScriptEnabled属性设为True）






        private void ContentWebBrowser_ScriptNotify(object sender, NotifyEventArgs e)

        {

            var parts = e.Value.Split('=');

            if (parts.Length != ) return;    

            var number = ;

            if (!int.TryParse(parts[], out number)) return;

            switch (parts[])

            {

                case "scrollHeight":

                    _scrollHeight = number;

                    if (_visibleHeight > )

                    {

                        DisplayScrollBar.Maximum = _scrollHeight - _visibleHeight;

                    }

                    break;

                case "clientHeight":

                    _visibleHeight = number;

                    if (_scrollHeight > )

                    {

                        DisplayScrollBar.Maximum = _scrollHeight - _visibleHeight;

                    }

                    break;

                case "scrollTop":

                    DisplayScrollBar.Value = number;

                    break;

            }

        }






3、测试


　　1）、定义一个WebBrowserHelper生成Html代码




    public class WebBrowserHelper

    {

        public static string NotifyScript

        {

            get

            {

                return @"<script>

                    window.onload = function(){

                        initialize();

                    }

                    function initialize() {

                        window.external.notify('scrollHeight=' + document.body.scrollHeight.toString());

                        window.external.notify('clientHeight=' + document.body.clientHeight.toString());

                        //window.onscroll = onScroll;

                    }

                    function onScroll(e) {

                        var scrollPosition = document.body.scrollTop;

                        window.external.notify('scrollTop=' + scrollPosition.toString());

                    }

                    </script>";

            }

        }

        public static string WrapHtml(string bodyContent, double viewportWidth)

        {

            var html = new StringBuilder();

            html.Append("<html>");

            html.Append(HtmlHeader(viewportWidth));

            html.Append("<body>");

            html.Append(bodyContent);

            html.Append("</body>");

            html.Append(NotifyScript);

            html.Append("</html>");

            return html.ToString();

        }

        public static string HtmlHeader(double viewportWidth)

        {

            var head = new StringBuilder();

            head.Append("<head>");

            head.Append(string.Format("<meta name=\"viewport\" value=\"width={0}\" user-scalable=\"no\" />",

                                      viewportWidth));

            head.Append("</head>");

            return head.ToString();

        }

    }




　　2）传入HTML运行




var html = WebBrowserHelper.WrapHtml(

                    @"<div>123</div><div>123</div><div>123</div><div>123</div><div>123</div>

                    <div>123</div><div>123</div><div>123</div><div>123</div><div>123</div>

                    <div>123</div><div>123</div><div>123</div><div>123</div><div>123</div>

                    <div>123</div><div>123</div><div>123</div><div>123</div><div>123</div>

                    <div>123</div><div>123</div><div>123</div><div>123</div><div>123</div>

                    <div>123</div><div>123</div><div>123</div><div>123</div><div>123</div>

                    <div>123</div><div>123</div><div>123</div><div>123</div><div>123</div>

                    <div>123</div><div>123</div><div>123</div><div>123</div><div>123</div>

                    <div>123</div><div>123</div><div>123</div><div>123</div><div>123</div>

                    <div>123</div><div>123</div><div>123</div><div>123</div><div>123</div>

                    <div>123</div><div>123</div><div>123</div><div>123</div><div>123</div>

                    <div>123</div><div>123</div><div>123</div><div>123</div><div>123</div>

                    <div>123</div><div>123</div><div>123</div><div>123</div><div>123</div>", ContentWebBrowser.Width);

            ContentWebBrowser.NavigateToString(html);




测试成功。


参考：http://www.mistergoodcat.com/post/Somethings-Missing-from-the-WebBrowser-Control
												


											
【WP8】为Webbrowser添加ScrollBar的更多相关文章
	

    
								
  1. 【WP8】WebBrowser相关
		
    2014年09月02日更新 今天用了一下WebBrowser,在使用过程中也遇到了一些问题,在这里做一下记录 虽然WebBrowser比较重,会比较影响性能(除非一定要用到它,否则尽量少用),但有时候 ...
    
		
    2. 
						
  2. 【WP8.1】WebView笔记
		
    之前在WP8的时候做过WebBrowser相关的笔记,在WP8.1的WebView和WebBrowser有些不一样,在这里做一些笔记 下面分为几个部分 1.禁止缩放 2.JS通知后台C#代码(noti ...
    
		
    3. 
						
  3. UGUI之Scrollbar使用
		
    这个效果主要用到了3个组件(对象): 1:Scrollbar对象  滚动条 2:Scroll Rect组件  让对象具有滑动效果 3:Mask组件  遮罩层.把多余的部分隐藏不显示 Scrollbar ...
    
		
    4. 
						
  4. WPF 使用winform的webbrowser
		
    首先要添加如下引用: WindowsFormsIntegration System.Drawing System.Windows.Forms 然后在xaml中添加引用 xmlns:winform=&q ...
    
		
    5. 
						
  5. Unity实现滑页效果（UGUI）
		
    简介 项目需要...直接展示效果吧: 原理 使用UGUI提供的ScrollRect和ScrollBar组件实现基本滑动以及自己控制每次移动一页来达到滑页的效果. 实现过程 1.创建两个panel,上面 ...
    
		
    6. 
						
  6. uGUI练习(七) Drag And Drop
		
    练习目标 练习UI的拖放操作 一.相关组件 EventTrigger Canvas Group ScrollRect Mask Scrollbar 二.拖放练习 1.创建一个Panel,命名Panel ...
    
		
    7. 
						
  7. uGUI练习(六) ScrollView
		
    练习目标 练习uGUI的滑动组件 一.相关组件 ScrollRect Mask Grid Layout Group Scrollbar 二.步骤 1.创建一个Panel,命名为ScrollRect,添 ...
    
		
    8. 
						
  8. Windows phone 8 学习笔记(2) 数据文件操作（转）
		
    Windows phone 8 应用用于数据文件存储访问的位置仅仅限于安装文件夹.本地文件夹(独立存储空间).媒体库和SD卡四个地方.本节主要讲解它们的用法以及相关限制性.另外包括本地数据库的使用方式 ...
    
		
    9. 
						
  9. Windows phone 8 学习笔记(2) 数据文件操作
		
    原文:Windows phone 8 学习笔记(2) 数据文件操作 Windows phone 8 应用用于数据文件存储访问的位置仅仅限于安装文件夹.本地文件夹(独立存储空间).媒体库和SD卡四个地方 ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. JAVA-JSP内置对象之request范围
			
    相关资料:<21天学通Java Web开发> request范围1.在一次请求内有效.2.如果页面从一个页面跳转到另一个页面,那么属性就失效了.3.如果使用服务器端跳转<jsp:fo ...
    
			
    2. 
						
  2. 真机调试报错error ==Error Domain=NSURLErrorDomain Code=-1009 "似乎已断开与互联网的连接。"
			
    真机调试报错error ==Error Domain=NSURLErrorDomain Code=-1009 "似乎已断开与互联网的连接." 请注意,错误代码是-1009,网上关于 ...
    
			
    3. 
						
  3. 解决hibernate向mysql插入中文乱码问题(转)
			
    转载自:http://blog.csdn.net/peditable/article/details/7047573 1.首先需要修改MySQL数据库的配置文件my.ini,此文件放在mysql根目录 ...
    
			
    4. 
						
  4. Java基础篇--字符串处理(StringBuffer)
			
    字符串处理 在Java中最常将字符串作为String类型对象来处理.同时String中也提供了很多操作字符串的函数(可自行查阅资料),而本篇将介绍StringBuffer如何操作字符串. String ...
    
			
    5. 
						
  5. Bootstrap+Angularjs自制弹框
			
    指令 directive('bsPopup', function ($parse) { return { require: 'ngModel', restrict: 'A', link: functi ...
    
			
    6. 
						
  6. win8中的参数传递
			
    列表页面: xaml: Gridview中的数据源是实体的集合: <i:EventToCommand Command="{Binding GridViewItemClick_Comma ...
    
			
    7. 
						
  7. SQLServer2005重建索引前后对比【转】
			
    在做维护项目的时,我们经常会遇到索引维护的问题,通过语句,我们就可以判断某个表的索引是否需要重建. 执行一下语句:先分析表的索引 分析表的索引建立情况:DBCC showcontig('Table') ...
    
			
    8. 
						
  8. 【oneday_onepage】——Microsoft to acquire Nokia's mobile phone business
			
    Nokia will focus on network infrastructure, mapping and locations services and technology developmen ...
    
			
    9. 
						
  9. css关于定位那些事情
			
    css绝对定位.相对定位和文档流的那些事 前言 接触html.和css时间也不短了,但每次用div+css布局的时候心里还是有点儿虚,有时候干脆就直接用table算了,很多时候用div会出现些不可预料 ...
    
			
    10. 
						
  10. Fragment过度动画分析一
			
    Sliding Fragment 介绍:该案例为传统的Fragment增加了个性化的补间动画,其效果是原有fragment向屏幕内做一定的下沉,新的fragment显示在最上层,产生层叠效果的多个fr ...
    
			
    11.