I have an issue with Shared Element Transition.
When I return to MainActivity from DetailActivity, FAB blinking
Gif example
I used this sample project.
For shared element transition I made:
Enabled Window Content Transitions in styles.xml
<item name="android:windowContentTransitions">true</item>
Assign a common transition name to the shared elements in both layouts.
android:transitionName="image"
Started the target activity by specifying a bundle of those shared elements and views from the source
holder.mView.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
Context context = v.getContext();
Intent intent = new Intent(context, CheeseDetailActivity.class);
intent.putExtra(CheeseDetailActivity.EXTRA_NAME, holder.mBoundString);
MainActivity activity = (MainActivity) context;
ActivityOptionsCompat options = ActivityOptionsCompat.makeSceneTransitionAnimation(activity, new Pair<>(holder.mView.findViewById(R.id.avatar), "image"));
ActivityCompat.startActivity(context,intent, options.toBundle());
}
});
And when i press back button, FAB from detail Activity blinks in Main activity.
I did not find a similar problem, so thanks for any help!
I fixed it by hiding FAB before close Activity.
In onBackPressed() and in home button onClick i pasted:
CoordinatorLayout.LayoutParams params = (CoordinatorLayout.LayoutParams) myFab.getLayoutParams();
params.setBehavior(null);
myFab.requestLayout();
myFab.setVisibility(View.GONE);
Maybe it will be useful for someone.
Related
Google's Material Design guidelines prescribe the following transition for "parent-to-child" transitions when the parent consists of a list. (Material Design Guidelines)
How do I provide such a transition? I'm unaware of any inbuilt transition provided to make this possible.
One option is to use ActivityOptionsCompat.makeScaleUpAnimation
Activity activity = getActivity();
Intent intent = new Intent(activity, OtherActivity.class);
Bundle options = ActivityOptionsCompat.makeScaleUpAnimation(
sourceView, 0, 0, sourceView.getWidth(), sourceView.getHeight()).toBundle();
ActivityCompat.startActivity(activity, intent, options);
This will cause the new activity to expand vertically and horizontally outwards from your sourceView
Start an activity with a shared element
To make a screen transition animation between two activities that have a shared element:
Enable window content transitions in your theme.
Specify a shared elements transition in your style.
Define your transition as an XML resource.
Assign a common name to the shared elements in both layouts with the android:transitionName attribute.
Use the ActivityOptions.makeSceneTransitionAnimation() method.
// get the element that receives the click event
final View imgContainerView = findViewById(R.id.img_container);
// get the common element for the transition in this activity
final View androidRobotView = findViewById(R.id.image_small);
// define a click listener
imgContainerView.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
Intent intent = new Intent(this, Activity2.class);
// create the transition animation - the images in the layouts
// of both activities are defined with android:transitionName="robot"
ActivityOptions options = ActivityOptions
.makeSceneTransitionAnimation(this, androidRobotView, "robot");
// start the new activity
startActivity(intent, options.toBundle());
}
});
For shared dynamic views that you generate in your code, use the View.setTransitionName() method to specify a common element name in both activities.
To reverse the scene transition animation when you finish the second activity, call the Activity.finishAfterTransition() method instead of Activity.finish().
Take from here Customize Activity Transitions
Hey I think I'm a few weeks late, but I just released a library for building this, inspired by Google Inbox: https://github.com/saket/InboxRecyclerView
you can animation using below code
Intent intent = new Intent(MainActivity.this, NFCTagInformationActivity.class);
Bundle options = ActivityOptionsCompat.makeClipRevealAnimation(
cvTagInfoSmall, 0, 0, cvTagInfoSmall.getWidth(), cvTagInfoSmall.getHeight()).toBundle();
ActivityCompat.startActivity(this, intent, options);
you can use makeScaleUpAnimation instead of makeClipRevealAnimation for different view transition animation.
I'm new android developper. In my application I have a main activity with toolbar, that contains a title, and a recycler view.
The recycler view contains some items. I want to open a activity on click on them. My code is able to open the activity but the toolbar disappear.
I open the activity like this:
public VHolder(final View itemView){
super(itemView);
title = ((TextView) itemView.findViewById(R.id.articleTitle));
itemView.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
Intent intent = new Intent(itemView.getContext(), ArticleActivity.class);
intent.putExtra("title", currentNews.title);
intent.putExtra("content", currentNews.htmlContent);
itemView.getContext().startActivity(intent);
}
});
}
Have you any ideas and advices ?
Sorry about my poor english ;).
You are doing everything in the correct way. The problem is that toolbar is just another widget on your Activity and cannot be shared between multiple activities. So you should add toolbar view to the layout of the Activity which you are starting (ArticleActivity).
As another option you can show Fragment over RecyclerView instead of starting new Activity. Similar to this: how to open a different fragment on recyclerview OnClick
I have found the cause of my problem of toolbar. The opened activity (ArticleActivity) not extends "AppCompatActivity" like the main activity but, "Activity".
I want to launch a new activity with shared element transition on a particular view, and at the same time let other views slide in from the bottom.
Currently I can only implement the shared element transition part, and the other views just stay stationary. How do I add the slide transition at the same time?
Bundle bundle = ActivityOptionsCompat
.makeSceneTransitionAnimation(
WeekScheduleActivity.this,
v,
"trans_card"
).toBundle();
Intent intent = new Intent(WeekScheduleActivity.this, CourseDetailActivity.class);
intent.putExtra("course_object",course);
startActivity(intent, bundle);
You'll need to make changes in second activity for that. Write this in your onCreate of 2nd activity:
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
Slide slide = new Slide(Gravity.BOTTOM);
slide.addTarget(R.id.description);
slide.setInterpolator(AnimationUtils.loadInterpolator(this, android.R.interpolator
.linear_out_slow_in));
slide.setDuration(slideDuration);
getWindow().setEnterTransition(slide);
}
You can find a working example of the the effect you want to achieve here:
https://github.com/anshchauhan/SharedElementTransition
I'm trying to build a search bar similar to Flipboard. This search bar animates from below the toolbar to cover the toolbar. This GIF shows it better than I can explain:
Does anyone know if this is standard Material Design? And if so, are there any libraries or standard widgets I can use to do this? Soundcloud also does this so just wanted to ask if there was anything already out there. If not I'll just have to implement it myself.
Thanks!
To solve this I'd recommend looking into android.support.v4.app.ActivityOptionsCompat.makeSceneTransitionAnimation().
Here are the snippets from the code I remember:
I have ActivityA which contains an EditTextA.
The EditTextA has a View.OnClickListener:
View.OnClickListener() {
#Override
public void onClick(View view) {
ActivityB.launch(getActivity(), view);
}
}
which when invoked calls a static method: ActivityB.launch(Activity a, View transitionView):
public static void launch(Activity activity, View transitionView) {
ActivityOptionsCompat options = ActivityOptionsCompat.makeSceneTransitionAnimation(
activity, transitionView, EXTRA_TRANSITION_VIEW);
Intent intent = new Intent(activity, ActivityB.class);
ActivityCompat.startActivity(activity, intent, options.toBundle());
}
The code above is basically creating an Intent that will launch ActivityB. That Intent also includes a Bundle (options.toBundle()) which has a bunch of stuff, including the view that is transitioning from ActivityA to ActivityB. In my case this is the EditTextA.
In ActivityB.onCreate() all we need to do is "connect" that view to the new view it's transitioning to. So in my case, EditTextA is transitioning to another EditTextB that lives in ActivityB.
ActivityB.onCreate() {
....
mEditTextB = (EditText) findByViewId(...);
ViewCompat.setTransitionName(mEditTextB, EXTRA_TRANSITION_VIEW);
}
If I remember everything correctly that should be it :).
I am using a Master/Detail pattern and currently moving to Android Lollipop. I want to have one of the new activity transistions if I click on a item in my ListView. The animations are working but I do not know how to make a certain animation between the shared element (in my case a ImageView).
If I click on a row in my custom ListView (with image and text), the transition should switch to the image in my DetailActivtiy. It should look like in this video: http://youtu.be/RhiPJByIMrM?t=2m41s or this video: http://youtu.be/XkWI1FKKrs4
I already added this code to both of my ImageViews:
<ImageView
android:transitionName="#string/transition_title_image"/>
My ListActivity:
#Override
protected void onCreate(Bundle savedInstanceState) {
if (Build.VERSION.SDK_INT >= 21) {
//To enable window content transitions in your code instead, call the Window.requestFeature() method:
getWindow().requestFeature(android.view.Window.FEATURE_CONTENT_TRANSITIONS);
Transition ts_enter = new Slide(); //Slide(); //Explode();
Transition ts_exit = new Explode();
ts_enter.setDuration(2000);
ts_exit.setDuration(2000);
/*
If you have set an enter transition for the second activity,
the transition is also activated when the activity starts.
*/
getWindow().setEnterTransition(ts_enter);
getWindow().setExitTransition(ts_exit);
}
super.onCreate(savedInstanceState);
Using this method to call my DetailActivity:
if (Build.VERSION.SDK_INT >= 21) {
Intent intent = new Intent(ArticleListActivity.this, ArticleDetailActivity.class);
intent.putExtra("pos", id);
intent.putExtra("articleList", articleList);
String transitionName = getString(R.string.transition_title_image);
ImageView article_thumb = (ImageView) findViewById(R.id.article_thumb);
ActivityOptionsCompat options =
ActivityOptionsCompat.makeSceneTransitionAnimation(ArticleListActivity.this,
article_thumb, // The view which starts the transition
transitionName // The transitionName of the view we’re transitioning to
);
ActivityCompat.startActivity(ArticleListActivity.this, intent, options.toBundle());
}
My DetailActivity:
#Override
protected void onCreate(Bundle savedInstanceState) {
if (Build.VERSION.SDK_INT >= 21) {
//To enable window content transitions in your code instead, call the Window.requestFeature() method:
getWindow().requestFeature(android.view.Window.FEATURE_CONTENT_TRANSITIONS);
Transition ts_enter = new Slide(); //Slide(); //Explode();
Transition ts_exit = new Explode(); //Slide(); //Explode();
ts_enter.setDuration(2000);
ts_exit.setDuration(2000);
getWindow().setEnterTransition(ts_enter);
getWindow().setExitTransition(ts_exit);
}
super.onCreate(savedInstanceState)
;
Try this:
First, make sure you give each ImageView in your first activity a unique transition name. If all of the image views have the same transition name, the framework will not know which one to choose when the animation begins and the transition will not behave properly.
When the ImageView is clicked, pass its unique transition name to the details activity as an Intent extra.
In the details activity's onCreate() method, retrieve the name from the intent bundle, and set it as the ImageView's transition name.