1

I have a LinearLayout that contains a couple of views. It doesn't have to be LinearLayout-based - this is negotiable - but it provides this simple example.

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

<LinearLayout
    android:id="@+id/left"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_weight="1"
    android:background="#f00"
    android:orientation="horizontal"/>

<LinearLayout
    android:id="@+id/right"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_weight="1"
    android:background="#ff0"
    android:orientation="horizontal"/>

</LinearLayout>

This is rendered as follows:

split-screen layout

What I want to do is produce an animation sequence that slides out the yellow view, off the right of the screen, whilst simultaneously enlarging the red view to fill the space left behind.

It strikes me that there are a few ways to do this:

Weight-Based Animation

I can change the layout weight - specifically, iteratively reduce the yellow view's weight to zero. This will do the job as far as the red view is concerned. However if the yellow view has content in it, it will be squashed as it resizes down. It also doesn't run very smoothly.

This is almost acceptable in some contexts, because I can fade out the yellow view and its content to an alpha of zero, and then clear the empty space. Still not that smooth, but no squashing. However when I need the content to stay visible while moving, it ceases to be appropriate anyway.

Translation Animation

I can slide out the yellow view, a bit like this. However the vacated space is left behind, as you might expect. It does run perfectly smoothly.

A combination of the above?

I haven't tried this yet. I guess I could slide out the view whilst simultaneously reducing the weight of the empty space. I don't know if this is actually feasible, i.e. whether the weight change would affect the animated slide, or whether the two can be coherently run at once, or whether it will operate smoothly anyway.

Or, of course, something entirely different.

Any suggestions please?

Community
  • 1
  • 1
Rob Pridham
  • 4,780
  • 1
  • 26
  • 38
  • You could try a ScaleAnimation of the red layout and scale it to the size of the parent layout. That could make it look like the red layout is pushing away the yellow layout – A Honey Bustard Aug 24 '16 at 17:00
  • I did try this today but scale transforms stretch the content of the red layout, which is OK if empty but not when it contains text etc. I do have a potential answer to my own question but it needs some tidying up first. – Rob Pridham Aug 24 '16 at 17:03

0 Answers0