4

I have been working on an application similar to Pic Frame, Insta collage Some how I have succeeded to perform this task and created code to make frames like this i have used a Multitouch view class which is

MultiTouchview class

import java.util.ArrayList;

import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Canvas;
import android.graphics.Color;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.view.View;


/**
 * Canvas View for the MultiTouch controller
 * @author 2dwarfs.com
 *
 */

public class MultiTouchView extends View implements MultiTouchObjectCanvas<PinchWidget> {

    private static final int UI_MODE_ROTATE = 1;
    private static final int UI_MODE_ANISOTROPIC_SCALE = 2;
    private int mUIMode = UI_MODE_ROTATE;
    ArrayList<PinchWidget> alist = new ArrayList<PinchWidget>();

    private MultiTouchController<PinchWidget> mMultiTouchController = new MultiTouchController<PinchWidget>(this);

    private int mWidth, mHeight;

    private PinchWidget mPinchWidget;
    private Context mContext;

    public MultiTouchView(Context context) {
        super(context);
        //mContext = context;
    }

    public void clearCache(){
        alist.clear();
    }

    public MultiTouchView(Context context, AttributeSet attrs) {
        super(context, attrs);
        mContext = context;
    }

    public MultiTouchView(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
    }

    public void setPinchWidget(Bitmap bitmap) {
        mPinchWidget = new PinchWidget(bitmap);
         alist.add(mPinchWidget);
        mPinchWidget.init(mContext.getResources());
        invalidate();
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        mWidth = resolveSize(getSuggestedMinimumWidth(), widthMeasureSpec);
        mHeight = resolveSize(getSuggestedMinimumHeight(), heightMeasureSpec);
        setMeasuredDimension(mWidth, mHeight);
    }

    @Override
    public void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        canvas.drawColor(Color.TRANSPARENT);
        for(PinchWidget mmPinchWidget : alist )
           mmPinchWidget.draw(canvas);

    }

    @Override
    public boolean onTouchEvent(MotionEvent ev) {
        return mMultiTouchController.onTouchEvent(ev);
    }

    @Override
    public PinchWidget getDraggableObjectAtPoint(PointInfo pt) {
        float x = pt.getX(), y = pt.getY();
        for(PinchWidget mPinchWidget : alist) {
        if (mPinchWidget.containsPoint(x, y)) {
            return mPinchWidget;
        }
        }

        return null;
    }

    @Override
    public void getPositionAndScale(PinchWidget pinchWidget, PositionAndScale objPosAndScaleOut) {
        objPosAndScaleOut.set(pinchWidget.getCenterX(), pinchWidget.getCenterY(), 
                (mUIMode & UI_MODE_ANISOTROPIC_SCALE) == 0,
                (pinchWidget.getScaleFactor() + pinchWidget.getScaleFactor()) / 2, 
                (mUIMode & UI_MODE_ANISOTROPIC_SCALE) != 0, 
                pinchWidget.getScaleFactor(), 
                pinchWidget.getScaleFactor(),
                (mUIMode & UI_MODE_ROTATE) != 0, 
                pinchWidget.getAngle());
    }

    @Override
    public boolean setPositionAndScale(PinchWidget pinchWidget, PositionAndScale newImgPosAndScale, PointInfo touchPoint) {
        boolean ok = pinchWidget.setPos(newImgPosAndScale, mUIMode, UI_MODE_ANISOTROPIC_SCALE, touchPoint.isMultiTouch());
        if(ok) {
            invalidate();
        }

        return ok;
    }

    @Override
    public void selectObject(PinchWidget pinchWidget, PointInfo touchPoint) {
        if(touchPoint.isDown()) {
            mPinchWidget = pinchWidget;
        }

        invalidate();
    }
}

And Used this frames in XMl file like

Two.xml for two frames

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="@color/transparent"
    android:orientation="horizontal" >

    <com.example.imageframe.MultiTouchView
        android:orientation="horizontal"
        android:id="@+id/firstone"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_marginBottom="5.0dip"
        android:layout_marginLeft="5.0dip"
        android:layout_marginRight="5.0dip"
        android:layout_marginTop="5.0dip"
        android:layout_weight="0.5"
        android:background="@drawable/back" />

    <com.example.imageframe.MultiTouchView
        android:orientation="horizontal"
        android:id="@+id/secondone"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_marginBottom="5.0dip"
        android:layout_marginRight="5.0dip"
        android:layout_marginTop="5.0dip"
        android:layout_weight="0.5"
        android:background="@drawable/back" />

</LinearLayout>

But While coding I thought its a very complex way to create and use frames like this. Also these frames are specially square/rectangle in shape I cannot make curvy edged frames or change the frame shape (making frame partition big/small or change the shape of frame) dynamically.

I have searched every thing to find a proper solution to achieve this solution but not succeeded.

Please guide me as soon as possible to create/manipulate/edit frames dynamically or provide me some code snippet to achieve this kind of functionality.

Abhinav Singh Maurya
  • 3,313
  • 8
  • 33
  • 51

1 Answers1

0

you can use fragment. design your layouts separately. for example fragmentNumberOne.xml and fragmentNumberTwo.xml

put a FrameLayout in your xml of main activity;

<FrameLayout
    android:id="@+id/content_frame"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

in your activity;

Fragment fragment = new YourFragment();
Bundle args = new Bundle();
args.putInt("fragmentLayout", R.layout.fragmentNumberOne);
fragment.setArguments(args);

FragmentManager fragmentManager = getSupportFragmentManager();
fragmentManager.beginTransaction()
        .replace(R.id.content_frame, fragment).commit();

and create a class like;

public class YourFragment extends Fragment {

public YourFragment() {
}

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
        Bundle savedInstanceState) {
    int fragmentLayout = getArguments().getInt("fragmentLayout");
    final View rootView = inflater
            .inflate(fragmentLayout, container, false);

    if (fragmentLayout == R.layout.fragmentNumberOne) {
        ...
        write your code here
        ...
    } else if (fragmentLayout == R.layout.fragmentNumberTwo) {
        ...
        write your code here
        ...
    }

    return rootView;
}
iamkaan
  • 1,495
  • 2
  • 23
  • 43