Zoom In and Out to TextView in Android

We will add the zoom in and zoom out feature to TextView. We'll see the image after zooming in. Basically, we'll learn how to increase or decrease font size in Android.

In this article, you will learn how to create your zoom in and zoom out  text Example of zoom in and zoom out  text in Android. So let’s take example of zoom in and zoom out  text  in Android of Mobile application.   

Example of zoom in and zoom out  text

                                                        

Step-by-Step Implementation 
​Step 1: Create a New Project in Android ​studio (File >new  project).


Step 2: Create an ZoomTextView.java file in your layout folder. path (res>layout) 

Implement the same invoke the following code inside

ZoomTextView.java file.

 import android.content.Context;
import android.util.AttributeSet;
import android.util.Log;
import android.util.TypedValue;
import android.view.MotionEvent;
import android.view.ScaleGestureDetector;
import androidx.annotation.NonNull;

public class ZoomTextView extends androidx.appcompat.widget.AppCompatTextView {
private static final String TAG = "ZoomTextView";
private ScaleGestureDetector mScaleDetector;

private float mScaleFactor = 1.f;
private float defaultSize;

private float zoomLimit = 3.0f;


public ZoomTextView(Context context) {
super(context);
initialize();
}

public ZoomTextView(Context context, AttributeSet attrs) {
super(context, attrs);
initialize();
}

public ZoomTextView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
initialize();
}

private void initialize() {
defaultSize = getTextSize();
mScaleDetector = new ScaleGestureDetector(getContext(), new ScaleListener());

}

public void setZoomLimit(float zoomLimit) {
this.zoomLimit = zoomLimit;
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
}
@Override
public boolean onTouchEvent(@NonNull MotionEvent ev) {
super.onTouchEvent(ev);
mScaleDetector.onTouchEvent(ev);
return true;
}

private class ScaleListener extends ScaleGestureDetector.SimpleOnScaleGestureListener {
@Override
public boolean onScale(ScaleGestureDetector detector) {
mScaleFactor *= detector.getScaleFactor();
mScaleFactor = Math.max(1.0f, Math.min(mScaleFactor, zoomLimit));
setTextSize(TypedValue.COMPLEX_UNIT_PX, defaultSize * mScaleFactor);
Log.e(TAG, String.valueOf(mScaleFactor));
return true;
}
} }

Step 3: Create an main_activity.xml file in your layout folder . path (res>layout) 

Implement the same in​voke the following code inside main_activity.xml file.  

 <?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/main"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity3">

<androidx.appcompat.widget.AppCompatTextView
android:id="@+id/txtcandidrootsolution"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Welcome To Candidroot Solutions"
android:textSize="20sp"
android:textStyle="bold"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
Step 4: Create an MainActivity.kt file in your layout folder 

Implement the same in​voke the following code inside MainActivity.kt file.

 import android.annotation.SuppressLint
import android.os.Bundle
import androidx.activity.enableEdgeToEdge
import androidx.appcompat.app.AppCompatActivity

class MainActivity2 : AppCompatActivity() {
@SuppressLint("MissingInflatedId")
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
enableEdgeToEdge()
setContentView(R.layout.activity_main3)
val mTextView = findViewById<ZoomTextView>(R.id.txtzoomtextview)
mTextView.setText("Welcome To Candidroot Solutions")
}
}
Step 5: Output of the above example.

                                  

Happy coding!

 

365Bloggy July 26, 2024
Share this post
Tags
SUBSCRIBE THIS FORM


Archive