-->



5/recent-posts/slider2

404

We Are Sorry, Page Not Found

Apologies, but the page you requested could not be found.

Home Page

Tutorial Android Drag dan Drop

By : On
Android drag / drop memungkinkan pengguna untuk memindahkan data dari satu View ke yang lain dalam layout saat menggunakan graphical drag dan drop gesture. berikut tiga komponen penting untuk mendukung drag & drop :
  • Drag event class:
  • Drag listeners:
  • Helper methods and classes:

Drag/Drop Proses

Pada dasarnya ada empat langkah dalam proses drag dan drop:

Mulai - Peristiwa ini terjadi ketika Anda mulai menyeret item dalam layout, aplikasi Anda startDrag () metode untuk memberitahu sistem untuk memulai menarik. Argumen dalam metode startDrag () memberikan data yang akan diseret, metadata untuk data ini, dan callback untuk bayangannya.
Sistem yang pertama merespon dengan memanggil kembali ke aplikasi Anda untuk mendapatkan bayangannya. kemudian menampilkan bayangannya pada perangkat.
Selanjutnya, sistem akan mengirimkan drag dengan ACTION_DRAG_STARTED ke semua objek dalam layout.
Untuk terus menerima peristiwa drag, termasuk drop, drag event listener harus benar.
Melanjutkan - Sistem mengirimkan tindakan ACTION_DRAG_ENTERED diikuti dengan tindakan ACTION_DRAG_LOCATION ke daftar drag event listner.
Menjatuhkan - Pengguna melepaskan item diseret dalam kotak ke View. sistem mengirimkan View objek dengan jenis tindakan ACTION_DROP.
Akhir - setelah ACTION_DROP, sistem mengirimkan dengan jenis tindakan ACTION_DRAG_ENDED untuk menunjukkan bahwa operasi drag berakhir.

DragEvent Class

DragEvent merupakan yang dikirimkan oleh sistem pada berbagai waktu selama drag dan drop operasi. Class ini menyediakan beberapa Konstanta dan metode penting yang kita gunakan selama proses Drag / Drop.

Constants


Berikut ini adalah semua konstanta integer sebagai bagian dari class DragEvent.

  • ACTION_DRAG_STARTED : awal dari sebuah drag dan drop operasi.
  • ACTION_DRAG_ENTERED : ke View bahwa titik tarik telah memasuki kotak berlari dari View.
  • ACTION_DRAG_LOCATION : Dikirim ke View setelah ACTION_DRAG_ENTERED bayangan dalam kotak berlari View objek.
  • ACTION_DRAG_EXITED : telah pindah bahwa bayangan luar kotak berlari dari View.
  • ACTION_DROP : View telah merilis drag bayangan, dan titik drag dalam kotak berlari dari View.
  • ACTION_DRAG_ENDED : bahwa drag dan drop operasi telah selesai.


Methods


Berikut ini adalah beberapa metode penting dan paling sering digunakan sebagai bagian dari kelas DragEvent.

  • int getAction() : Periksa nilai aksi event.
  • ClipData getClipData() : Mengembalikan objek ClipData dikirim ke sistem sebagai bagian dari panggilan untuk startDrag ().
  • ClipDescription getClipDescription () : Mengembalikan objek ClipDescription dalam ClipData.
  • boolean getResult () : Mengembalikan indikasi hasil drag dan drop operasi.
  • float getX() : Mendapatkan koordinat X dari titik drag.
  • float getY() : Mendapat Y koordinat titik drag.
  • String toString() : Mengembalikan representasi string dari objek DragEvent.


Memulai Drag Event


Anda mulai dengan ClipData dan ClipData.Item untuk data yang dipindahkan. Sebagai bagian dari objek ClipData, metadata pasokan yang disimpan dalam sebuah objek ClipDescription dalam ClipData. Untuk drag dan drop operasi yang tidak mewakili gerakan data.

Berikutnya Anda dapat memperpanjang View.DragShadowBuilder untuk membuat bayangan untuk menyeret pandangan atau Anda hanya menggunakan View.DragShadowBuilder (view) untuk membuat bayangan bawaan ukuran yang sama dengan View argumen.

 Berikut contoh menunjukkan fungsi dari Drag & Drop sederhana menggunakan View.setOnLongClickListener (),View.setOnTouchListener () dan View.OnDragEventListener ().

 1. Anda akan menggunakan Android studio IDE untuk membuat aplikasi Android dan kita beri nama sebagai DragAndDrop lihat gambar dibawah:

Next -> 


Next -> 


Next -> 


Finish

2. Memodifikasi src file/MainActivity.java dan menambahkan kode untuk mendefinisikan event listeners.

 3. Copy gambar di res/drawable- * folder.

 4. Memodifikasi layout file XML res / layout / activity_main.xml untuk menentukan tampilan.

 5. Jalankan aplikasi untuk memulai emulator Android dan memverifikasi hasil dari aplikasi.

 Berikut ini adalah isi dari src / MainActivity.java.

 MainActivity.java
package draganddrop.megadistudio.com.draganddrop;

import android.app.Activity;
import android.content.ClipData;
import android.content.ClipDescription;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Point;
import android.graphics.drawable.ColorDrawable;
import android.graphics.drawable.Drawable;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.util.Log;
import android.view.DragEvent;
import android.view.View;
import android.widget.ImageView;
import android.widget.RelativeLayout;
import android.widget.TextView;
import android.widget.Toast;


public class MainActivity extends AppCompatActivity {

    private Context mContext;
    private Activity mActivity;

    private RelativeLayout mRelativeLayout;
    private TextView mTextView;

    private ImageView mImageViewRed;
    private ImageView mImageViewOlive;
    private ImageView mImageViewIndigo;
    private ImageView mImageViewflower;

    private MyDragEventListener mDragListener;


    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        mContext = getApplicationContext();

        mActivity = MainActivity.this;

        mDragListener = new MyDragEventListener();

        mRelativeLayout = (RelativeLayout) findViewById(R.id.rl);
        mTextView = (TextView) findViewById(R.id.tv);

        mImageViewRed = (ImageView) findViewById(R.id.iv_red);
        mImageViewOlive = (ImageView) findViewById(R.id.iv_olive);
        mImageViewIndigo = (ImageView) findViewById(R.id.iv_indigo);
        mImageViewflower = (ImageView) findViewById(R.id.sn_flwer);

        mTextView.setOnDragListener(mDragListener);

