CollapsingToolbarLayout Bild mit Zoom

Question

Ich habe den ganzen Tag ohne Erfolg auf diesem gelesen.

Grundsätzlich möchten Sie in der Lage sein, ein ImageView in einem android.support.design.widget.CollapsingToolbarLayout zu setzen, um seine Höhe zu ändern, abhängig von der erkannten onOffsetChanged-Änderung, so dass es verkleinert wird, wenn es dem gesamten Bild entspricht width und "zoom-in", wenn das normale centerCrop-Verhalten erweitert wird.

Ich habe versucht, die ImageView Höhe in der OnOffsetChanged, aber das verursacht andere Probleme angenommen, aufgrund der CollapsingToolbarLayout wird auch neu positioniert.

Beispielfunktion, die ich in ParallaxListView Projekt gesehen habe, aber die CollapsingToolbarLayout verwenden möchte.

Kann jemand Beispielcode geben (wenn es möglich ist)?

Auch this project aber wieder ähnliche Einschränkung gesehen. Andere Projekte auch.

Answer 1

können Sie versuchen, android:scaleType="matrix" für das Kollabieren Bild der Layout-Definition verwendet wird.

Im Code speichert die anfänglichen ImageMatrix in einem Matrixmatrix.set(imageView.getImageMatrix());

mit und in Abhängigkeit von der Rolle der Symbolleiste kollabiert, können Sie matrix.postScale(), um das Bild zu skalieren und setzten es schließlich auf das Image zurück imageView.setImageMatrix(matrix) verwenden. Das kann Ihnen den Zoom-In/Out-Effekt geben.

Answer 2

Ich schaffte es am Ende mit dem folgenden Code für jeden anderen da draußen, dass es helfen kann. Der Code passt zur Breite, wenn er maximiert wird und passt zur Höhe, wenn er zusammengeklappt wird. Es kann geändert werden, um bei Bedarf weiter zu skalieren (Zoom).

Nicht sicher, ob optimaler Code geschrieben wird, Vorschläge willkommen. Um die Bitmap und die Ansicht zu messen und die Min/Max-Skala zu berechnen, verwende ich den ersten Aufruf von OnOffsetChanged, der gut zu funktionieren scheint.

public class MyActivity erweitert AppCompatActivity implementiert AppBarLayout.OnOffsetChangedListener {

private float collapsedScale; 
private float expandedScale; 


@Override 
protected void onCreate(Bundle savedInstanceState) { 
    super.onCreate(savedInstanceState); 

    setContentView(R.layout.my_activity_layout); 

    Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar); 
    setSupportActionBar(toolbar); 

    getSupportActionBar().setDisplayHomeAsUpEnabled(true); 

    setTitle(entry.label); 

    photoView = (ImageView) findViewById(R.id.photo_image); 

    AppBarLayout mAppBarLayout = (AppBarLayout) findViewById(R.id.appbar); 
    mAppBarLayout.addOnOffsetChangedListener(this); 

} 

@Override 
public void onOffsetChanged(AppBarLayout appBarLayout, int verticalOffset) { 

    int maxScroll = appBarLayout.getTotalScrollRange(); 

    float scrollPercent = (float) Math.abs(verticalOffset)/(float) maxScroll; 

    if (collapsedScale == 0) { 

     Drawable photo = photoView.getDrawable(); 

     int bitmapWidth = photo.getIntrinsicWidth(); 
     int bitmapHeight = photo.getIntrinsicHeight(); 

     collapsedScale = (float)photoView.getWidth()/(float)bitmapWidth; 
     expandedScale = (float)photoView.getHeight()/(float)bitmapHeight; 

     scalePhotoImage(photoView, expandedScale); 

    } else { 

     scalePhotoImage(photoView, collapsedScale + (expandedScale - collapsedScale) * (1f - scrollPercent)); 
    } 
} 

private static void scalePhotoImage(ImageView photoView, float scale) { 

    Drawable photo = photoView.getDrawable(); 

    int bitmapWidth = photo.getIntrinsicWidth(); 
    int bitmapHeight = photo.getIntrinsicHeight(); 

    float offsetX = (photoView.getWidth() - bitmapWidth)/2F; 
    float offsetY = (photoView.getHeight() - bitmapHeight)/2F; 

    float centerX = photoView.getWidth()/2F; 
    float centerY = photoView.getHeight()/2F; 

    Matrix imageMatrix = new Matrix(); 
    imageMatrix.setScale(scale, scale, centerX, centerY); 
    imageMatrix.preTranslate(offsetX, offsetY); 

    photoView.setImageMatrix(imageMatrix); 
} 
} 

Mein Layout

<android.support.design.widget.AppBarLayout 
    android:id="@+id/appbar" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:fitsSystemWindows="true" 
    app:elevation="6dp" 
    android:theme="@style/AppTheme.AppBarOverlay"> 

    <android.support.design.widget.CollapsingToolbarLayout 
     android:id="@+id/collapsing_toolbar" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     app:layout_scrollFlags="scroll|exitUntilCollapsed|snap" 
     app:contentScrim="@android:color/transparent"> 

     <ImageView 
      android:id="@+id/photo_image" 
      android:layout_width="match_parent" 
      android:layout_height="300dp" 
      android:src="@drawable/demo_photo" 
      android:fitsSystemWindows="true" 
      android:scaleType="matrix" 
      app:layout_collapseMode="parallax"/> 

     <android.support.v7.widget.Toolbar 
      android:id="@+id/toolbar" 
      android:layout_width="match_parent" 
      android:layout_height="100dp" 
      android:theme = "@style/ToolBarStyle" 
      app:layout_collapseMode="pin"> 

     </android.support.v7.widget.Toolbar> 

    </android.support.design.widget.CollapsingToolbarLayout> 

</android.support.design.widget.AppBarLayout> 

<android.support.v4.widget.NestedScrollView xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    app:layout_behavior="@string/appbar_scrolling_view_behavior"> 

    <include layout="@layout/content_layout" /> 

</android.support.v4.widget.NestedScrollView>