Question

我试图在Android上学习网络视图。我有几个问题。

我有一个PHP页面，它有2-3个小段落和一个Image 是随机生成的。我怎样才能确保整个HTML页面完全适合移动设备的屏幕（滚动条没看到）？如果在某些情况下不可能我怎么做使图像更小，以便它完美地适合每个设备？

第二个问题是假设我在该HTML页面上有一个链接。我想要当我点击此链接（属于不同的域）时在默认浏览器中打开而不是android应用程序。（怎么能这样做。）

package com.example.try2;

import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
import android.view.Window;
import android.view.WindowManager;
import android.webkit.WebSettings;
import android.webkit.WebView;

public class MainActivity extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        //Full screen
        requestWindowFeature(Window.FEATURE_NO_TITLE); 
        this.getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN); 

        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        WebView myWebView = (WebView) findViewById(R.id.webview);
        myWebView.setVerticalScrollBarEnabled(false);
        myWebView.setHorizontalScrollBarEnabled(false);
        myWebView.getSettings().setLoadWithOverviewMode(true); 
        myWebView.getSettings().setUseWideViewPort(true);
        WebSettings webSettings = myWebView.getSettings();
        webSettings.setJavaScriptEnabled(true);
        myWebView.loadUrl("http://www.example.com/mobile/index.php");

    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.activity_main, menu);
        return true;
    }

}

Answer 1

回答你的问题：

您可能实际上必须在HTML / JS代码中执行此操作。挂钩调整大小事件并根据该设备上可用的像素数设置图片大小。以下是jQuery中的一个示例，其中myImage是图像的id，myText是包含页面顶部文本的div的id：

$(window).resize(function() {

    // Compute available height for image
    // by subtracting text div height from screen height
    var availableImageWidth = screen.width;
    var availableImageHeight = screen.height - $('myText').height();

    // Get image width and height
    var imageWidth = $("#myImage").width();
    var imageHeight = $("#myImage").height();

    // Compute scale that maintains aspect ratio and fits image within screen bounds
    var scale = Math.min( availableImageWidth / imageWidth, availableImageHeight / imageHeight);

    // Set new image dimensions
    $("#myImage").width(imageWidth * scale);
    $("#myImage").height(imageHeight * scale);
}

您可以通过覆盖shouldOverrideUrlLoading类的WebViewClient方法来完成此操作：

myWebView.setWebViewClient(new WebViewClient()
{
    public boolean shouldOverrideUrlLoading(WebView view, String url)
    {           
        // Redirect HTTP and HTTPS urls to the external browser
        if (url != null && URLUtil.isHttpUrl(url) || URLUtil.isHttpsUrl(url))
        {
            view.getContext().startActivity(new Intent(Intent.ACTION_VIEW, Uri.parse(url)));
            return true;
        }

        return false;
     }
}

Answer 2

要使图像适合屏幕，只需检查窗口的宽度，并将其与网页上javascript中图像的宽度进行比较。如果图像的宽度大于屏幕的宽度，请将图像的宽度设置为窗口的宽度。

查看jQuery的.width()函数。您可以使用$(window).width()和$('#myimageid").width()。

至于在WebView中打开链接，默认行为是使用用户的默认浏览器（而不是WebView）打开它。如果要覆盖此行为，请查看WebViewClient#shouldOverrideUrl(WebView view, String url)

Android webview。在没有滚动条的情况下在屏幕上安装HTML

2 个答案: