Changing EditText height and width on Runtime with some animation

Question

I have Four EditText with different background. It looks like this:

I want to cover full screen when a EditText is selected with That EditText. For that I need to change the EditText width and height with some animation on Runtime.

When selected It should look like this:

How can I change EditText size with animation on Runtime ?

Answer 1

I'm not sure if it can be done with Animations. In android view takes all space before animation finished, so you will see that other editTexts disappears and selected one slowly increasing. Here is rough example how to do it without standart animations, but changing weights in separate thread:

layout:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >

<LinearLayout
    android:id="@+id/ll0"
    android:layout_width="fill_parent"
    android:layout_height="0dp"
    android:layout_weight="1"
    android:orientation="horizontal" >

    <EditText
        android:id="@+id/et00"
        android:layout_width="0dp"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:gravity="top|left"
        android:text="00" />

    <EditText
        android:id="@+id/et01"
        android:layout_width="0dp"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:gravity="top|left"
        android:text="01" />
</LinearLayout>

<LinearLayout
    android:id="@+id/ll1"
    android:layout_width="fill_parent"
    android:layout_height="0dp"
    android:layout_weight="1"
    android:orientation="horizontal" >

    <EditText
        android:id="@+id/et10"
        android:layout_width="0dp"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:gravity="top|left"
        android:text="10" />

    <EditText
        android:id="@+id/et11"
        android:layout_width="0dp"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:gravity="top|left"
        android:text="11" />
</LinearLayout>
</LinearLayout>

and in code add actions on changing focus:

@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);

    OnFocusChangeListener focusListener = new OnFocusChangeListener() {
        @Override
        public void onFocusChange(View v, boolean hasFocus) {
            if (hasFocus) {
                LinearLayout parent = (LinearLayout) v.getParent();
                EditText forDecresing = null;
                for (int i = 0; i < parent.getChildCount(); i++) {
                    if (parent.getChildAt(i) != v) {
                        forDecresing = (EditText) parent.getChildAt(i);
                        break;
                    }
                }
                LinearLayout pp = (LinearLayout) parent.getParent();
                LinearLayout layoutForDecreasing = null;
                for (int i = 0; i < pp.getChildCount(); i++) {
                    if (pp.getChildAt(i) != parent && pp.getChildAt(i) instanceof LinearLayout) {
                        layoutForDecreasing = (LinearLayout) pp.getChildAt(i);
                        break;
                    }
                }
                startAnimation((EditText) v, forDecresing, layoutForDecreasing, parent);
            } else {
            }
        }
    };

    ((EditText) findViewById(R.id.et00)).setOnFocusChangeListener(focusListener);
    ((EditText) findViewById(R.id.et01)).setOnFocusChangeListener(focusListener);
    ((EditText) findViewById(R.id.et11)).setOnFocusChangeListener(focusListener);
    ((EditText) findViewById(R.id.et10)).setOnFocusChangeListener(focusListener);
}

public void onBackPressed() {
    setWeight(findViewById(R.id.et00), 1);
    setWeight(findViewById(R.id.et01), 1);
    setWeight(findViewById(R.id.et11), 1);
    setWeight(findViewById(R.id.et10), 1);
    setWeight(findViewById(R.id.ll1), 1);
    setWeight(findViewById(R.id.ll0), 1);
}

Thread animationThread;

private void startAnimation(final EditText forIncreasing, final EditText forDecresing, final LinearLayout layoutForDecreasing,
        final LinearLayout layoutForIncreasing) {
    if (animationThread != null)
        animationThread.interrupt();
    animationThread = new Thread(new Runnable() {
        @Override
        public void run() {
            int iterations = 0;
            int maxIterations = 30;
            setWeight(forIncreasing, maxIterations - 1);
            setWeight(layoutForIncreasing, maxIterations - 1);
            setWeight(forDecresing, maxIterations - 1);
            setWeight(layoutForDecreasing, maxIterations - 1);
            while (iterations < maxIterations) {
                iterations++;
                setWeight(forIncreasing, maxIterations - 1 + iterations);
                setWeight(layoutForIncreasing, maxIterations - 1 + iterations);
                setWeight(forDecresing, maxIterations - 1 - iterations);
                setWeight(layoutForDecreasing, maxIterations - 1 - iterations);
                try {
                    Thread.sleep(10);
                } catch (InterruptedException e) {
                    return;
                }
            }
            animationThread = null;
        }
    });
    animationThread.start();
}

private void setWeight(final View view, final float weight) {
    runOnUiThread(new Runnable() {
        @Override
        public void run() {
            LayoutParams params = (LayoutParams) view.getLayoutParams();
            params.weight = weight;
            view.setLayoutParams(params);
        }
    });
}

I do not know if this is possible for you, but in this example you can add some more movements quite easy.

I do not recommend use it production, if only you have some other options.