ImageView 공유 요소 전환 : 조각과 활동

Question

나는 뷰어에 동영상 이미지를 표시하고 있습니다. 사용자가 이미지를 선택할 때마다 이미지가 애니메이션으로 표시 (크기 조정)되고 다른 액티비티로 그려집니다. 문제는 애니메이션을 올바르게 구현할 수 없다는 것입니다.

다음

View v = inflater.inflate(R.layout.pager_fragment, container, false); 
poster = (ImageView) v.findViewById(R.id.selectedMoviePoster); 
final View sharedView=poster; 
final String transitionName=y.getOriginalTitle(); 
ActivityCompat.startActivity(getActivity(),sendMovie, ActivityOptions.makeSceneTransitionAnimation(getActivity(),sharedView,transitionName).toBundle()); 

는 "Y"가 표시 될 것입니다 영화 객체입니다

이

은 ( MoviesPager.java 조각 내) 내 viewpager의 코드입니다.

getWindow().requestFeature(Window.FEATURE_ACTIVITY_TRANSITIONS);//=<item name="android:windowActivityTransitions">true</item>*/ 
getWindow().setExitTransition(new Fade());//=<item name="android:windowExitTransition">@transition/fade</item> 
getWindow().setSharedElementExitTransition(new ChangeImageTransform());//same as above 

이 의 코드가 Movie.java입니다

getWindow().requestFeature(Window.FEATURE_ACTIVITY_TRANSITIONS); 
getWindow().setEnterTransition(new Fade()); 
getWindow().setSharedElementEnterTransition(new ChangeImageTransform()); 

전환 이름 영화 정보를 표시합니다

이

은 viewpager이 구현되는 내부 MainActivity.java의 코드

1) activity_main.xml

<android.support.v4.view.ViewPager 
    android:id="@+id/currentMoviesViewPager" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:transitionName="viewPagerTransition"/> 

2) viewpager

<android.support.v7.widget.CardView 
    xmlns:card_view="http://schemas.android.com/apk/res-auto" 
    android:id="@+id/card_view" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:layout_gravity="center" 
    card_view:cardElevation="40dp" 
    card_view:cardCornerRadius="4dp" 
    android:clipChildren="false" 
    android:clipToPadding="false"> 


    <ImageView 
     android:id="@+id/selectedMoviePoster" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent"/> 

    <ProgressBar 
     android:id="@+id/loadPosterProgress" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_gravity="center"/> 

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

의 단편에 대한 XML은 activity_movie.xml

<android.support.design.widget.AppBarLayout 
    android:id="@+id/appbar" 
    android:layout_width="match_parent" 
    android:layout_height="300dp" 
    android:fitsSystemWindows="true" 
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"> 

    <android.support.design.widget.CollapsingToolbarLayout 
     android:id="@+id/collapsing_toolbar" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:fitsSystemWindows="true" 
     app:contentScrim="?attr/colorAccent" 
     app:expandedTitleMarginEnd="64dp" 
     app:expandedTitleMarginStart="48dp" 
     app:layout_scrollFlags="scroll"> 

     <ImageView 
      android:id="@+id/selectedMoviePoster" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      app:layout_collapseMode="parallax" 
      app:layout_collapseParallaxMultiplier="1"/> 

     <android.support.v7.widget.Toolbar 
      android:id="@+id/toolbar" 
      android:layout_width="match_parent" 
      android:layout_height="?attr/actionBarSize" 
      app:layout_collapseMode="pin" 
      app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/> 

     <View 
      android:layout_width="match_parent" 
      android:layout_height="10dp" 
      android:background="@android:color/white" 
      app:layout_collapseMode="parallax" 
      app:layout_collapseParallaxMultiplier="1"/> 

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

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

3) pager_fragment.xml에서의 그리고 두 활동 모두에서 Universal Image Loader을 사용하여 이미지를 다운로드하고 표시합니다.

또한 가능한 경우로드하기 전에 이미지를 저장할 수 있으므로 매번 다운로드하지 않아도됩니다. 이미지 뷰로 이미지 크기 조정도 완벽하게 작동하지 않습니다.

나는 두 가지 다른 테마를 두 가지 활동에 사용했으며 여기에는 코드가 있습니다.

4) styles.xml :이 전환을 수행 할 수있는

<resources> 

<!-- Base application theme. --> 
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar"> 
    <!-- Customize your theme here. --> 
    <item name="colorPrimary">@color/colorPrimary</item> 
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item> 
    <item name="colorAccent">@color/colorAccent</item> 
    <item name="android:windowBackground">@android:color/darker_gray</item> 
    <item name="android:windowContentTransitions">true</item> 
</style> 

<style name="Theme.AppCompat.Light.FullScreen"> 
    <item name="windowNoTitle">true</item> 
    <item name="windowActionBar">false</item> 
    <item name="android:windowBackground">@android:color/darker_gray</item> 
    <item name="android:windowContentTransitions">true</item> 
</style> 

Answer 1

은 다음과 같습니다

    View sharedView = holder.event_pic; 
        String transitionName = mContext.getString(R.string.event_image); 
        Intent intent_event_description = new Intent(mContext, EventDescription.class); 
        if (Build.VERSION.SDK_INT >= 21) { 
         ActivityOptions transitionActivityOptions = ActivityOptions.makeSceneTransitionAnimation(activity, sharedView, transitionName); 
         mContext.startActivity(intent_event_description, transitionActivityOptions.toBundle()); 
        } 

당신이 모두에 대해 동일한 ID의의를 제공합니다 이미지.당신의 스타일 테마에

:

<item name="android:windowContentTransitions">true</item> 

모두 이미지에 동일한 전환 이름을 입력하십시오 :

  <ImageView 
      android:id="@+id/selectedMoviePoster" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      app:layout_collapseMode="parallax" 
      android:transitionName="selectedMoviePoster" 
      app:layout_collapseParallaxMultiplier="1"/> 

      <ImageView 
      android:id="@+id/selectedMoviePoster" 
      android:layout_width="match_parent" 
      android:transitionName="selectedMoviePoster" 
      android:layout_height="match_parent"/>