11. Створення анімації на Android
Первинні вкладки
1. Створіть новий проект. Видаліть всі компоненти на активному екрані.
2. Видаліть всі пункти з меню.
3. Створіть sky.xml в drawable:
1 2 3 4 5 6 7 8 9 10 11 12 | <?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="<a href="http://schemas.android.com/apk/res/android"<br /> ">http://schemas.android.com/apk/res/android"<br /> </a> android:dither="true" android:shape="rectangle" > <gradient android:angle="90" android:endColor="#ff000033" android:startColor="#ff0000ff" /> </shape> |
4.Створіть grass.xml в drawable:
1 2 3 4 5 6 7 8 9 10 11 12 | <?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="<a href="http://schemas.android.com/apk/res/android"<br /> ">http://schemas.android.com/apk/res/android"<br /> </a> android:dither="true" android:shape="rectangle" > <gradient android:angle="90" android:endColor="#ff003300" android:startColor="#ff009900" /> </shape> |
5.Створіть sun.xml в drawable:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 | <?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="<a href="http://schemas.android.com/apk/res/android"<br /> ">http://schemas.android.com/apk/res/android"<br /> </a> android:dither="true" android:shape="oval" > <gradient android:endColor="#ffff6600" android:gradientRadius="150" android:startColor="#ffffcc00" android:type="radial" android:useLevel="false" /> <size android:height="150dp" android:width="150dp" /> </shape> |
6. Створіть clock.xml в drawable:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 | <?xml version="1.0" encoding="utf-8"?> <layer-list xmlns:android="<a href="http://schemas.android.com/apk/res/android"">http://schemas.android.com/apk/res/android"</a> > <item> <shape android:dither="true" android:shape="oval" > <gradient android:endColor="#ffffffff" android:gradientRadius="100" android:startColor="#66ffffff" android:type="radial" android:useLevel="false" /> <size android:height="100dp" android:width="100dp" /> <stroke android:width="2dp" android:color="#99000000" /> </shape> </item> <item android:bottom="44dp" android:left="48dp" android:right="48dp" android:top="5dp"> <shape android:shape="rectangle" > <solid android:color="#99000000" /> </shape> </item> </layer-list> |
7. Створіть hour_hand.xml в drawable:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 | <?xml version="1.0" encoding="utf-8"?> <layer-list xmlns:android="<a href="http://schemas.android.com/apk/res/android"">http://schemas.android.com/apk/res/android"</a> > <item> <shape android:dither="true" android:shape="oval" > <solid android:color="#00000000" /> <size android:height="100dp" android:width="100dp" /> </shape> </item> <item android:bottom="44dp" android:left="48dp" android:right="48dp" android:top="15dp"> <shape android:shape="rectangle" > <solid android:color="#99000000" /> </shape> </item> </layer-list> |
8. Перейдіть у папку res/anim та створіть там наступні файли:
sun_rise.xml:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 | <?xml version="1.0" encoding="utf-8"?> <set xmlns:android="<a href="http://schemas.android.com/apk/res/android"<br /> ">http://schemas.android.com/apk/res/android"<br /> </a> android:duration="5000" android:fillAfter="true" android:interpolator="@android:anim/accelerate_decelerate_interpolator" android:shareInterpolator="false" > <scale android:fromXScale="1.0" android:fromYScale="1.0" android:pivotX="50%" android:pivotY="50%" android:toXScale="1.5" android:toYScale="1.5" /> <translate android:fromYDelta="80%p" android:toYDelta="10%p" /> <alpha android:fromAlpha="0.3" android:toAlpha="1.0" /> </set> |
clock_turn.xml:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | <?xml version="1.0" encoding="utf-8"?> <set xmlns:android="<a href="http://schemas.android.com/apk/res/android"<br /> ">http://schemas.android.com/apk/res/android"<br /> </a> android:duration="5000" android:fillAfter="true" android:interpolator="@android:anim/linear_interpolator" android:shareInterpolator="false" > <rotate android:fromDegrees="0" android:pivotX="50%" android:pivotY="50%" android:toDegrees="720" /> </set> |
hour_turn.xml:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | <?xml version="1.0" encoding="utf-8"?> <set xmlns:android="<a href="http://schemas.android.com/apk/res/android"<br /> ">http://schemas.android.com/apk/res/android"<br /> </a> android:duration="5000" android:fillAfter="true" android:interpolator="@android:anim/linear_interpolator" android:shareInterpolator="false" > <rotate android:fromDegrees="180" android:pivotX="50%" android:pivotY="50%" android:toDegrees="240" /> </set> |
9. Якщо ви все правильно зробили, то ваш проект буде мати такий вигляд:
Запишіть код у MainActivity для виклику анімацій в методі OnCreate після SetContentView
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | // посилання на сонечко ImageView sun = (ImageView) findViewById(R.id.sun); // анімація сходу сонця Animation sunRise = AnimationUtils.loadAnimation(this, R.anim.sun_rise); // підключаємо анімацію до потрібного View // посилання на годинник ImageView clock = (ImageView) findViewById(R.id.clock); // анімація обертання годинника Animation clockTurn = AnimationUtils.loadAnimation(this, R.anim.clock_turn); // посилання на стрілку годинника ImageView hour = (ImageView) findViewById(R.id.hour_hand); // анімація для стрілки Animation hourTurn = AnimationUtils.loadAnimation(this, R.anim.hour_turn); // приєднання анімації hour.startAnimation(hourTurn); clock.startAnimation(clockTurn); sun.startAnimation(sunRise); |
Контрольні питання:
1. Що міститься у папці anim?
2. Як задається градієнт у файлах *.xml у папці drawable?
3. Як викликати анімації об'єкту, якщо вони є?