How to make Moto G Globe animation in an app? - android

We are building an Android app where in the place of splash screen while waiting, i want to add an animation just like Boot animation of Moto G. Not exactly the same, but globe with some other elements will be used.
So my question is how to do it something like that?
Any input is much appreciated.
Thanks,

as for android .. you have to make animation manually ..
for this make xml file with animatiom-list under res/drawable .. then add items and give duration ..
EXAMPLE:::::
<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
android:oneshot="false">
<item
android:drawable="#drawable/image1"
android:duration="300"
/>
<item
android:drawable="#drawable/image2"
android:duration="300"
/>
<item
android:drawable="#drawable/image3"
android:duration="300"
/>
<item
android:drawable="#drawable/image4"
android:duration="300"
/>
android:oneshot="false" is to repeat animation again and again .. if you dont want to repeat then make it true
after you make animation .. add it in a imageview ..

Related

Android: icon notification blinking

How to have this blink effect on my notification icon during a download file, like that:
MY ANSWER
Just use this native drawable android.R.drawable.stat_sys_download
mBuilder.setContentTitle(title)
.setContentText(filename)
.setSmallIcon(android.R.drawable.stat_sys_download);
Try using an animation drawable.
For example:
<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:drawable="#drawable/frame1On" android:duration="1000" />
<item android:drawable="#drawable/frame2Off" android:duration="1000" />
</animation-list>
Where frame1On on is the image highlighted, and frame2Off is the image greyed out. Add more frames if necessary.

Animate selector/state transitions

I have a simple selector for my ListView
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/yellow_arc" android:state_activated="true"/>
<item android:drawable="#drawable/yellow_nonarc" android:state_activated="false"/>
</selector>
I want to animate the transition between these drawables when the state of the views are changed from activated to not-activated and vica versa.
If you run the example in API demos you will see an obvious fade-in/fade-out animation while the activated state of the view is changed.
So what I want is a custom animation while the state of the view is changed. I think it should be done via xml but I couldn't find a way.
Thanks in advance.
EDIT:
I guess I have found something useful there's a activated_background.xml in \Android\android-sdk\platforms\android-API_VERSION\data\res\drawable which includes
<selector xmlns:android="http://schemas.android.com/apk/res/android"
android:exitFadeDuration="#android:integer/config_mediumAnimTime">
<item android:state_activated="true" android:drawable="#android:drawable/list_selector_background_selected" />
<item android:drawable="#color/transparent" />
</selector>
So the example in API-demos achieveing this fade-out animation by declaring an exitFadeDuration. However, this is not exactly what I want.. I want to declare custom animations for the transition between the state drawables since the fade-in/fade-out animation does not look good for my drawables.
Added in api 21 "StateListAnimator"
http://developer.android.com/reference/android/animation/StateListAnimator.html
I know this is an old question but this may help future people looking to do this.
I guess TransitionDrawable could help you to accomplish this.
You can check the answer here:
Animate change of view background color on Android
The modern way (since api 21) of doing it with example:
<?xml version="1.0" encoding="utf-8"?>
<animated-selector xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item
android:id="#+id/checked"
android:drawable="#drawable/check_box_on"
app:check="true" /> <!-- this is custom state. You can use android:state_checked="true"-->
<item
android:id="#+id/unchecked"
android:drawable="#drawable/check_box_off"
app:check="false" />
<transition
android:drawable="#drawable/toggle_checkbox_unchecked_checked"
android:fromId="#+id/unchecked"
android:toId="#+id/checked" />
<transition
android:drawable="#drawable/toggle_checkbox_checked_unchecked"
android:fromId="#+id/checked"
android:toId="#+id/unchecked" />
</animated-selector>
documentation for animated-selector: link
where transition drawable is for example this:
<?xml version="1.0" encoding="utf-8"?>
<animated-vector xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:aapt="http://schemas.android.com/aapt"
android:drawable="#drawable/check_box_on">
<target android:name="check_box_on_path">
<aapt:attr name="android:animation">
<objectAnimator
android:duration="#android:integer/config_shortAnimTime"
android:interpolator="#android:interpolator/decelerate_cubic"
android:propertyName="trimPathEnd"
android:valueFrom="1"
android:valueTo="0"
android:valueType="floatType" />
</aapt:attr>
</target>
</animated-vector>
documentation for animated-vector: link
Is it the fade you want?
I guess it would be the same as how a textSwitcher works, maybe you want to change it to a ViewSwitcher instead, the fade is done pro-grammatically
Animation in = AnimationUtils.loadAnimation(this,
android.R.anim.fade_in);
Animation out = AnimationUtils.loadAnimation(this,
android.R.anim.fade_out);
mSwitcher1.setInAnimation(in);
mSwitcher1.setOutAnimation(out);

