多个共享元素 [英] Multiple Shared Elements

问题描述

我在足球应用程序中遇到以下情况.
我们希望在所有这些活动之间实现共享元素.

I have the following situation inside of a soccer application.
We want to implement the shared elements between all these activities.

在比赛的第一个 Activity 的查看器中，我设置了一个 android:transitionName ，它对应于第二个 Activity .

In my viewholder on the first Activity for the match I have set a android:transitionName which corresponds to the same transitionName on the second Activity.

<!-- item_viewholder (first activity) -->
<CustomViewContainingImageViewAndTextView
     android:id="@+id/item_match_hometeam"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:transitionName="@string/transition_morph_match_header_homeTeam" />

<!-- header (second activity) -->
<CustomViewContainingImageViewAndTextView
     android:id="@+id/item_match_hometeam_header"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:transitionName="@string/transition_morph_match_header_homeTeam" />

我从第二个 Activity 开始

final String awayTeamTransition = activityContext.getString(R.string.transition_morph_match_header_awayTeam);
final String homeTeamTransition = activityContext.getString(R.string.transition_morph_match_header_homeTeam);
final ActivityOptions options = ActivityOptions.makeSceneTransitionAnimation(
                   activityContext,
                   Pair.create(homeTeam, homeTeamTransition),
                   Pair.create(awayTeam, awayTeamTransition));
activityContext.startActivity(intent, options.toBundle());

现在，此过渡效果很好，但是如果我想更详细地介绍该怎么办.
显示有关所选团队的统计信息，我也想在那里共享过渡吗?

Now this transition works fine but what if I want to have an even deeper detail.
Displaying statistics about the selected team and I want to have shared transition there too?

当我将 CustomViewContainingImageViewAndTextView 单击到新的 transitionName 时，我尝试以编程方式设置了 transitionName .

I tried setting the transitionName programmatically when the CustomViewContainingImageViewAndTextView was clicked to the new transitionName.

final String teamViewTransition = activityContext.getString(R.string.transition_morph_teamview_to_detail);
//teamView is the view that was clicked.
ViewCompat.setTransitionName(teamView, teamViewTransition);

final ActivityOptions options = ActivityOptions.makeSceneTransitionAnimation(
     activityContext,
     Pair.create(teamView, teamViewTransition));
activityContext.startActivity(teamInfoActivityIntent, options.toBundle());

此transitionName对应于第三个 Activity

this transitionName corresponds to the ImageView on the third Activity

<ImageView
   android:id="@+id/team_info_header_logo"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:transitionName="@string/transition_morph_teamview_to_detail" />

但是enterTransition失败，但是exitTransition有效！
但是，这使exitTransition从2中断.1

However the enterTransition fails, but the exitTransition works!
However this breaks the exitTransition from 2 --> 1

视线.希望有人花点时间解决这个问题.

Sight. Hope someone takes some time to figure this out.

预先感谢

推荐答案

毫无疑问，问题是因为您正在更改要从第二个 Activity共享的视图的 transitionName 排在第三位.但是您只需在第二个 Activity 中保留该 transitionName ，但在第三 中更改视图的 transitionName Activity 的 onCreate 方法，具体取决于我们要与第二个 Activity 共享的内容.

Beyond any doubt, the problem is because you are changing transitionName of the view that you want to share from second Activity to third. But you should simply keep that transitionName in the second Activity but change transitionName of the view in third Activity's onCreate method, according to what we want to share from second Activity.

因此，让我们继续从第一个 Activity 过渡到第二个，因为它按预期工作.让我们看第二个 Activity :我们只需要发送视图的 transitionName ，我们就希望将共享为 Intent 到第三个 Activity ，然后将此值以编程方式分配给第三个 Activity 中的共享视图.

So let's keep our transition from first Activity to second, as it's working as expected. Let's look at the second Activity: we just need to send the transitionName of view, that we want to share as an extra of Intent to third Activity and then assign this value programmatically to the shared view in third Activity.

这是我们第二 活动的代码:

View homeTeam = findViewById(R.id.home_team_detail);
View awayTeam = findViewById(R.id.away_team_detail);

View.OnClickListener onTeamClickListener = new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        Activity activityContext = MultipleElementsDetail.this;
        final ActivityOptions options = ActivityOptions.makeSceneTransitionAnimation(
                activityContext,
                Pair.create(v, v.getTransitionName()));
        startActivity(new Intent(activityContext, SingleElementDetail.class)
           .putExtra("shared_element_transition_name", v.getTransitionName()), options.toBundle());
    }
};

homeTeam.setOnClickListener(onTeamClickListener);
awayTeam.setOnClickListener(onTeamClickListener);

所以我在这里所做的只是为两个团队创建了相同的 OnClickListener ，这将创建共享的过渡，并使用具有 transitionName 的 Intent 开始新的活动.共享视图的代码>.

So what I did here is just created the same OnClickListener for both teams, which creates shared transition, and starts new activity with Intent having transitionName of shared view as an extra.

然后在第三 活动中，我刚刚从 Intent 中获得了此额外内容，并将其设置为 transitionName 共享视图:

And then in third Activity I've just get this extra from Intent and set it as a transitionName of shared view:

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_single_element_detail);

    View team = findViewById(R.id.team_single);

    String transitionName = getIntent().getStringExtra("shared_element_transition_name");
    if (!TextUtils.isEmpty(transitionName)) {
        ViewCompat.setTransitionName(team, transitionName);
    }
}

结果是我们有这样的事情(我使用爆炸过渡来更好地了解活动之间的区别):

And as a result we have something like this (I've used explode transition to better see the difference between activities):

希望能帮到您，而且与您想要的完全一样！:)

Hope that helps and exactly the same what you want! :)

这篇关于多个共享元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！