program story

Android Webview-웹 페이지가 기기 화면에 맞아야합니다.

inputbox 2020. 8. 24. 08:19
반응형

Android Webview-웹 페이지가 기기 화면에 맞아야합니다.

장치 화면 크기에 따라 웹 페이지에 맞게 다음을 시도했습니다.

mWebview.setInitialScale(30);

그런 다음 메타 데이터 뷰포트를 설정합니다.

<meta name="viewport" content="width=320, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; minimum-scale=1.0; user-scalable=0;"/>
<meta name="viewport" content="width=device-width, target-densityDpi=medium-dpi"/>

그러나 아무것도 작동하지 않으며 웹 페이지는 장치 화면 크기로 고정되지 않습니다.

누구든지 이것을 얻는 방법을 말해 줄 수 있습니까?

30으로 설정하는 대신 수동으로 사용해야하는 척도를 계산해야합니다.

private int getScale(){
    Display display = ((WindowManager) getSystemService(Context.WINDOW_SERVICE)).getDefaultDisplay(); 
    int width = display.getWidth(); 
    Double val = new Double(width)/new Double(PIC_WIDTH);
    val = val * 100d;
    return val.intValue();
}

그런 다음

WebView web = new WebView(this);
web.setPadding(0, 0, 0, 0);
web.setInitialScale(getScale());

이것을 사용할 수 있습니다

    WebView browser = (WebView) findViewById(R.id.webview);
    browser.getSettings().setLoadWithOverviewMode(true);
    browser.getSettings().setUseWideViewPort(true);

이것은 화면 크기에 따라 크기를 수정합니다.

친구,

나는 당신에게서 많은 수입품과 훌륭한 정보를 발견했습니다. 하지만 저에게 효과가있는 유일한 방법은 다음과 같습니다.

webView = (WebView) findViewById(R.id.noticiasWebView);
webView.setInitialScale(1);
webView.getSettings().setJavaScriptEnabled(true);
webView.getSettings().setLoadWithOverviewMode(true);
webView.getSettings().setUseWideViewPort(true);
webView.setScrollBarStyle(WebView.SCROLLBARS_OUTSIDE_OVERLAY);
webView.setScrollbarFadingEnabled(false);
webView.loadUrl("http://www.resource.com.br/");

나는 회사의 기기 종류 때문에 Android 2.1에서 작업하고 있습니다. 하지만 각 정보의 일부를 사용하여 문제를 해결했습니다.

감사합니다!

이 설정은 저에게 효과적이었습니다.

wv.setInitialScale(1);
wv.getSettings().setLoadWithOverviewMode(true);
wv.getSettings().setUseWideViewPort(true);
wv.getSettings().setJavaScriptEnabled(true);

내 시도에서 setInitialScale (1) 이 누락되었습니다.

문서에 따르면 setUseWideViewPort 가 true 로 설정되어 있으면 0 이 완전히 축소 되지만 0 이 작동하지 않아 1 을 설정해야했습니다 .

이 HTML5 팁으로 시도

http://www.html5rocks.com/en/mobile/mobifying.html

Android 버전이 2.1 이상이면 이것으로

  WebView.getSettings().setLayoutAlgorithm(LayoutAlgorithm.SINGLE_COLUMN);

당신이해야 할 일은 단순히

webView.getSettings().setLayoutAlgorithm(LayoutAlgorithm.SINGLE_COLUMN);
webView.getSettings().setLoadWithOverviewMode(true);
webView.getSettings().setUseWideViewPort(true);

이것들은 나를 위해 작동하며 WebView를 화면 너비에 맞 춥니 다.

// get from xml, with all size set "fill_parent"  
webView = (WebView) findViewById(R.id.webview_in_layout);  
// fit the width of screen
webView.getSettings().setLayoutAlgorithm(LayoutAlgorithm.SINGLE_COLUMN); 
// remove a weird white line on the right size
webView.setScrollBarStyle(WebView.SCROLLBARS_OUTSIDE_OVERLAY);

이클립스 웹보기에서 위의 조언과 화이트 라인 감사합니다.

이 코드를 사용할 때도 같은 문제가 있습니다.

