ViewPager片段 - 共享单元转换 [英] ViewPager Fragments – Shared Element Transitions
问题描述
这是应用程序，我开发显示图像的网格。当你点击一个图像，它进入详细信息视图。细节视图包含ViewPager，让您刷卡网格中的每一个形象之间。这是通过的路径的列表（包含在网格的每个图像），以及一个被窃听所以ViewPager可设置为起初显示页面的图像的偏移量进行。
An app I'm developing displays a grid of images. When you tap an image, it goes into the details view. The details view contains a ViewPager that allows you swipe between every image in the grid. This is done by passing a lists of paths (containing every image in the grid), along with an offset of the image that was tapped so the ViewPager can be set to show that page initially.
什么是有电流的片段内页的ViewPager共享单元转换偏移的最佳方式？网格（RecyclerView）图像应扩大到当前网页全屏图像。只见推迟并恢复活性过渡，所以该应用将等待，直到图像被从磁盘载入以显示共享单元过渡的能力。但我希望能够使它动画在视图寻呼机正确的页面，并且还退出的任何当前页面，当用户返回（因为你可以在页面之间轻扫）。如果你现在刷到不同的页面，初始页面是动画回电网。
What's the best way to have a shared element transition inside the Fragment of the current offset page in the ViewPager? The grid (RecyclerView) image should expand into the full screen image in the current page. I saw the ability to postpone and resume activity transitions, so the app would wait to display the shared element transition until the image is loaded from the disk. But I want to be able to make it animate to the correct page in the view pager, and also exit to whatever the current page is when the user goes back (since you can swipe between pages). If you swipe to a different page now, the initial page is what animates back into the grid.
目前，我分配在视图寻呼机的每一个片段图像格式image_ [指数]一个transitionName。当我开始详细的活动，我用同样的transitionName与索引作为偏移。
Currently, I assign every image in the Fragments of the view pager with a transitionName in the format "image_[index]". When I start the details activity, I use the same transitionName with the index being the offset.
与此相关的，我也想知道如何让涟漪长presses工作。当您更改视图的激活状态，似乎取消了波动。我想类似的Gmail，效果那里的纹波开始一遍又一遍，并很快完成后很长的preSS完成并触发激活状态。
Related to this, I was also wondering how to make ripples work with long presses. When you change a view's activated state, it seems to cancel the ripple. I want an effect similar to Gmail, where the ripple starts over again and quickly finishes after a long press is complete and triggers the activated state.
推荐答案
据我可以告诉（和纠正我，如果我错了），你想达到什么目的，基本上是这样的：假设你有一个 MainActivity ，一个 DetailsActivity ，和任意一组图像。该 MainActivity 显示设定在一个网格和 DetailsActivity 显示水平相同的一组图像<$图像C $ C> ViewPager 。当用户选择图像中的 MainActivity ，该图像应该从它的位置在网格中的第二个活动的 ViewPager 。
From what I can tell (and correct me if I'm wrong), what you are trying to achieve is basically something like this: Assume you have a MainActivity, a DetailsActivity, and an arbitrary set of images. The MainActivity displays the set of images in a grid and the DetailsActivity displays the same set of images in a horizontal ViewPager. When the user selects an image in the MainActivity, that image should transition from its position in the grid to the correct page in the second activity's ViewPager.
我们要解决的问题是如果用户切换在 DetailsActivity 页？如果发生这种情况，我们要改变这种状况将返回过渡期间使用的共享图像。默认情况下，该活动过渡框架将使用进入过渡期间使用共享的元素......但视图寻呼机的网页已更改，因此很明显，我们希望以某种方式覆盖此行为。要做到这一点，我们需要设置一个 SharedElementCallback 在 MainActivity 和 DetailsActivity 的的onCreate（）方法和覆盖 onMapSharedElements（）方法，像这样：
The problem we want to solve is "what if the user switches pages inside the DetailsActivity"? If this happens, we want to change the shared image that will be used during the return transition. By default, the activity transition framework will use the shared element that was used during the enter transition... but the view pager's page has changed so obviously we want to somehow override this behavior. To do so, we will need to set a SharedElementCallback in your MainActivity and DetailsActivity's onCreate() methods and override the onMapSharedElements() method like so:
private final SharedElementCallback mCallback = new SharedElementCallback() {
@Override
public void onMapSharedElements(List<String> names, Map<String, View> sharedElements) {
if (mCurrentImagePosition != mOriginalImagePosition) {
View sharedView = getImageAtPosition(mCurrentImagePosition);
names.clear();
sharedElements.clear();
names.add(sharedView.getTransitionName());
sharedElements.put(sharedView.getTransitionName(), sharedView);
}
}
/**
* Returns the image of interest to be used as the entering/returning
* shared element during the activity transition.
*/
private View getImageAtPosition(int position) {
// ...
}
};
有关更完整的解决方案，我创建了一个 示例项目在GitHub上 的意志达到这种效果（有太多的code张贴在一个单一的StackOverflow的答案）。
For a more complete solution, I have created a sample project on GitHub that will achieve this effect (there is too much code to post in a single StackOverflow answer).
这篇关于ViewPager片段 - 共享单元转换的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
