Let me start out by saying that I feel like there should be a very simple way to do this, and it's entirely possible I'm missing something very simple. But all the examples I find for transition animations (push left out, push right in, etc.) deal with moving from one view to another. What about an application that only has one view, but dynamically changes the data feeding that view?
The best common example of this is the base calendar app. It has identical views, but when you swipe forward or backward the date of the view transitions with a swipe animation.
How do I reproduce this? Surely I don't have to inflate ViewFlippers for the same view? And if so, what is the best way to go about this?
Thanks in advance.
The source code for Android can be found on source.android.com, and the project for the Calendar application can be found here.
From the looks of things, they use a ViewSwitcher to process the animations, triggering an animation based on a fling gesture. It's rather complicated, which is why this is on my list of reusable components to write one of these days...
A kind of hacky way of doing this would be to set the layoutAnimation of your view (in XML or Java) and simply remove the view from your window, then edit the data, then re-insert it in to the window again. This will call a layoutAnimation to happen. Note however that with this implementation you can't do remove animations.
You could also use the standard animation framework to transform the view off the screen. Once it has finished that, edit the data of the view. Once that is finished, set another animation on the view to slide back in again.
Related
I draw a View that is not attached to any parent.
It's a decoration for a RecyclerView. The view sticks to the bottom and disappears when its counter part comes up in the list.
All this works fine but:
When i leave the activity the View doesn't fade with the rest of the
views in the activity's transition.
It stays until the end of the animation and then disappears
immediately.
( see large green view in the demo )
How do i include this unattached View in the activity's exit transition?
I've create a minimal Android Studio Project to replicate the issue:
https://github.com/Ostkontentitan/transition-issue-demo
(To better see the issue possibly set your phones animation scale to >= 5)
Here is a demo:
Add transitionName to xml layout for the RecyclerView.
The transition animation you see is because of ActivityOptions.makeSceneTransitionAnimation(this#ItemListActivity) and if you add transitionName to the view, it works fine.
Not-too-educated guess
(because I haven't tried and I haven't used Transition Framework in a few months)
The way TF (Transition Framework) works is by computing the start/end values of the transition and performing the animations needed to achieve this.
RecyclerView decorations are not "views" that are part of the layout, so TF has no idea that thing exists. It does know about your RecyclerView of course, because it's contained in the ViewGroup that is animated.
You may have already know this, but in any case, what I think I'd try to do here, is create a custom transition framework transition (they are not hard to do, you can even check TransitionEverywhere and look at how that library implements some missing transitions in the framework); in your CustomTransition, you can then try to interpolate the animation values so the recycler view can redecorate as the animation progresses (like an alpha value that is animated, your custom decorator would "paint" using said alpha).
Now... in truth, I've had to do something similar once, where a custom transition was "driving" a few external views (for reasons at the time) :) but... it was not a RecyclerView item decoration, mine were just "views", so I'm not sure if you can do this this way w/a decoration.
I think it's worth trying.
I would like to know how to go about doing this small problem that I am encountering while making a video player app.
On clicking the first control(the rectangular icon) in the above image the following view must be displayed instead of it which I am quite unsure as to how to do it. Here is what it is replaced by
Also please note, by any chance the activity should not be changed. I have been able to design the views individually but having problem changing them at runtime when user clicks. Could someone go about explaining as to how it can be done or provide some suitable links to achieve my goal. Thanks.
For something as simple as this you can just change the visibility of the views.
view.setVisibility(View.INVISIBLE)
Or the more effective:
view.setVisibility(View.GONE)
Do that on the views you want gone, I suggest a wrapper class. It's either this or changing the contentView as describded below.
this.setContentView(R.layout.newLayoutToUse);
However, I have a feeling there is a better way to do what you want. It's overkill to load a complete new layout if you just want to change the image of some buttons or imageviews.
This might be a stupid solution, 'cause i'm terribly tired right now, but why not use the bringToFront() method on the View that you want to display in the front? Display them both in front of each other, maybe in a RelativeLayout, and then swap between them as you wish.
They are small objects, so don't consume memory. I don't see why this shouldn't work.
OR
Place them above one another, so they overlap and then make the above view visible/invisible depending on which one you need to display.
OR
just remembered I read somewhere that you can scroll through a ScrollView automatically from code. So display both Views in a ScrollView in succession and when pressing the button or whatever, you scroll down to make the next menu visible. When pres back, you scroll up to make the previous thing available. Should work, and might also make a nice animation between changing of the menus.
I am new to android therefore I got a little bit lost with all those ViewFlipper, ViewSwitcher, ViewAnimator and ViewPager. Moreover, I am not sure what's happening under the hood.
Basically I have an activity which shows some data. With swipe (or button, doesnt matter) I would like to scroll the view and get to another page (as seen in the picture below).
Is it possible to implement something like that without changing to another activity?
I am a little bit confused regarding views and access to the design elements. How those pages are located each to another? e.g. If I am currently seeing Page1, can I modify content of Page3? Or plainly saying, are all page views loaded all together? As if I set setContentView(R.layout.xlayout); then I can access only xlayout elements.
But if I use same activity, then I have a thread there which updates a counter on Page1, if I change view to Page 2, the counter will not find Page1 Counter TextView and will complain.
As I Understand Android 4.0 has ViewPager which is similar to the seen in the picture. I am using GB. Should I use support library or can I just go around and implement something similar without importing any libraries?
(Sorry, my description is a little bit messy)
Yes, you can use ViewSwitcher, ViewFlipper and ImageSwitcher depending on your requirements.
ViewSwitcher may have two childs at max. And these child might be a View or an object of subclass of view.
ViewFlipper: May have as many childs you want. and these child might be a View or an object of subclass of view.
ImageSwitcher might be used to switch images over.
By using view flipper you can display one item at a time, and adding a gesture overlay, you can apply sliding effect. To apply View Flipper, you need to add all the views to ViewFlipper, and showNext and showPrevious methods are used to show next and previous child.
You need to use a ViewPager to have the same behaviour as in Google Play.
it only available on recent version of Android, but you can use the Compatibility Package to make it available for older version.
With a ViewFlipper you can't "scroll" between two pages.
I want to implement view like this:
Inside of this view all children has to be animated while scrolling through them.
I am going to implement it for android 2.x
My first thought was to create custom view extending FrameLayout and manage children views inside programatically, detect gestures and move to next/prev child view animating them (probably scale and transition animation)
What can you advice me, how to achive that, maybe there is an open source project that can help me?
Finally I got what I wan't, there is no simple answer on this question, but simply saying you have to all the work that android UI framework usually does: calculate position of items, add them in proper order, apply different effects (translate, scale, fade out) and draw it on canvas.
To achiev this I follod this extremely useful tutorial (thanks to author)
http://blogs.sonyericsson.com/wp/2010/05/20/android-tutorial-making-your-own-3d-list-part-1/
I am thinking to add my solution somewhere on github once I fix all bugs and make it completelly reusable.
The views are not cached in a ViewFlipper. Is there a way wherein we can get an image of the view and show it to user so that he sees the Ui as we see on Home scrren(when we swipe the previous view also moves along and when we lift our finger, only then the next view is shown completely.)
What I want to do is that when the user starts moving his finegr on screen, the view should also move along(create an image of view).
I am not getting to do this, as when we swipe the present view goes and next view comes, we do not get both visible when we r moving our finger on screen.
Please if anyone gets what I am trying to do, do help me.
Thanks,
Farha
It's tricky to get scroll and swipe tracking working on Android, while using ViewAnimator or its subclasses.
They allow you to set in and out animations and start them at a given moment, but they work with discrete, either-this-or-the-other-view animations. They are actually using FrameLayout and after in or out animation is executed, other views' visibility is set to View.GONE to hide them from showing up under/over your current View.
The Launcher and the Gallery application are actually doing the functionality you want, by using a different approach.
They track the user touch input (onTouchEvent()), on MotionEvent.ACTION_MOVE they perform animations manually and on MotionEvent.ACTION_UP snap to the appropriate view, just like in the iPhone.
Unfortunately, this approach is actually more complicated than it looks like.
With the manual handling, you have to ensure that you are taking care of everything related to the touch input. This includes a lot of flag-raising, value-checking, event-delegating, etc.
If you want to get better acquainted with this, take a look at these classes from Gallery3D or Launcher's source code.
One other way to get nice horizontal scrolling is to use HorizontalScrollView.
You have to figure out a way to recycle your views, like you would with a ListView and you have to add the snap-to-view logic, but if you have to take care of a small number of views it could be the easiest approach.
Hope that helps.