Parallax эффект с рушится панель не работает, изображение в заголовке сплющенные

Question

В статье блога блоге Design Support Library: Collapsing Toolbar Layout есть заголовок изображения с хорошим эффектом параллакса:

В a simple test project at GitHub я пытаюсь добиться подобного эффекта - но по какой-то причине изображение сплющенные:

В activity_main.xml я перепробовал все возможные значения scaleType но изображение остается искаженным:

 <ImageView 
      android:id="@+id/header_image_view" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:background="@drawable/header" 
      android:scaleType="centerCrop" 
      app:layout_collapseMode="parallax" /> 

Что я здесь отсутствует, пожалуйста?

UPDATE:

Я попытался изменить к match_parent как предполагает Apurva (спасибо +1):

 <ImageView 
      android:id="@+id/header_image_view" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:background="@drawable/header2" 
      android:scaleType="centerCrop" 
      app:layout_collapseMode="parallax" /> 

Но это не помогает - изображение заголовка сплющенные:

Answer 1

По умолчанию фон будет растягиваться, чтобы соответствовать. Вы должны установить android:src, а не android:background на ImageView.

<ImageView 
    android:id="@+id/header_image_view" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:src="@drawable/header2" 
    android:scaleType="centerCrop" 
    app:layout_collapseMode="parallax" /> 

Answer 2

Вы упомянули, что в учебнике автор использует SquareImageView?

Он перекрытая onMeasure метод:

@Override 
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { 
    super.onMeasure(widthMeasureSpec, heightMeasureSpec); 

    int width = getMeasuredWidth(); 
    setMeasuredDimension(width, width); 
} 

Класс реализован here