Android - Creating Resizable View

Question

I am currently working on a Dashboard with movable and resizable views. The problem I have now is that I want to resize the view by touch gestures. Therefore, I thought of a Point which I add to a view on selection, which can be dragged to resize the selected view. This is similar to the resizing procedure on the Android Homescreen.

Even after a long research, I could not come up with a solution on how to overlay another view, which has its own DragListener. I could imagine putting the selected view and the point into one ViewGroup and having the Point overlay the View. Did someone have experience with this problem? Thank you in advance.

Weingarten

Did you find a solution? – Vela

Answer 1

Try following class.

package mayank.com.bhaktirasamritaswami.ui.components;
import android.content.Context;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.view.View;
import android.widget.RelativeLayout;
import mayank.com.bhaktirasamritaswami.R;
public class ResizableLayout extends RelativeLayout implements View.OnTouchListener{
public static int top_margine;
public ResizableLayout(Context context) {
    super(context);
    init();
}
public ResizableLayout(Context context, AttributeSet attrs) {
    super(context, attrs);
    init();
}

public void init(){
    addView(inflate(getContext(), R.layout.ui_component_resizable_layout,null));
    setOnTouchListener(this);
    dragHandle = this.findViewById(R.id.drag_handle);
}

private View dragHandle;
float downRawY;
float dY;
float height;

@Override
public boolean onTouch(View view, MotionEvent motionEvent) {
    int action = motionEvent.getAction();
    if(action == MotionEvent.ACTION_DOWN){
        downRawY = motionEvent.getRawY();
        height = this.getMeasuredHeight();
    } else {
        View parent = (View) this.getParent();
        if(downRawY<parent.getHeight() - height + 2*dragHandle.getHeight()) {
            float rawY = motionEvent.getRawY()>20*dragHandle.getHeight()?motionEvent.getRawY():20*dragHandle.getHeight();
            MarginLayoutParams p = (MarginLayoutParams) this.getLayoutParams();
            p.topMargin = (int)rawY;
            if(p.topMargin!=0)
                this.top_margine = p.topMargin;
            this.setLayoutParams(p);
        }
    }
    return false;
}
@Override
public boolean onInterceptTouchEvent(MotionEvent motionEvent){
    onTouch(this, motionEvent);
    return false;
}
}

I designed this class for vertical resizing only. You need to change onTouch method to suit your case.

Connieconniption

Too late to ask but can you add or give any idea about "ui_component_resizable_layout" ? – Lilithe

Answer 2

Change the onTouch() in Mayank's answer as follows

static final int TOP = 1, RIGHT = 2, BOTTOM = 3, LEFT = 4;
int handleMargin = 10, side = 0;
@Override
public boolean onTouch(View view, MotionEvent motionEvent) {
int action = motionEvent.getAction();
if(action == MotionEvent.ACTION_DOWN){
// detect if tap is on handles
    downRawY = motionEvent.getRawY();
    height = this.getMeasuredHeight();
} else {
// change layout margin inside switch
    switch(side){
        case: ....
    }
    View parent = (View) this.getParent();
    if(downRawY<parent.getHeight() - height + 2*dragHandle.getHeight()) {
        float rawY = motionEvent.getRawY()>20*dragHandle.getHeight()?motionEvent.getRawY():20*dragHandle.getHeight();
        MarginLayoutParams p = (MarginLayoutParams) this.getLayoutParams();
        p.topMargin = (int)rawY;
        if(p.topMargin!=0)
            this.top_margine = p.topMargin;
        this.setLayoutParams(p);
    }
}
return false;
}

Straw