`
hemowolf
  • 浏览: 154338 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

webview页面随设备分辨率缩放

阅读更多

android客户端常会调用到html页面,给webview页面适配android凌乱的设备带来很大的困难。

可以找到的方法是通过ZoomDensity.setDefaultZoom根据分辨率480宽度为基准缩放。

不过ZoomDensity.setDefaultZoom在2.0以下的平台是无法调用的,需要自己反射调用。

即使是ZoomDensity.setDefaultZoom设置了缩放,但还是会在很多设备无效。经过摸索还需做一些修改:

1,页面head添加

     <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />

 

2,设置字体也按480基准缩放。

 

下面是代码:

 

 

    private void setZoom(WebSettings webSettings) {
	int screenDensity = getResources().getDisplayMetrics().densityDpi;
	String zd = "FAR";
	switch (screenDensity) {
	case DisplayMetrics.DENSITY_LOW:
	    zd = "CLOSE";
	    break;

	case DisplayMetrics.DENSITY_MEDIUM:
	    zd = "MEDIUM";
	    break;
	}
	Class<?> zoomDensityClass = null;
	Enum<?> zoomDensity = null;

	try {
	    if (zoomDensityClass == null) {
		zoomDensityClass = Class.forName("android.webkit.WebSettings$ZoomDensity");
	    }
	    if (zoomDensity == null) {
		zoomDensity = (Enum<?>) Enum.valueOf((Class) zoomDensityClass,zd);
	    }

	    Method method = WebSettings.class.getDeclaredMethod( "setDefaultZoom", new Class<?>[] { zoomDensityClass });
	    if(method!=null){
		method.invoke(webSettings, zoomDensity);
	    }
	    
	    method = WebSettings.class.getDeclaredMethod( "setTextZoom", new Class<?>[] { int.class });
	    if(method!=null){
		method.invoke(webSettings, 100 * getWindowManager().getDefaultDisplay().getWidth() / 480);
	    }
	} catch (Exception e) {
	    Log.e(TAG, e.getMessage());
	    return;
	}
    }
 
分享到:
评论
3 楼 Will.Du 2013-01-28  
hemowolf 写道
Will.Du 写道
4.0以上也废了,我现在是改字体大小

页面有图片改字体则不同用了。不过android的设备众多,通用法则经不起考验啊!

是啊,你没看我写的blog,我考虑用CSS缩放图片。。。蛋疼啊
2 楼 hemowolf 2013-01-28  
Will.Du 写道
4.0以上也废了,我现在是改字体大小

页面有图片改字体则不同用了。不过android的设备众多,通用法则经不起考验啊!
1 楼 Will.Du 2013-01-25  
4.0以上也废了,我现在是改字体大小

相关推荐

    webview自适应屏幕

    然而,由于不同设备的屏幕尺寸和分辨率各异,如何让网页在WebView中实现良好的自适应性是开发者常常面临的问题。本篇文章将深入探讨如何处理"webview自适应屏幕",特别是针对图片和表格过大导致超出屏幕的情况。 ...

    Android Webview滑动监听

    在`WebViewClient`中,我们可以监听页面的加载状态,但默认情况下,Webview会处理所有的触摸事件。为了拦截滑动事件,我们需要覆盖`shouldOverrideUrlLoading()`方法,并在其中添加滑动手势监听器。 ```java ...

    viewport与android的webview

    正确设置`viewport`可以帮助页面自适应不同分辨率和屏幕尺寸的设备,提高用户体验。 **二、Android Webview** `Android Webview` 是Android SDK提供的一种组件,它基于Chromium内核,可以在Android应用内部加载和...

    Android中WebView加载的网页被放大的解决办法

    在高分辨率的设备上,WebView可能为了适应屏幕尺寸,会自动进行缩放操作。这通常是因为WebView的默认设置导致的,尤其是WebSettings中的相关配置。WebSettings是用于控制WebView行为的一个类,其中包含了多种设置...

    Android编程实现WebView自适应全屏方法小结

    这里根据设备的像素密度设置了不同的缩放级别,以适应不同分辨率的屏幕。 最后,如果网页的高度是固定的,例如960像素,我们可以使用`setInitialScale`来设置初始缩放比例,以实现全屏显示: ```java int ...

    WebView的使用

    对于手机适配问题,WebView需要处理不同屏幕尺寸和分辨率。可以通过设置WebSettings的缩放功能来改善用户体验: ```java webView.getSettings().setUseWideViewPort(true); // 自适应屏幕宽度 webView.getSettings()...

    android WebView加载html5介绍

    总之,通过合理使用`viewport`、CSS媒体查询以及JavaScript,我们可以有效地解决`WebView`加载HTML5页面在多分辨率Android设备上的适配问题,从而提供一致且优质的用户体验。在实际开发中,应根据项目需求和目标用户...

    android加载html5 360°全景

    在360°全景展示中,最常用的是`&lt;img&gt;`标签配合`srcset`属性或`&lt;picture&gt;`标签来处理不同分辨率和设备的图片。此外,HTML5的`&lt;canvas&gt;`元素可以用于动态渲染全景图,通过JavaScript进行旋转、缩放等交互操作。例如,...

    工程硕士学位论文 基于Android+HTML5的移动Web项目高效开发探究

    (3)针对页面自适应问题,本文结合渐进增强以及拥抱流式布局的思想,同时研究利用了移动设备的视口特性,实现跨分辨率、跨设备的页面自适应。 (4)针对系统的功能实现问题,通过结合利用原生态框架与HTML5的跨平台...

    超详细讲解H5移动端适配.doc

    在移动互联网时代,H5页面的移动端适配成为前端开发中的关键任务,因为各种移动设备的物理分辨率各异。为了确保H5页面在不同设备上展示一致,我们需要理解一些基本概念和技术。 首先,屏幕尺寸是指屏幕对角线的长度...

    android可缩放矢量图.zip

    在Android开发中,可缩放矢量图(SVG)是一种重要的图像格式,它允许开发者创建图形,这些图形在不同分辨率和尺寸的设备上都能保持清晰和高质量。与传统的位图图像(如JPEG或PNG)相比,矢量图不依赖像素,而是基于...

    基于HTML5的Android开发

    通过在HTML头部添加`&lt;meta&gt;`标签,可以控制页面的初始缩放比例、最大最小缩放比例以及目标设备的屏幕密度。例如: ```html , initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /&gt; ``` 5. **CSS控制...

    HTML5开发Android应用程序概述.ppt

    例如,`width=device-width`会让网页宽度等于设备宽度,`user-scalable=no`则禁止用户手动缩放页面。此外,还可以设置初始缩放比例、最小缩放比例、最大缩放比例以及目标设备密度。 在处理多分辨率适配时,CSS媒体...

    Android应用源码截屏和截取网页整页内容

    这个过程需要注意滚动和截图的同步,以及处理好不同设备的分辨率和缩放比例问题。 总结起来,Android应用源码中的屏幕截图和截取网页整页内容主要涉及对Surface和Canvas的操作,以及WebView的滚动和渲染。理解这些...

    jQuery Mobile 1.1.1最新版

    1. **响应式设计**:jQuery Mobile 1.1.1 采用响应式网页设计,使得网页能够自动适应不同屏幕尺寸和分辨率的设备,包括智能手机、平板电脑和桌面电脑。这通过灵活的布局和媒体查询实现,确保用户在任何设备上都能...

    Android应用开发新路线(用HTML5开发Android应用)

    viewport标签中可以设置视窗的宽度、高度、缩放比例以及目标设备密度等,确保网页在不同分辨率的Android设备上都能有良好的用户体验。 构建HTML5应用程序时,开发者可以利用WebView组件在Android设备上加载HTML5...

    android仿ucweb界面编程

    WebView不仅可以加载网页,还支持JavaScript交互、页面缩放、前进/后退等操作。 5. **网络请求**:为了加载网页,需要处理HTTP请求。Android提供了HttpURLConnection或者第三方库如Volley、OkHttp来完成网络请求。...

Global site tag (gtag.js) - Google Analytics