반응형

이미지 썸네일 RecyclerView에서 아이템을 클릭하여 해당 아이템에 대한 Activity로 전환시 클릭한 아이템 이미지가 커지면서 해당 아이템의 Activity로 전환되는 애니메이션 추가하기

 

1. themes.xml에  windowContentTransitions 아이템 추가

<resources xmlns:tools="http://schemas.android.com/tools">
    <!-- Base application theme. -->
    <style name="Theme.AppName" parent="Theme.MaterialComponents.DayNight.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="windowActionBar">false</item>
        <item name="windowNoTitle">true</item>
        <item name="android:windowContentTransitions">true</item>
    </style>
</resources>

 

2. RecyclerView의 아이템 이미지의 transitionName 속성에 이름 정의

<com.facebook.drawee.view.SimpleDraweeView
    android:id="@+id/img_thumbnail"
    android:transitionName="tran_thumb"
    />

3. 전환하려는 Activity에 있는 이미지의 transitionName 에 위에서 설정한 이름과 동일한값으로 적용

<ImageView
    android:src="@drawable/test"
    android:transitionName="tran_thumb" />

 

4. 위에서 transitionName 을 정의한 썸네일 이미지를  이용하여 Pair를 만들고 해당 Pair를 적용한 ActivityOptionsCompat Option을 생성하여 startActivity 파라미터로 사용

@Override
public void onClick(View view) {    
    View thumbImg = view.findViewById(R.id.img_thumbnail);
    Context context = view.getContext();
    Activity activity = (Activity) context;
    Intent intent = new Intent(context, DetailActivity.class);

    Pair<View, String> tran_thumb = Pair.create(thumbImg, thumbImg.getTransitionName());
    ActivityOptionsCompat options = ActivityOptionsCompat.makeSceneTransitionAnimation(activity, tran_thumb);

    ActivityCompat.startActivity(context, intent, options.toBundle());
}

 

반응형

+ Recent posts