Trung tâm Tin học – ĐH KHTN Drag và Drop trên Android 3.0 Một trong những cải tiến của Android 3.0 so với các đời Android trước là hỗ trợ trực tiếp cho lập trình viên về việc lập trình xử lý Drag, Drop. Trong bài viết sau đây mình sẽ tạo 1 ứng dụng nho nhỏ demo cho tính năng này. 1/ Các bạn tạo Project như sau: Project name: DragDropDemo Build Target: Android 3.0 Application name: DragDropDemo Package name: com.dac.drag.drop.demo Create Activity: MainActivity 2/ Trong folder Layout các bạn tạo 2 file lay out để dùng làm fragment cho ứng dụng : + dropzone.xml : <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="horizontal" > <View android:id="@+id/droptarget" android:layout_width="75dp" android:layout_height="75dp" android:layout_gravity="center_vertical" android:background="#00ff00" /> <TextView android:id="@+id/dropmessage" android:text="0 drops" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_vertical" android:paddingLeft="50dp" android:textSize="17sp" /> </LinearLayout> Lập trình Android – http://laptrinhdidong.vn Page 1 Trung tâm Tin học – ĐH KHTN + Palette.xml: <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:dot="http://schemas.android.com/apk/res/com.dac.drag.drop.demo" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <com.dac.drag.drop.demo.Dot android:id="@+id/dot1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:padding="30dp" android:tag="Blue dot" dot:color="#ff1111ff" dot:radius="20dp" /> <com.dac.drag.drop.demo.Dot android:id="@+id/dot2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:padding="10dp" android:tag="White dot" dot:color="#ffffffff" dot:radius="40dp" /> </LinearLayout> Trong file main.xml các bạn sữ dụng 2 file trên: <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="match_parent" > <fragment class="com.androidbook.drag.drop.demo.Palette" android:id="@+id/palette" android:layout_width="wrap_content" android:layout_height="match_parent" android:layout_weight="1" /> <fragment class="com.androidbook.drag.drop.demo.DropZone" Lập trình Android – http://laptrinhdidong.vn Page 2 Trung tâm Tin học – ĐH KHTN android:id="@+id/dropzone" android:layout_width="0px" android:layout_height="match_parent" android:layout_weight="2" /> </LinearLayout> 3/ Trong folder values/ các bạn tạo file attrs.xml để quy định thuoc tính cho 2 nút mình sẽ tạo bằng file Java: <?xml version="1.0" encoding="utf-8"?> <resources> <declare-styleable name="Dot"> <attr name="color" format="color" /> <attr name="radius" format="dimension" /> </declare-styleable> </resources> 4/ Và trong Package chính các bạn tạo các file để vẽ và sử lý các nút (dot) đồng thời cũng sinh ra các Log để theo dõi trong View Debug: + Dot.java: package com.dac.drag.drop.demo; import android.content.ClipData; import android.content.Context; import android.content.res.TypedArray; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.Paint; import android.util.AttributeSet; import android.util.Log; import android.view.DragEvent; import android.view.View; public class Dot extends View implements View.OnDragListener { private static final int DEFAULT_RADIUS = 20; private static final int DEFAULT_COLOR = Color.WHITE; private static final int SELECTED_COLOR = Color.MAGENTA; protected static final String DOTTAG = "DragDot"; private Paint mNormalPaint; private Paint mDraggingPaint; private int mColor = DEFAULT_COLOR; Lập trình Android – http://laptrinhdidong.vn Page 3 Trung tâm Tin học – ĐH KHTN private int mRadius = DEFAULT_RADIUS; private boolean inDrag; public Dot(Context context, AttributeSet attrs) { super(context, attrs); TypedArray myAttrs = context.obtainStyledAttributes(attrs, R.styleable.Dot); final int numAttrs = myAttrs.getIndexCount(); for (int i = 0; i < numAttrs; i++) { int attr = myAttrs.getIndex(i); switch (attr) { case R.styleable.Dot_radius: mRadius = myAttrs.getDimensionPixelSize(attr, DEFAULT_RADIUS); break; case R.styleable.Dot_color: mColor = myAttrs.getColor(attr, DEFAULT_COLOR); break; } } myAttrs.recycle(); mNormalPaint = new Paint(); mNormalPaint.setColor(mColor); mNormalPaint.setAntiAlias(true); mDraggingPaint = new Paint(); mDraggingPaint.setColor(SELECTED_COLOR); mDraggingPaint.setAntiAlias(true); setOnLongClickListener(lcListener); setOnDragListener(this ); } private static View.OnLongClickListener lcListener = new View.OnLongClickListener() { private boolean mDragInProgress; public boolean onLongClick(View v) { ClipData data = ClipData.newPlainText("DragData", (String)v.getTag()); mDragInProgress = v.startDrag(data, new View.DragShadowBuilder(v), (Object)v, 0); Log.v((String) v.getTag(), "starting drag? " + mDragInProgress); return true; } }; @Override protected void onMeasure(int widthSpec, int heightSpec) { int size = 2*mRadius + getPaddingLeft() + getPaddingRight(); setMeasuredDimension(size, size); Lập trình Android – http://laptrinhdidong.vn Page 4 Trung tâm Tin học – ĐH KHTN } public boolean onDrag(View v, DragEvent event) { String dotTAG = (String) getTag(); if(event.getLocalState() != this) { Log.v(dotTAG, "This drag event is not for us"); return false; } boolean result = true; int action = event.getAction(); float x = event.getX(); float y = event.getY(); switch(action) { case DragEvent.ACTION_DRAG_STARTED: Log.v(dotTAG, "drag started. X: " + x + ", Y: " + y); inDrag = true; break; case DragEvent.ACTION_DRAG_LOCATION: Log.v(dotTAG, "drag proceeding At: " + x + ", " + y); break; case DragEvent.ACTION_DRAG_ENTERED: Log.v(dotTAG, "drag entered. At: " + x + ", " + y); break; case DragEvent.ACTION_DRAG_EXITED: Log.v(dotTAG, "drag exited. At: " + x + ", " + y); break; case DragEvent.ACTION_DROP: Log.v(dotTAG, "drag dropped. At: " + x + ", " + y); result = false; break; case DragEvent.ACTION_DRAG_ENDED: Log.v(dotTAG, "drag ended. Success? " + event.getResult()); inDrag = false; break; default: Log.v(dotTAG, "some other drag action: " + action); result = false; break; } return result; } public void draw(Canvas canvas) { float cx = this.getWidth()/2 + getLeftPaddingOffset(); float cy = this.getHeight()/2 + getTopPaddingOffset(); Paint paint = mNormalPaint; if(inDrag) paint = mDraggingPaint; canvas.drawCircle(cx, cy, mRadius, paint); invalidate(); } Lập trình Android – http://laptrinhdidong.vn Page 5 Trung tâm Tin học – ĐH KHTN } + Palette.java : package com.dac.drag.drop.demo; import android.app.Fragment; import android.os.Bundle; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; public class Palette extends Fragment { @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle icicle) { View v = inflater.inflate(R.layout.palette, container, false); return v; } } + DropZone.java : package com.dac.drag.drop.demo; import android.animation.ObjectAnimator; import android.app.Fragment; import android.content.ClipData; import android.os.Bundle; import android.util.Log; import android.view.DragEvent; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import android.view.animation.CycleInterpolator; import android.widget.TextView; public class DropZone extends Fragment { private View dropTarget; Lập trình Android – http://laptrinhdidong.vn Page 6 Trung tâm Tin học – ĐH KHTN private TextView dropMessage; @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle icicle) { View v = inflater.inflate(R.layout.dropzone, container, false); dropMessage = (TextView)v.findViewById(R.id.dropmessage); dropTarget = (View)v.findViewById(R.id.droptarget); dropTarget.setOnDragListener(new View.OnDragListener() { private static final String DROPTAG = "DropTarget"; private int dropCount = 0; private ObjectAnimator anim; public boolean onDrag(View v, DragEvent event) { int action = event.getAction(); boolean result = true; switch(action) { case DragEvent.ACTION_DRAG_STARTED: Log.v(DROPTAG, "drag started in dropTarget"); break; case DragEvent.ACTION_DRAG_ENTERED: Log.v(DROPTAG, "drag entered dropTarget"); anim = ObjectAnimator.ofFloat((Object)v, "alpha", 1f, 0.5f); anim.setInterpolator(new CycleInterpolator(40)); anim.setDuration(30*1000); // 30 seconds anim.start(); break; case DragEvent.ACTION_DRAG_EXITED: Log.v(DROPTAG, "drag exited dropTarget"); if(anim != null) { anim.end(); anim = null; } break; case DragEvent.ACTION_DRAG_LOCATION: Log.v(DROPTAG, "drag proceeding in dropTarget: " + event.getX() + ", " + event.getY()); break; case DragEvent.ACTION_DROP: Log.v(DROPTAG, "drag drop in dropTarget"); if(anim != null) { anim.end(); anim = null; } ClipData data = event.getClipData(); Log.v(DROPTAG, "Item data is " + data.getItemAt(0).getText()); Lập trình Android – http://laptrinhdidong.vn Page 7 Trung tâm Tin học – ĐH KHTN dropCount++; String message = dropCount + " drop"; if(dropCount > 1) message += "s"; dropMessage.setText(message); break; case DragEvent.ACTION_DRAG_ENDED: Log.v(DROPTAG, "drag ended in dropTarget"); if(anim != null) { anim.end(); anim = null; } break; default: Log.v(DROPTAG, "other action in dropzone: " + action); result = false; } return result; } }); return v; } } + MainActivity.java : package com.dac.drag.drop.demo; import android.app.Activity; import android.os.Bundle; public class MainActivity extends Activity { @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); } } Khi debug, ngoài việc các bạn kéo thả các nút vào ô vuông thì bạn còn có thể xem hoạt động đồng thời của việc drop, drap thông qua View Debug: Lập trình Android – http://laptrinhdidong.vn Page 8 Trung tâm Tin học – ĐH KHTN Mọi ý kiến đóng góp các bạn vui lòng gữi bài viết về forum: http://forum.laptrinhdidong.vn . Rất mong nhận được sự phản hồi từ các bạn Lập trình Android – http://laptrinhdidong.vn Page 9 . – ĐH KHTN Drag và Drop trên Android 3. 0 Một trong những cải tiến của Android 3. 0 so với các đời Android trước là hỗ trợ trực tiếp cho lập trình viên về việc lập trình xử lý Drag, Drop. Trong. android: layout_gravity="center_vertical" android: background=" #00 ff 00& quot; /> <TextView android: id="@+id/dropmessage" android: text=" ;0 drops" android: layout_width="wrap_content" android: layout_height="wrap_content" . ObjectAnimator.ofFloat((Object)v, "alpha", 1f, 0. 5f); anim.setInterpolator(new CycleInterpolator( 40) ); anim.setDuration ( 30 * 100 0); // 30 seconds anim.start(); break; case DragEvent.ACTION_DRAG_EXITED: Log.v(DROPTAG,