एंड्रॉइड वेबव्यू - वेबपेज को डिवाइस स्क्रीन को फिट करना चाहिए

Question

मैंने डिवाइस स्क्रीन आकार के आधार पर वेबपृष्ठ को फिट करने के लिए निम्नलिखित प्रयास किए हैं।

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"/>

लेकिन कुछ भी काम नहीं करता है, वेबपेज डिवाइस स्क्रीन के आकार के लिए तय नहीं है।

क्या कोई मुझे बता सकता है कि यह कैसे प्राप्त करें?

Answer 1

आपको उस पैमाने की गणना करनी होगी जो आपको मैन्युअल रूप से उपयोग करने की आवश्यकता है, बजाय 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());

Comments

आपके उत्तर के लिए धन्यवाद, उर सही, यह काम करता है। लेकिन मेरा अलग मुद्दा है। मैं एक छवि लोड नहीं कर रहा हूं, वेबपेज को वेबव्यू में लोड कर रहा हूं, इसलिए वेबपेज की चौड़ाई (PIC_WIDTH) कैसे पता करें।

— SWDeveloper

आह, मुझे लगता है कि वहाँ में लगातार याद किया। उसके लिए माफ़ करना। मुझे यकीन नहीं है कि आप वास्तविक वेबपेज की चौड़ाई कैसे प्राप्त कर सकते हैं।

— danh32

यहां PIC_WIDTH क्या है?

— परेश मयानी

PIC_WIDTH एक स्थिर था जिसे मैं पहले से जानता था, क्योंकि मैं संपत्ति फ़ोल्डर से केवल एक छवि प्रदर्शित कर रहा था। जैसा कि मैंने ऊपर कहा था, मुझे नहीं पता कि आप वास्तविक वेबपेज की चौड़ाई कैसे प्राप्त कर सकते हैं।

— danh32

@ महेश्वरलीगडे मैं PIC_WIDTH = 360

— निकोलस Ng

Answer 2

आप इसका उपयोग कर सकते हैं

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

यह स्क्रीन आकार के आधार पर आकार को ठीक करता है।

Comments

यह स्क्रीन को फीट करता है लेकिन आपको कभी भी ज़ूम इन / आउट करने की अनुमति नहीं देता है। क्या इस मुद्दे को मधुमक्खी सुधार सकता है?, मुझे पता है कि यह आईओएस पर संभव है।

— एलेक्सएंड्रो

यह सेटिंग मेरे लिए काम करती है, लेकिन केवल चौड़ाई के लिए, एक ही मामले में अब यह ऊंचाई से

— कट रही है

यह मैंने अब तक पाया है इसे प्राप्त करने के लिए सबसे अच्छा समाधान है।

— फ्रैगन

तथ्य यह है कि समाधान वास्तव में मुझे जीता है में बनाया गया है।

— डैनियल हांडोजो

ज़ूम जोड़ने के लिए, निम्नलिखित जोड़ें: webview.getSettings ()। SetBuiltInZoomControls (सच); webview.getSettings () setDisplayZoomControls (गलत)।

— एंड्रयू 8

Answer 3

दोस्त,

मुझे आपसे बहुत से आयात और बढ़िया सुझाव मिले। लेकिन, मेरे लिए एकमात्र तरीका इस तरह से था:

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/");

मैं कंपनी से उपकरणों के प्रकार के कारण एंड्रॉइड 2.1 पर काम कर रहा हूं। लेकिन मैंने अपनी समस्या को हर एक से informations के हिस्से का उपयोग करके तय किया।

धन्यवाद!

Comments

फिर जूम करना अब काम नहीं करता है। मैं इस समस्या के साथ एक ही हूँ?

— परीक्षण

@ क्या आपको इसका कोई हल मिला?

— अंशुल त्यागी

@AnshulTyagi: नहीं, मैंने नहीं किया। क्योंकि यह मेरे लिए एक परीक्षण परियोजना थी, इसलिए मैंने इसमें और जांच नहीं की। मुझे पता है अगर तुम कुछ मिल!

— परीक्षण

@AnshulTyagi: वेब पृष्ठों के लिए यह दृष्टिकोण मेरे लिए काम कर रहा है। छवियों के लिए मुझे कुछ अलग उपयोग करना होगा ...

