How to create this kind of view in Android?

Question

I want to use this kind of UI in my Contact Android App. The picture shown resizes itself when we scroll down much and the Name 'XYZ' finally become the title of the action bar. Also how can I put textview over imageview?

Answer 1

What you're looking for is CollapsingToolbarLayout .

The general approach to this kind of animations is to use top level CoordinatorLayout which contain two children: the first child is the "collapsible" content, and the second is "body". The general hierarchy looks like this:

CoordinatorLayout
  |-AppBarLayout
    |-CollapsingToolbarLayout
      |-Toolbar
  |-ScrollView

The second child must not be ScrollView - use any ViewGroup that suits your needs, and just add the following attribute to its description in xml :

app:layout_behavior="@string/appbar_scrolling_view_behavior"

the above string resource should map to AppBarLayout.ScrollingViewBehavior (just use android.support.design.widget.AppBarLayout$ScrollingViewBehavior as this resource's value).

There is very good tutorial on this kind of animations on Codepath .