webview.setWebViewClient(new WebViewClient() {
}

그래서 당신은 당신의 코드에서 그것을 제거 해야 할 수도 있습니다
그리고 당신의 webview에 대해 아래 3 가지 모드를 추가하는 것을 잊지 마십시오

    webview.getSettings().setJavaScriptEnabled(true);  
    webview.getSettings().setLoadWithOverviewMode(true);
    webview.getSettings().setUseWideViewPort(true);

이것은 화면 크기에 따라 크기를 수정합니다.

WebView browser = (WebView) findViewById(R.id.webview);
browser.getSettings().setLoadWithOverviewMode(true);
browser.getSettings().setUseWideViewPort(true);
browser.getSettings().setMinimumFontSize(40);

This works great for me since the text size has been set to really small by .setLoadWithOverViewMode and .setUseWideViewPort.

You have to use HTML in your webView in this case. I solved this using following code

webView.loadDataWithBaseURL(null,
                "<!DOCTYPE html><html><body style = \"text-align:center\"><img src= "
                        + \"http://www.koenvangorp.be/photos/2005_09_16-moon_2000.jpg\"
                        + " alt=\"pageNo\" width=\"100%\"></body></html>",
                "text/html", "UTF-8", null);

Making Changes to the answer by danh32 since the display.getWidth(); is now deprecated.

private int getScale(){
    Point p = new Point();
    Display display = ((WindowManager) getSystemService(Context.WINDOW_SERVICE)).getDefaultDisplay(); 
    display.getSize(p);
    int width = p.x; 
    Double val = new Double(width)/new Double(PIC_WIDTH);
    val = val * 100d;
    return val.intValue();
}

Then use

WebView web = new WebView(this);
web.setPadding(0, 0, 0, 0);
web.setInitialScale(getScale());

This seems like an XML problem. Open the XML document containing your Web-View. Delete the padding code at the top.

Then in the layout , add

android:layout_width="fill_parent"
android:layout_height="fill_parent"

In the Web-View, add 

android:layout_width="fill_parent"
android:layout_height="fill_parent"

This makes the Web-View fit the device screen.

I had video in html string, and width of web view was larger that screen width and this is working for me.

Add these lines to HTML string. 

<head>
<meta name="viewport" content="width=device-width">
</head>

Result after adding above code to HTML string:

<!DOCTYPE html>
<html>

<head>
<meta name="viewport" content="width=device-width">
</head>


</html>

int PIC_WIDTH= webView.getRight()-webView.getLeft();

The getWidth method of the Display object is deprecated. Override onSizeChanged to get the size of the WebView when it becomes available.

WebView webView = new WebView(context) {

    @Override
    protected void onSizeChanged(int w, int h, int ow, int oh) {

        // if width is zero, this method will be called again
        if (w != 0) {

            Double scale = Double.valueOf(w) / Double.valueOf(WEB_PAGE_WIDTH);

            scale *= 100d;

            setInitialScale(scale.intValue());
        }

        super.onSizeChanged(w, h, ow, oh);
    }
};

webview.setInitialScale(1);
webview.getSettings().setLoadWithOverviewMode(true);
webview.getSettings().setUseWideViewPort(true);
webview.getSettings().setJavaScriptEnabled(true);

will work, but remember to remove something like:

<meta name="viewport" content="user-scalable=no"/>

if existed in the html file or change user-scalable=yes, otherwise it won't.

This will help in adjusting the emulator according to the webpage:

WebView wb;
//CALL THIS METHOD
wb.setInitialScale(50);

You can set the intial scale in percentage as shown above.

In theory the combination of:

settings.setLayoutAlgorithm(LayoutAlgorithm.NARROW_COLUMNS);

with 

settings.setUseWideViewPort(false)

fixes the problem, wrapping the content and fitting to the screen. But the NARROW_COLUMNS has been deprecated. I advice you to read this thread below that explores the issue in detail: https://code.google.com/p/android/issues/detail?id=62378

here's an updated version, not using deprecated methods, based upon @danh32's answer:

protected int getScale(Double contentWidth) {
    if(this.getActivity() != null) {
        DisplayMetrics displaymetrics = new DisplayMetrics();
        this.getActivity().getWindowManager().getDefaultDisplay().getMetrics(displaymetrics);
        Double val = displaymetrics.widthPixels / contentWidth * 100d;
        return val.intValue();
    } else {
        return 100;
    }
}

to be used alike:

int initialScale = this.getScale(420d);
this.mWebView.setInitialScale(initialScale);
  • setLoadWithOverviewMode(true) - loads the WebView completely zoomed out
  • setUseWideViewPort(true) makes the Webview have a normal viewport (such as a normal desktop browser), while when false the webview will have a viewport constrained to its own dimensions (so if the webview is 50px*50px the viewport will be the same size)

Read more here

I had a situation when I was not an owner of WebView, also I resized WebView after page had been finished, as a result I had some side effect with zoom. My solution is:

webView.post(new Runnable() {
    @Override
    public void run() {
        webView.getSettings().setLoadWithOverviewMode(true);
    }
}); 

WebView webView = (WebView)findViewById(R.id.web_view);
webView.setInitialScale((int) getResources().getDimension(R.dimen._50sdp)); // getActivity(). if you are at Fragment
webView.getSettings().setLoadsImagesAutomatically(true);
webView.getSettings().setJavaScriptEnabled(true);
webView.setScrollBarStyle(View.SCROLLBARS_INSIDE_OVERLAY);
webView.loadDataWithBaseURL(null,here comes html content,"text/html","UTF-8", null);
webView.getSettings().setBuiltInZoomControls(true);
webView.getSettings().setSupportZoom(true);
webView.getSettings().setDisplayZoomControls(true);
webView.getSettings().setDefaultZoom(WebSettings.ZoomDensity.FAR);

참고URL : https://stackoverflow.com/questions/3916330/android-webview-webpage-should-fit-the-device-screen

반응형

'program story' 카테고리의 다른 글

UITableView가 iPhone에서 맨 아래로 스크롤되었는지 확인하는 방법  (0) 2020.08.24
Android-java- 객체 내 특정 값으로 객체 목록을 정렬하는 방법  (0) 2020.08.24
왜 나는 = 나는 + 나는 0을 제공합니까?  (0) 2020.08.24
SilverStripe PHP Forms-FieldGroup 내에 SelectionGroup을 중첩하면 관련 SelectionGroup_Items의 Radio Box 중 하나가 표시되지 않습니다.  (0) 2020.08.24
iOS 5에서 빠르고 효율적인 핵심 데이터 가져 오기 구현  (0) 2020.08.24

'program story'의 다른글

  • 현재글Android Webview-웹 페이지가 기기 화면에 맞아야합니다.

관련글

댓글

티스토리툴바