— परीक्षण

Answer 4

इन सेटिंग्स ने मेरे लिए काम किया:

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

setInitialScale (1) मेरे प्रयासों में गायब था।

हालाँकि दस्तावेज़ीकरण कहता है कि 0 सभी तरह से ज़ूम आउट करेगा यदि setUseWideViewPort सही पर सेट है, लेकिन 0 ने मेरे लिए काम नहीं किया और मुझे 1 सेट करना पड़ा ।

Comments

मैं इंटियल स्केल सेट नहीं कर रहा था, और इसने मेरे लिए सालों तक काम किया। (मैं सिर्फ अवलोकन मोड और viewport की स्थापना कर रहा था)। लेकिन एक नया उपकरण Ive अभी आया था जब तक पृष्ठ ताज़ा नहीं हुआ, ज़ूम करना शुरू कर दिया। मेरे लिए यह निर्धारित करने के लिए अंतर पैमाने तय करना।

— Doomsknight 10

Answer 5

इस HTML5 सुझावों के साथ प्रयास करें

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

और इसके साथ यदि आपका Android संस्करण 2.1 या अधिक है

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

Comments

दुर्भाग्य से वे इस पदावनत और इस समाधान Galaxy S5 पर मेरे लिए असफल रहा था

— 2cupsOfTech

Answer 6

बस आपको बस इतना करना चाहिए

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

Answer 7

ये मेरे लिए काम करते हैं और वेबवे को स्क्रीन की चौड़ाई में फिट करते हैं:

// 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);  

उपर्युक्त सलाह और ग्रहण वेब दृश्य में व्हाइट लाइन

Comments

ऐसा लगता है कि SINGLE_COLUMN का अब विकास हो

— अलेक्जेंडर अब्रामोव

Answer 8

इस कोड का उपयोग करने पर मुझे एक ही समस्या है

webview.setWebViewClient(new WebViewClient() {
}

ऐसा हो सकता है कि आप इसे अपने कोड में हटा दें
और अपने वेबव्यू के लिए नीचे 3 मोड जोड़ना याद रखें

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

यह स्क्रीन आकार के आधार पर आकार को ठीक करता है

Comments

@ शहजैनाली आप अपने वेबव्यू को ज़ूम कर सकते हैं?

— अंशुल त्यागी

@AnshulTyagi नहीं यह ज़ूम नहीं करता है।

— शाहजैन अली

Answer 9

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

यह मेरे लिए बहुत अच्छा काम करता है क्योंकि पाठ का आकार वास्तव में .setLoadWithOverViewMode और .setUseWideViewPort द्वारा छोटा किया गया है।

Answer 10

मेरे पास html स्ट्रिंग में वीडियो था, और वेब दृश्य की चौड़ाई स्क्रीन की चौड़ाई से बड़ी थी और यह मेरे लिए काम कर रहा है।

इन पंक्तियों को HTML स्ट्रिंग में जोड़ें।

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

HTML स्ट्रिंग में उपरोक्त कोड जोड़ने के बाद परिणाम:

<!DOCTYPE html>
<html>

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


</html>

Answer 11

आपको इस मामले में अपने webView में HTML का उपयोग करना होगा। मैंने निम्नलिखित कोड का उपयोग करके इसे हल किया

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);

Comments

मुझे लगता है कि% के बजाय px ot vh का उपयोग करना बेहतर है। % iframes में ओरिएंटेशन

— चेंजेस

Answer 12

प्रदर्शन के बाद से danh32 द्वारा उत्तर में परिवर्तन करना। विजेट (); अब पदावनत हो गया है।

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();
}

फिर उपयोग करें

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

Comments

मैंने गणना की कि स्केल <1 या 100% होना चाहिए इसलिए मैंने अनुपात प्राप्त करने के लिए PIC_WIDTH के साथ अपनी चौड़ाई की तुलना की। इससे ज्यादा मैंने कुछ पैडिंग भी काट ली।

— अभिनव सक्सेना

Answer 13

