Android WebView文本缩放为不同的屏幕和操作系统版本

时间:2012-04-02 10:21:04

标签: android android-layout zoom android-webview

早上好,我有一个专为智能手机和平板电脑设计的应用程序。 当它在平板电脑上运行时,我想缩放我的webview文本,以便用户可以更好地阅读文本,并在可能的情况下填充所有空白区域。

这是我用来做这个技巧的代码:

//Webview Zoom
            if( UIUtils.isTablet(getActivity())) {
                if(UIUtils.isICS()) {
                    webView.getSettings().setTextZoom(130);
                } else {
                    int currentTextSizeIndex = lyricsView.getSettings().getTextSize().ordinal();
                    if ( currentTextSizeIndex+1 < lyricsView.getSettings().getTextSize().values().length )
                        webView.getSettings().setTextSize( lyricsView.getSettings().getTextSize().values()[currentTextSizeIndex+1] );
                }
            }

所以我检查一下我是否在平板电脑上并检查用户正在使用哪个操作系统版本。 事实上,从API级别14我可以使用setTextZoom,允许我以百分比(默认为100)设置页面的文本缩放。这个解决方案的可扩展性要高得多,因为我可以为用户提供按步骤+10或-10%增加或减少文本的能力。

在API级别14之前,我必须使用使用枚举作为参数的setTextSize(默认为NORMAL)。 TextSize是Enum,用于指定文本大小。 SMALLEST是50%SMALLER是75%NORMAL是100%LARGER是150%LARGEST是200%

所以我只能使用这5个costants并且它不是那么可扩展(但它是将这个功能赋予90%没有ICS的手机的唯一方法:D)。

当我在不同的平板电脑上显示文本视图时,问题是webView.getSettings().setTextSize(TextSize.LARGER);以不同的方式起作用,而且它确实不合适。

目前我正在测试三星Galaxy Tab和Kindle Fire。 这些是GSMArena的技术规范:

Samsung P1000 Galaxy Tab

显示
型号为TFT电容式触摸屏,16M色

尺寸 600 x 1024像素,7.0英寸(~170 ppi像素密度)

Amazon Kindle Fire

显示
型号IPS TFT电容式触摸屏,16M色

尺寸 1024 x 600像素,7.0英寸(~170 ppi像素密度)

正如您所看到的,它们具有相同的分辨率,英寸和ppi! 现在,我将向您展示这些设备的2个截图(相同的webview内容),以便您了解我正在谈论的内容。

KindleFire:Kindle Fire Webview with webView.getSettings().setTextSize(TextSize.LARGER)

Galaxy Tab:Samsung Galaxy Tab Webview with webView.getSettings().setTextSize(TextSize.LARGER)

在带有textSize LARGE的Galaxy Tab上,文字太大了,看起来很难看。因此,对于那种设备,最好在默认情况下显示NORMAL文本(并且让用户选择是否将其放大)。但是我怎么知道哪个是最好的默认textSize来展示?因为NORMAL对于Galaxy Tab来说是好的,而对于Kindle Fire而言太小了,LARGE对于galaxy tab来说太大了,但对Kindle来说却是完美的。我只是在这两个设备上进行测试,但是我要支持所有平板电脑我要找到某种参数,设备中的差异才能说:好在这台设备上,因为分辨率很小我会放大/ normal,而不是这个因为它更大的结果我可以把它放大(有点)。

你有没有遇到过这个问题?我该如何解决?

3 个答案:

答案 0 :(得分:5)

我们在应用程序中看到了类似的问题(一般情况下,不仅仅是在WebViews中)。

最初的三星Galaxy Tab错误地将自己报告为大型hdpi。其他具有相同屏幕尺寸(7英寸)和分辨率(1024x600)的平板电脑正确地将自己报告为大mdpi。这些“正确”的平板电脑包括Kindle Fire,Nook平板电脑,甚至是三星Galaxy Tab 2!我希望HTC Flyer能够做到这一点,但还没试过。

在一篇博客文章中,谷歌声称这是三星做出的一项设计决定:

http://android-developers.blogspot.co.uk/2010/09/screen-geometry-fun.html(搜索“惊喜”)

另一方面,他们声称这是一个错误:

http://android-developers.blogspot.co.uk/2011/07/new-tools-for-managing-screen-sizes.html(搜索“有趣”)。

无论哪种方式,原始的Galaxy Tab都是例外,不应再允许这样做。

我建议使用火上最好看的东西,因为除了原版Galaxy Tab之外,它应该适用于所有7英寸平板电脑。如果你可以让它看起来也可以接受,那么这是一个很好的奖励。

希望有所帮助!

答案 1 :(得分:0)

看看这个:Targeting Screens from Web Apps,视口应该可以帮到你

答案 2 :(得分:0)

你是在展示自己还是其他人的内容?它可能不完全相关,但如果是你的,你可以使用CSS3控制webview中的东西外观,但我不知道你的目标设备上有哪些CSS3支持。