Designing animation for android application

What is the best way to design and embed an animation into an android app.
(I'm not talking about transitions and activities in/out animations.)
I can think of 2 ways of doing it:
designing the animation with flash or something similar, export png-sequence with transparent bgs and creating an animation from the images in an xml file (How do I write this kind of xml?)
creating a grid of images with all the frames of the animation that I've created
and save it into one image. than using something like background-position in css in order to move the visible area of the image on each frame enter (By Java code, or by xml)
which of this is better/most common? and how do I implement the solution (if there is a better solution - that would be great).
and what programs do you usually use for this kind of task
(the goal is to achieve something that works like the frog in cut the rope or the birds in angry birds for example)
thanks!
I used simple animation in one project... It's on your first point... A sequence of *.png files in /res/drawable, and *.xml like:
<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
android:oneshot="true">
<item android:drawable="#drawable/s250" android:duration="200" />
<item android:drawable="#drawable/s251" android:duration="200" />
<item android:drawable="#drawable/s252" android:duration="200" />
<item android:drawable="#drawable/s253" android:duration="200" />
<item android:drawable="#drawable/s254" android:duration="200" />
<item android:drawable="#drawable/s255" android:duration="200" />
<item android:drawable="#drawable/s256" android:duration="200" />
<item android:drawable="#drawable/s257" android:duration="200" />
<item android:drawable="#drawable/s258" android:duration="200" />
</animation-list>
... and source...
final ImageView pygalo = (ImageView) findViewById(R.id.imageanimation);
pygalo.setBackgroundResource(R.anim.animation);
final AnimationDrawable pygaloanimation = (AnimationDrawable) pygalo.getBackground();
pygalo.setOnClickListener(new OnClickListener()
{
#Override
public void onClick(View vp) {
pygaloanimation.stop();
pygaloanimation.start();
}
});
It is very easy to do...

How can I make an image loop infinitely in Android?

I'm hoping this question will be easy to answer, I have 2 pictures of identical shape and size, I'd like them to infinitely loop from one to the other as soon as the app starts. It would be similar to an animated gif, they wouldn't move or rotate, just loop repeatedly, and very vast (over 10 loops per second at least). A way to adjust the speed in milliseconds would be a big plus.
Try to use FrameAnimation. There is example in docs.
<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
android:oneshot="false">
<item android:drawable="#drawable/image1" android:duration="200" />
<item android:drawable="#drawable/image2" android:duration="200" />
</animation-list>

android imageview onClick animation

I guess this is kind of an odd question but I have tried setting onClicklistener on an ImageView and it has worked. But the problem is that the user cannot sense the click. I mean if some of u have worked on other mobile environs(like Apple iPhone) then when we click on an Image in other environs then it gives an effect on the image so that the user can understand that the image has been clicked.
I have tried setting alpha using setalpha method but it doesn't work. Though the same thing is working fine on onFocusListener implementation. Can some1 suggest a different way to modify the image on click...
I am new to android so haven't learnt the nuances of simple animation also... if there is any simple animation I can use for the same then please let me know.
Thanks!
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<alpha
android:fromAlpha = "1.0"
android:toAlpha = "0.5"
android:duration = "300">
</alpha>
<scale
android:fromXScale = "1"
android:toXScale = "0.9"
android:fromYScale = "1"
android:toYScale = "0.9"
android:pivotX="50%"
android:pivotY="50%"
android:duration = "50">
</scale>
</set>
I don't know if this is the correct method but defining an animation as mentioned did the trick. Now we just have to give
public void onClick(View v) {
v.startAnimation(AnimationUtils.loadAnimation(Context, R.anim.image_click));
//Your other coding if present
}
in the OnClick method and the change will be visible...
You'll want to use a drawable that contains different images for the different states you want to support. Here's an example:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" android:drawable="#drawable/img_pressed" />
<item android:state_focused="true" android:drawable="#drawable/img_focused" />
<item android:drawable="#drawable/img_at_rest" />
</selector>
Name this file img.xml or something and put it in your drawable directory, then set your ImageView's image to img.xml. #drawable/img_at_rest is the original image you're trying to use, while #drawable/img_pressed and #drawable/img_focused are the images to use for their respective states. You can also use solid colors instead of images if it's appropriate for your use case.
anim/anim_item.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<alpha
android:fromAlpha="0.0"
android:toAlpha="1."
android:duration="1000">
</alpha>
</set>
And add:
myView.startAnimation(AnimationUtils.loadAnimation(context, R.anim.anim_item));
Not sure if it works, but have you tried setSelected()
http://developer.android.com/reference/android/widget/ImageView.html#setSelected(boolean)

Categories

Resources