Tutorial Android Studio : Cara Membuat Splash Screen Dengan Image Rotation—Sebelumnya,kita telah belajar bagaimana membuat sebuah splash screen sederhana dengan menggunakan image biasa.Kali ini,kita akan belajar bagaimana membuat tampilan atau animasi Splash screen menjadi lebih menarik dengan menggunakan gambar ,yang kemudian akan kita beri efek rotasi/berputar 360 derajat.
Untuk membuat gambar dapat melakukan rotate 360 derajat secara otomatis,kita menggunakan komponen yang disebut thread.Thread merupakan salah satu komponen aplikasi Android yang berfungsi meningkatkatkan kemampuan/performa sebuah sistem di dalam menjalankan sebuah proses.
1.Buat sebuah project baru,klik File>New>New Project
2.Buat desain layout splash,di sini,saya akan merotate 2 buah gambar,dengan desain layout seperti di bawah.Jangan lupa menaruh gambar yang akan digunakan ke direktori drawable.
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.root.myapplication.MainActivity">
<ImageView
android:id="@+id/rotate_image"
android:layout_width="200dp"
android:layout_height="200dp"
android:src="@drawable/logow1"
android:onClick="loop"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true" />
<ImageView
android:id="@+id/rotate_image2"
android:layout_width="110dp"
android:layout_height="110dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
app:srcCompat="@drawable/logoq" />
</RelativeLayout>
3.Kemudian buat direktori anim di dalam direktori res,kemudian isikan dengan file xml baru
Untuk layout rotate gambar pertama,konfigurasinya seperti di bawah
android_rotate_animation.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<rotate
android:duration="2500"
android:fromDegrees="0"
android:pivotX="50%"
android:pivotY="50%"
android:startOffset="0"
android:repeatCount="infinite"
android:repeatMode="reverse"
android:toDegrees="360" />
</set>
Untuk layout rotate gambar kedua :
android_rotate_animation2.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<rotate
android:duration="2500"
android:fromDegrees="360"
android:pivotX="50%"
android:pivotY="50%"
android:startOffset="0"
android:repeatCount="infinite"
android:repeatMode="reverse"
android:toDegrees="0" />
</set>
Yang membedakan ke 2 layout rotate di atas adalah arah rotasinya.
4.Selanjutnya,isikan kode di bawah ini pada class MainActivity.java
MainActivity.java
package com.example.root.myapplication;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.widget.ImageView;
import android.os.Handler;
import android.view.Window;
public class MainActivity extends AppCompatActivity {
ImageView rotateImage;
/* waktu */
public int waktu=0000;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
this.requestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.activity_main);
/*Thread gambar 1*/
new Handler().postDelayed(new Thread() {
@Override
public void run() {
rotateImage = (ImageView) findViewById(R.id.rotate_image);
Animation startRotateAnimation = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.android_rotate_animation);
rotateImage.startAnimation(startRotateAnimation);
}
},waktu);
/*Thread gambar 2*/
new Handler().postDelayed(new Thread() {
@Override
public void run() {
rotateImage = (ImageView) findViewById(R.id.rotate_image2);
Animation startRotateAnimation = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.android_rotate_animation2);
rotateImage.startAnimation(startRotateAnimation);
}
},waktu);
}
/*Pada saat gambar di tekan*/
public void loop(View v){
rotateImage = (ImageView) findViewById(R.id.rotate_image);
Animation startRotateAnimation = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.android_rotate_animation);
rotateImage.startAnimation(startRotateAnimation);
}
}
Kemudian coba lakukan run test dan lihat hasilnya.
Pada saat aplikasi dijalankan,gambar pertama akan merotasi dari 0 ke 360 derajat alias searah jarum jam.Sedangkan gambar ke 2 ,berotasi berlawanan dengan arah jarum jam.
Demikian tutorial kali ini tentang Tutorial Android Studio : Cara Membuat Splash Screen Dengan Image Rotation,semoga bermanfaat.
0 komentar: