Resizing drop zone for bubble destroy

Question

So I am replicating a similar implementation like the one with the facebook chat bubble and successfully created the drop container for the bubble to be dropped. The functionality I am aiming to achieve is I should be able to drop a bubble in a deletion zone( which happens to be a circular image with a cross mark). When I drag the bubble inside the circular image I am hoping to resize the circular image and make it bigger. So when I leave the bubble inside the enlarged image it should disappear. I am not been able to resize this image when I hover my bubble over it. The functionality of deletion is in place.

I would like pointers on dynamic re sizing of circular drop zone image(expanding and contracting on basis of hovered or not hovered)

Any pointers are welcome. Thanks in advance.

Images below for understanding.

Quinine

can you post relevant codes and xml? – Synergist

Is there something you aren't getting from #15976488 – Execrative

Are you having any call back system to know whether the bubble is placed inside the deletion zone? – Hawkeyed

@Dinash: Hi. Yes I know when the bubble is in the deletion zone. i just want to resize the deletion zone once the bubble is inside – Photolysis

Answer 1

Simply modified the drag and drop sample available here to have your intended behavior. Hope this helps.

public class MyNewActivity extends Activity {
ImageView img;
String msg;
private android.widget.RelativeLayout.LayoutParams layoutParams;
private View target;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.my_drag_drop);
    img=(ImageView)findViewById(R.id.imageView);
    target=findViewById(R.id.target);

    img.setOnLongClickListener(new View.OnLongClickListener() {
        @Override
        public boolean onLongClick(View v) {
            ClipData.Item item = new ClipData.Item((CharSequence)v.getTag());
            String[] mimeTypes = {ClipDescription.MIMETYPE_TEXT_PLAIN};

            ClipData dragData = new ClipData(v.getTag().toString(),mimeTypes, item);
            View.DragShadowBuilder myShadow = new View.DragShadowBuilder(img);

            v.startDrag(dragData,myShadow,null,0);
            return true;
        }
    });

    img.setOnDragListener(onDragListener1);
    target.setOnDragListener(onDragListener1);

    img.setOnTouchListener(new View.OnTouchListener() {
        @Override
        public boolean onTouch(View v, MotionEvent event) {
            if (event.getAction() == MotionEvent.ACTION_DOWN) {
                ClipData data = ClipData.newPlainText("", "");
                View.DragShadowBuilder shadowBuilder = new View.DragShadowBuilder(img);

                img.startDrag(data, shadowBuilder, img, 0);
                img.setVisibility(View.INVISIBLE);
                return true;
            }
            else
            {
                return false;
            }
        }
    });
}

private boolean isViewScalled=false;

View.OnDragListener onDragListener1=new View.OnDragListener() {
    @Override
    public boolean onDrag(View v, DragEvent event) {
        switch(event.getAction())
        {
            case DragEvent.ACTION_DRAG_STARTED:
                Log.d(msg, "Action is DragEvent.ACTION_DRAG_STARTED");

                // Do nothing
                break;

            case DragEvent.ACTION_DRAG_ENTERED:
                Log.d(msg, "Action is DragEvent.ACTION_DRAG_ENTERED");
                if(!isViewScalled) {
                    target.animate().scaleXBy(.5f).scaleYBy(.5f).start();
                    isViewScalled=true;
                }
                break;

            case DragEvent.ACTION_DRAG_EXITED :
                Log.d(msg, "Action is DragEvent.ACTION_DRAG_EXITED");
                if(isViewScalled) {
                    target.animate().scaleXBy(-.5f).scaleYBy(-.5f).start();
                    isViewScalled=false;
                }
                break;

            case DragEvent.ACTION_DRAG_LOCATION  :
                Log.d(msg, "Action is DragEvent.ACTION_DRAG_LOCATION");
                break;

            case DragEvent.ACTION_DRAG_ENDED   :
                Log.d(msg, "Action is DragEvent.ACTION_DRAG_ENDED");

                // Do something
                break;

            case DragEvent.ACTION_DROP:
                Log.d(msg, "ACTION_DROP event");
                break;
            default: break;
        }
        return true;
    }
};

}

And Layout

<?xml version="1.0" encoding="utf-8"?>

<ImageView
    android:layout_width="75dp"
    android:layout_height="75dp"
    android:id="@+id/imageView" android:scaleType="fitXY"
    android:src="@drawable/abc_btn_radio_material" />


<ImageView
    android:layout_width="125dp"
    android:layout_height="125dp"  android:scaleType="fitXY"
    android:id="@+id/target" android:layout_centerHorizontal="true"
    android:src="@drawable/abc_btn_radio_material" android:layout_alignParentBottom="true" />

Hawkeyed

Answer 2

Can you detect the hover event?
Please try this.

onHover

versionNameTextView.setScaleX(1f);
versionNameTextView.setScaleY(1f);
circlerImageView.animate().scaleX(1.5f).scaleY(1.5f).setDuration(500).start();

onHoverEnd

versionNameTextView.setScaleX(1.5f);
versionNameTextView.setScaleY(1.5f);
circlerImageView.animate().scaleX(1f).scaleY(1f).setDuration(500).start();

Satchel