ওভারভিউ
এই উদাহরণটি দেখায় কিভাবে ScaleGestureDetector ব্যবহার করে একটি ImageView-এ পিনচ-টু-জুম (Pinch-to-Zoom) ফাংশন্যালিটি ইমপ্লিমেন্ট করা যায়।
পূর্বশর্ত
- অ্যান্ড্রয়েড স্টুডিও (কোটলিন)
- Touch event ও ScaleGestureDetector বেসিক জ্ঞান
ধাপ ১: প্রজেক্ট তৈরি করুন
File → New Project → Empty Activity → Language: Kotlin।
ধাপ ২: লেআউট (res/layout/activity_main.xml)
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="https://schemas.android.com/apk/res/android"
xmlns:tools="https://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical"
android:padding="16dp"
tools:context=".MainActivity">
<ImageView
android:id="@+id/imageView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="@drawable/your_high_res_image"
android:scaleType="matrix" />
</LinearLayout>
টিপ: android:scaleType="matrix" ব্যবহার করলে স্কেল ট্রান্সফরমেশন স্মূথ হয়। উচ্চ রেজোলিউশনের ইমেজ ব্যবহার করুন।
ধাপ ৩: MainActivity.kt
package com.example.imagezoom
import android.os.Bundle
import android.view.MotionEvent
import android.view.ScaleGestureDetector
import android.widget.ImageView
import androidx.appcompat.app.AppCompatActivity
import kotlin.math.max
import kotlin.math.min
class MainActivity : AppCompatActivity() {
private lateinit var scaleGestureDetector: ScaleGestureDetector
private var scaleFactor = 1.0f
private lateinit var imageView: ImageView
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
title = "KotlinApp"
imageView = findViewById(R.id.imageView)
scaleGestureDetector = ScaleGestureDetector(this, ScaleListener())
}
override fun onTouchEvent(event: MotionEvent): Boolean {
scaleGestureDetector.onTouchEvent(event)
return true // ইভেন্ট কনসাম করুন
}
private inner class ScaleListener : ScaleGestureDetector.SimpleOnScaleGestureListener() {
override fun onScale(detector: ScaleGestureDetector): Boolean {
scaleFactor *= detector.scaleFactor
// জুম লিমিট সেট করুন (0.1x থেকে 10x)
scaleFactor = max(0.1f, min(scaleFactor, 10.0f))
imageView.scaleX = scaleFactor
imageView.scaleY = scaleFactor
return true
}
}
}
ধাপ ৪: AndroidManifest.xml
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="https://schemas.android.com/apk/res/android"
package="com.example.imagezoom">
<application
android:allowBackup="true"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:roundIcon="@mipmap/ic_launcher_round"
android:supportsRtl="true"
android:theme="@style/AppTheme">
<activity android:name=".MainActivity">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
</manifest>
চলান ও পরীক্ষা
- অ্যাপ চালান।
- দুই আঙ্গুল দিয়ে পিনচ (Pinch) করুন → ইমেজ জুম ইন/আউট হবে।
- জুম লিমিট: ১০% থেকে ১০০০% (0.1x - 10x)।
উন্নত ফিচার যোগ করা (প্যান/ড্র্যাগ)
জুম করার সাথে সাথেই ইমেজ প্যান (Drag) করতে OnTouchListener যোগ করুন:
private var lastX = 0f
private var lastY = 0f
imageView.setOnTouchListener { v, event ->
when (event.action) {
MotionEvent.ACTION_DOWN -> {
lastX = event.x
lastY = event.y
true
}
MotionEvent.ACTION_MOVE -> {
val dx = event.x - lastX
val dy = event.y - lastY
v.translationX += dx
v.translationY += dy
lastX = event.x
lastY = event.y
true
}
else -> false
}
}
উন্নত লাইব্রেরি (প্রোডাকশনের জন্য)
- PhotoView (Chris Banes):
implementation "com.github.chrisbanes:PhotoView:2.3.0"- প্যান, জুম, ডাবল-ট্যাপ সব বিল্ট-ইন। - TouchImageView - মাইক্রো লাইব্রেরি, সহজ ইন্টিগ্রেশন।
সতর্কতা
- বহু বড় ইমেজ + জুম = OOM (OutOfMemory) রিস্ক।
inSampleSizeবা Glide/Picasso থাম্বনেইল ব্যবহার করুন। scaleType="matrix"ছাড়া স্কেল এনিমেশন জারকি হতে পারে।