Android में टच इवेंट से स्मूथ ड्राइंग करने का गाइड
यह ट्यूटोरियल दिखाता है कि कैसे Canvas, Bitmap और OnTouchListener का उपयोग करके उंगली के मूवमेंट के अनुसार स्मूथ लाइन ड्रॉ की जाए।
चरण 1: नया प्रोजेक्ट बनाएं
Android Studio में File → New Project चुनकर नया प्रोजेक्ट बनाएं।
चरण 2: लेआउट फ़ाइल में कोड जोड़ें
res/layout/activity_main.xml में:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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"
tools:context=".MainActivity">
<ImageView
android:id="@+id/imageView"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_alignParentStart="true"
android:layout_alignParentEnd="true"
android:layout_alignParentTop="true"
android:src="@drawable/ic_launcher_foreground" />
</RelativeLayout>
चरण 3: MainActivity.java में कोड जोड़ें
src/MainActivity.java में:
import android.graphics.Bitmap;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.Display;
import android.view.MotionEvent;
import android.view.View;
import android.widget.ImageView;
public class MainActivity extends AppCompatActivity implements View.OnTouchListener {
ImageView imageView;
Bitmap bitmap;
Canvas canvas;
Paint paint;
float downX = 0, downY = 0, upX = 0, upY = 0;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
imageView = this.findViewById(R.id.imageView);
Display currentDisplay = getWindowManager().getDefaultDisplay();
float dw = currentDisplay.getWidth();
float dh = currentDisplay.getHeight();
bitmap = Bitmap.createBitmap((int) dw, (int) dh, Bitmap.Config.ARGB_8888);
canvas = new Canvas(bitmap);
paint = new Paint();
paint.setColor(Color.BLACK);
imageView.setImageBitmap(bitmap);
imageView.setOnTouchListener(this);
}
public boolean onTouch(View v, MotionEvent event) {
int action = event.getAction();
switch (action) {
case MotionEvent.ACTION_DOWN:
downX = event.getX();
downY = event.getY();
break;
case MotionEvent.ACTION_MOVE:
// स्मूथ ड्राइंग के लिए यहां लाइन ड्रॉ करें
upX = event.getX();
upY = event.getY();
canvas.drawLine(downX, downY, upX, upY, paint);
imageView.invalidate();
downX = upX;
downY = upY;
break;
case MotionEvent.ACTION_UP:
upX = event.getX();
upY = event.getY();
canvas.drawLine(downX, downY, upX, upY, paint);
imageView.invalidate();
break;
case MotionEvent.ACTION_CANCEL:
break;
default:
break;
}
return true;
}
}
सुधार: ACTION_MOVE में ड्राइंग
मूल कोड केवल ACTION_UP पर लाइन ड्रॉ करता था, जिससे केवल सीधी रेखा बनती थी। ऊपर दिए गए कोड में ACTION_MOVE में भी ड्राइंग जोड़ी गई है जिससे उंगली घुमाते हुए स्मूथ कर्व बनते हैं।
चरण 4: AndroidManifest.xml में कोड जोड़ें
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="https://schemas.android.com/apk/res/android"
package="app.com.sample">
<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>
ऐप चलाएं
डिवाइस कनेक्ट करें, Run आइकन पर क्लिक करें और स्क्रीन पर उंगली घुमाकर ड्राइंग करें।
उन्नत सुझाव
बेहतर प्रदर्शन के लिए कस्टम View बनाएं और onDraw() ओवरराइड करें। Path क्लास का उपयोग करके बीज़ियर कर्व्स से और स्मूथ लाइनें बना सकते हैं।