2017-06-28 6 views
2

私は一日中これを成功させずに読んできました。CollapsingToolbarLayout with zoom

基本的には、android.support.design.widget.CollapsingToolbarLayout内のImageViewを設定して、画像全体に収まるように折りたたんで「ズームアウト」するように検出されたonOffsetChangedの変化に応じて高さを変更したい通常のcenterCropビヘイビアを行うために展開されたときは「拡大」および「拡大」されます。

ImageViewの高さをonOffsetChangedに設定しようとしましたが、CollapsingToolbarLayoutがその位置を変更していると仮定すると、他の問題が発生します。

私はParallaxListViewプロジェクトに見ましたが、CollapsingToolbarLayoutを使用したいと考えています。

サンプルコードを提供できる人なら誰でも可能ですか?またthis projectやはり同様の制限見

enter image description here

。他のプロジェクトも同様です。

enter image description here

答えて

1

あなたは崩壊し、画像のレイアウト定義用android:scaleType="matrix"を使用して試すことができます。

コードで

、 店Matrixにおける初期ImageMatrixmatrix.set(imageView.getImageMatrix());

を使用して、ツールバーの崩壊のスクロールに応じて、あなたは、画像を拡大縮小し、最終的に戻ってimageView.setImageMatrix(matrix)を使ってImageViewのにそれを設定するためにmatrix.postScale()を使用することができます。ズームイン/アウトの効果が得られます。

+0

@Georgeこんにちはを実装し拡張します。この回答が問題の解決に役立った場合は、それを承認済みとしてマークしてください。 – Balamurugan

-1

私は最終的に、それが助けるかもしれない他の誰かのために次のコードでそれをやった。展開時に幅にフィットし、折りたたまれたときに高さにフィットします。必要に応じてさらに拡大/縮小(ズーム)することができます。

最適なコードが書かれているかどうかはわかりませんが、ご了承ください。ビットマップとビューを測定し、min/maxスケールを計算するには、最初にonOffsetChangedを呼び出すとうまくいくようです。

パブリッククラスMyActivityはAppCompatActivityが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); 
} 
} 

マイレイアウト

<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>