यह एक XML समस्या की तरह लगता है। अपने वेब-व्यू वाले XML दस्तावेज़ को खोलें। शीर्ष पर पैडिंग कोड हटाएं।

फिर लेआउट में, जोड़ें

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

वेब-व्यू में, जोड़ें

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

यह वेब-व्यू को डिवाइस स्क्रीन के अनुकूल बनाता है।

Comments

यही मेरा समय बचाता है।

— कबकी

fill_parent पुराना है, match_parent का उपयोग करें।

— ट्रेवर हार्ट

Answer 14

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

काम करेंगे, लेकिन याद रखें कि कुछ को हटा दें:

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

अगर html फ़ाइल में मौजूद है या उपयोगकर्ता-स्केलेबल = हां को बदल सकता है, अन्यथा यह नहीं होगा।

Answer 15

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

Comments

getRight और getLeft हमेशा मेरे लिए 0 लौटाती है

— yrazlik

Answer 16

यह वेबपृष्ठ के अनुसार एमुलेटर को समायोजित करने में मदद करेगा:

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

जैसा कि ऊपर दिखाया गया है आप प्रतिशत में अंतर पैमाने को सेट कर सकते हैं।

Answer 17

प्रदर्शन ऑब्जेक्ट का getWidth तरीका हटा दिया गया है। उपलब्ध होने पर WebView का आकार प्राप्त करने के लिए OnSizeChanged को ओवरराइड करें।

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);
    }
};

Comments

कैसे मिलता है WEB_PAGE_WIDTH?

— परीक्षण

यदि आप स्क्रीन को फिट करने के लिए कुछ निश्चित चौड़ाई की सामग्री को स्केल करने की कोशिश कर रहे हैं, तो आपको पहले से पता होना चाहिए कि आपकी सामग्री कितनी व्यापक है। क्या इसका कोई मतलब है?

— शार्कली

ठीक है यह छवियों के लिए काम करना चाहिए। लेकिन वेबपेजों के लिए (जो उत्तरदायी हो सकता है) उदाहरण के लिए यह किसी भी चौड़ाई> 320px हो सकता है।

— परीक्षण

Answer 18

सिद्धांत रूप में संयोजन:

settings.setLayoutAlgorithm(LayoutAlgorithm.NARROW_COLUMNS); 

साथ में

settings.setUseWideViewPort(false)

स्क्रीन पर सामग्री और फिटिंग को लपेटकर समस्या को ठीक करता है। लेकिन NARROW_COLUMNS को हटा दिया गया है। मैं आपको नीचे दिए गए इस सूत्र को पढ़ने की सलाह देता हूं जो इस मुद्दे को विस्तार से बताता है: https://code.google.com/p/android/issues/detail?id=62378

Answer 19

यहाँ एक अद्यतन संस्करण, @ danh32 के उत्तर के आधार पर, पदावनत विधियों का उपयोग नहीं कर रहा है:

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;
    }
}

एक जैसे इस्तेमाल किया जाना है:

int initialScale = this.getScale(420d);
this.mWebView.setInitialScale(initialScale);

Answer 20

संदर्भ के लिए, यह @ danh32 के समाधान का कोटलिन कार्यान्वयन है:

private fun getWebviewScale (contentWidth : Int) : Int {
    val dm = DisplayMetrics()
    windowManager.defaultDisplay.getRealMetrics(dm)
    val pixWidth = dm.widthPixels;
    return (pixWidth.toFloat()/contentWidth.toFloat() * 100F)
             .toInt()
}

मेरे मामले में, चौड़ाई तीन छवियों द्वारा निर्धारित की गई थी ताकि 300 पिक्स हों:

webview.setInitialScale(getWebviewScale(300))

इस पोस्ट को खोजने में मुझे घंटों लग गए। धन्यवाद!

Answer 21

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);

Comments

कृपया नीचे दिए गए वोटों के कारण एक ही सामग्री के साथ दो उत्तर पोस्ट न करें।

— Techydesigner

और कृपया आप प्रयास के एक बिट खर्च कोड प्रारूप! आपने इसे सही करने के लिए क्यों प्रेरित किया? कुछ सफेद स्थान को हटाने के लिए बहुत समय?

— मैसिमिलियानो क्रुस