        mImageViewRed.setOnLongClickListener(new MyLongClickListener());
        mImageViewOlive.setOnLongClickListener(new MyLongClickListener());
        mImageViewIndigo.setOnLongClickListener(new MyLongClickListener());
        mImageViewflower.setOnLongClickListener(new MyLongClickListener());
    }


    private static class MyLongClickListener implements View.OnLongClickListener{
        @Override
        public boolean onLongClick(View view) {

            int color = ((ColorDrawable)view.getBackground()).getColor();
            String colorString = String.valueOf(color);

            ClipData.Item item = new ClipData.Item(colorString);

            ClipData dragData = new ClipData(
                    colorString,
                    new String[] {ClipDescription.MIMETYPE_TEXT_PLAIN},item
            );

            View.DragShadowBuilder myShadow = new MyDragShadowBuilder(view);

            view.startDrag(
                    dragData,
                    myShadow,
                    null,
                    0
            );
            return false;
        }

    }


    private static class MyDragShadowBuilder extends View.DragShadowBuilder{
        private static Drawable shadow;

        public MyDragShadowBuilder(View v){
            super(v);

            int color = ((ColorDrawable)v.getBackground()).getColor();

            shadow = new ColorDrawable(getDarkerColor(color));
        }

        @Override
        public void onProvideShadowMetrics(Point size, Point touch){

            int width, height;

            width = getView().getWidth()/2;

            height = getView().getHeight()/2;

            shadow.setBounds(0,0,width,height);

            size.set(width, height);

            touch.set(width/2,height/2);
        }

        @Override
        public void onDrawShadow(Canvas canvas){

            shadow.draw(canvas);
        }
    }


    protected class MyDragEventListener implements View.OnDragListener{

        public boolean onDrag(View view, DragEvent event){

            final int action = event.getAction();

            switch(action){
                case DragEvent.ACTION_DRAG_STARTED:

                    if(event.getClipDescription().hasMimeType(ClipDescription.MIMETYPE_TEXT_PLAIN)){

                        view.setBackgroundColor(Color.parseColor("#FFC4E4FF"));

                        return true;
                    }
                    return false;
                case DragEvent.ACTION_DRAG_ENTERED:

                    view.setBackgroundColor(Color.parseColor("#FFB7FFD6"));
                    return true;
                case DragEvent.ACTION_DRAG_LOCATION:

                    return true;
                case DragEvent.ACTION_DRAG_EXITED:

                    view.setBackgroundColor(Color.parseColor("#FFFFBCBC"));

                    return true;
                case DragEvent.ACTION_DROP:

                    ClipData.Item item = event.getClipData().getItemAt(0);
                    String dragData = (String) item.getText();

                    TextView v = (TextView) view;

                    v.setTextColor(Integer.parseInt(dragData));

                    return true;
                case DragEvent.ACTION_DRAG_ENDED:

                    view.setBackgroundColor(Color.TRANSPARENT);
                    if(event.getResult()){
                        Toast.makeText(mContext,"Drop berhasil",Toast.LENGTH_SHORT).show();
                    }else {
                        Toast.makeText(mContext,"Drop tidak berhasil",Toast.LENGTH_SHORT).show();
                    }

                    return true;
                default:
                    Log.e("Drag and Drop example","Unknown action type received.");
                    break;
            }

            return false;
        }
    }

    public static int getDarkerColor(int color){
        float[] hsv = new float[3];
        Color.colorToHSV(color, hsv);

        hsv[2] = 0.7f *hsv[2];
        return Color.HSVToColor(hsv);
    }
}

res/layout/activity_main.xml.

 activity_main.xml

<RelativeLayout 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/rl"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin"
    tools:context=".MainActivity">

    <ImageView
        android:id="@+id/iv_red"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:background="#ff0000"
        android:layout_margin="15dp"
        />
    <ImageView
        android:id="@+id/iv_olive"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:background="#808000"
        android:layout_toRightOf="@id/iv_red"
        android:layout_toEndOf="@id/iv_red"
        android:layout_margin="15dp"
        />

    <ImageView
        android:id="@+id/iv_indigo"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:background="#4B0082"
        android:layout_toRightOf="@id/iv_olive"
        android:layout_toEndOf="@id/iv_olive"
        android:layout_margin="15dp" />

    <ImageView
        android:id="@+id/sn_flwer"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:background="#f1c40f"
        android:layout_alignTop="@+id/iv_indigo"
        android:layout_toRightOf="@+id/iv_indigo"
        android:layout_toEndOf="@+id/iv_indigo"
        android:layout_marginLeft="15dp"
        android:layout_marginStart="15dp" />

    <TextView
        android:id="@+id/tv"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="70sp"
        android:textStyle="bold"
        android:fontFamily="sans-serif-condensed"
        android:text="@string/tk"
        android:layout_marginTop="137dp"
        android:layout_below="@+id/iv_red"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true" />
</RelativeLayout>

strings.xml 
<?xml version="1.0" encoding="utf-8"?>
<resources>
    <string name="app_name">Drag and Drop</string>
    <string name="tk">Tahu Koding</string>
</resources>

Dengan ini kita telah menyelesaikan aplikasi Drag and Drop. Untuk menjalankan aplikasi dari Android Studio, klik Run ikon pada toolbar. kemudian kita tinggal pilih gambar mana yang ingin kita drag. tekan dan tahan kemudian tarik pada teks dan lepaskan.











 [full-width]
Google+ Linked In Pin It
No comments:

Subscribe to: Post Comments (Atom)
All Rights Reserved by Tahu Koding © 2015 - 2016