Awais Khan
Awais Khan

Reputation: 33

How To disable zoom in/out webview but increase font-size on Pinch

I am developing a simple app on andorid studio in which I am using webview and loading a simple html page with one Heading(h1),I have done increasing font-size by calling javascript function on pinch zoom in/out. Now I want is this to disable the zoom of webview but increase font-size on pinch.

function resizeText(p1) {
    document.getElementById("h1test").style.fontSize = p1;}

This is my simple javascript function of increasing fontsize of h1.

public class MainActivity extends AppCompatActivity {
    private WebView webView;
    private int scalechange;
   private int scale = 20;
   //private int fontsize;
   private String finalscale="";
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        webView = (WebView) findViewById(R.id.webView);
        //fontsize = webView.getSettings().getDefaultFontSize();
        webView.setWebViewClient(new WebViewClient() {



            @Override
            public void onScaleChanged(WebView view, float oldScale, float newScale) {
                super.onScaleChanged(view, oldScale, newScale);

                if(oldScale <= newScale){
                   scale += 1;
                    //float a= scale+1;
                    finalscale = String.valueOf(scale);

                    Log.d("ZoomIn", finalscale);

                }
                else {
                    //float a = scale-1;
                    scale -=1;
                    finalscale = String.valueOf(scale);
                    Log.d("ZoomOut", finalscale);


                }
                //changeFontSize(scale);
                //webView.loadUrl("javascript:testsize('"+scale+"')");
                webView.loadUrl("javascript:resizeText('"+scale+"')");
              // webView.loadUrl("javascript:(document.body.style.fontSize ='"+scale+"');");
                //Toast.makeText(MainActivity.this, "check", Toast.LENGTH_SHORT).show();
                //webView.loadUrl("javascript:js_style('"+scale+"')");


            }
            @Override
            public void onPageFinished(WebView view, String url) {

            }
        });
        webView.getSettings().setSupportZoom(true);
        webView.getSettings().setLoadWithOverviewMode(true);
        webView.getSettings().setUseWideViewPort(true);
        webView.getSettings().setBuiltInZoomControls(true);
        webView.getSettings().setDisplayZoomControls(false);
        webView.getSettings().setJavaScriptEnabled(true);
        webView.loadUrl("file:///android_asset/index.html");
    }


    private void changeFontSize(int value) {
        webView.getSettings().setDefaultFontSize(value);
    }


}

This my code Which I am doing it right now and it works perfect with .setSupportZoom(true).But I Dont want to zoom entire webview,only increase and decrease fontsize on pinch. Kindly Need Some Help!! Thanks in advance

Upvotes: 3

Views: 660

Answers (1)

Doron Ben-Ari
Doron Ben-Ari

Reputation: 582

class MyWebView(context: Context, attributeSet: AttributeSet?) :
 WebView(context, attributeSet) {

    var textZoomF = settings.textZoom.toFloat()

    private val scaleListener = object : ScaleGestureDetector.SimpleOnScaleGestureListener() {
        override fun onScale(detector: ScaleGestureDetector): Boolean {
            textZoomF = (textZoomF * detector.scaleFactor).coerceIn(10f, 1000f)
            settings.textZoom = textZoomF.toInt()
            return true
        }
    }

    private val mScaleDetector = ScaleGestureDetector(context, scaleListener)

    override fun onTouchEvent(ev: MotionEvent): Boolean {
        mScaleDetector.onTouchEvent(ev)
        super.onTouchEvent(ev)
        return true
    }
}

Upvotes: 0

Related Questions