Contoh dan cara membuat transisi animasi di aplikasi android
Contoh cara membuat transisi animasi
di aplikasi android
Anda dapat menerapkan animasi ke aktivitas transisi yang berarti
entri dan ada konten tata letak aktivitas dapat dianimasikan. Anda dapat
menentukan animasi dalam xml dan mengaturnya sebagai animasi transisi aktivitas
dengan memanggil overridePendingTransition () metode dan melewati sumber daya
animasi untuk aktivitas masuk dan aktivitas keluar. Method
overridePendingTransition () perlu dipanggil segera setelah startActivity.
Menggunakan kerangka kerja tampilan animasi, Anda dapat
menentukan animasi seperti memudar, memutar, menggeser, merentangkan, dan
meledakkan dan menyimpannya dalam folder res / anim, sumber daya ini dapat
digunakan sebagai animasi untuk transisi aktivitas.
Mari
kita lihat bagaimana animasi dapat diterapkan untuk transisi antara pendaftaran
dan layar login.
Masuk Animasi
<?xml
version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/bounce_interpolator">
<translate
android:fromXDelta="0%" android:toXDelta="-100%"
android:fromYDelta="0%" android:toYDelta="0%"
android:duration="1500"/>
</set>
Keluar dari Animasi
<?xml
version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/bounce_interpolator">
<translate
android:fromXDelta="-100%" android:toXDelta="0%"
android:fromYDelta="0%" android:toYDelta="0%"
android:duration="1500"/>
</set>
Aktivitas Pendaftaran
public class RegistrationActivity extends
AppCompatActivity {
private static final String TAG = "LoginActivity";
@Override
protected void onCreate(Bundle
savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.registration_activity);
Toolbar tb =
findViewById(R.id.toolbar);
setSupportActionBar(tb);
tb.setSubtitle("Registration");
findViewById(R.id.go_login_b).setOnClickListener(new
View.OnClickListener() {
@Override
public void onClick(View view) {
handleLoginClick();
}
});
}
private void handleLoginClick(){
Intent i = new Intent();
i.setClass(this, LoginActivity.class);
startActivity(i);
overridePendingTransition(R.anim.fade_in,
R.anim.fade_out);
}
}
Tata Letak Pendaftaran
<?xml
version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"/>
<android.support.constraint.ConstraintLayout
android:id="@+id/reg_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/reg_bg"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_marginTop="16dp">
<android.support.design.widget.TextInputLayout
android:id="@+id/name_l"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent">
<android.support.design.widget.TextInputEditText
android:id="@+id/name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Name" />
</android.support.design.widget.TextInputLayout>
<android.support.design.widget.TextInputLayout
android:id="@+id/email_l"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@+id/name_l">
<android.support.design.widget.TextInputEditText
android:id="@+id/email"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Email" />
</android.support.design.widget.TextInputLayout>
<android.support.design.widget.TextInputLayout
android:id="@+id/password_l"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@+id/email_l">
<android.support.design.widget.TextInputEditText
android:id="@+id/password"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Password"
android:inputType="textWebPassword" />
</android.support.design.widget.TextInputLayout>
<Button
android:id="@+id/register_b"
style="@style/Widget.AppCompat.Button.Colored"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Register"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@+id/password_l" />
<Button
android:id="@+id/go_login_b"
style="?android:attr/borderlessButtonStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Already
registered? Login."
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@+id/register_b" />
</android.support.constraint.ConstraintLayout>
</LinearLayout>
Aktivitas Login
package zoftino.com.databinding;
import
android.content.Intent;
import
android.os.Bundle;
import
android.support.v7.app.AppCompatActivity;
import
android.support.v7.widget.Toolbar;
import
android.view.View;
/**
* Created by srinu on 3/31/2018.
*/
public class
LoginActivity extends AppCompatActivity {
private static final String TAG = "LoginActivity";
@Override
protected void onCreate(Bundle
savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.login_activity);
Toolbar tb =
findViewById(R.id.toolbar);
setSupportActionBar(tb);
tb.setSubtitle("Login");
findViewById(R.id.go_reg_b).setOnClickListener(new
View.OnClickListener() {
@Override
public void onClick(View view) {
handleRegistrationClick();
}
});
}
private void
handleRegistrationClick(){
Intent i = new Intent();
i.setClass(this, RegistrationActivity.class);
startActivity(i);
overridePendingTransition(R.anim.scale_anim,
R.anim.translate_anim);
}
}
Tata Letak Login
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.v7.widget.Toolbar android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary" />
<android.support.constraint.ConstraintLayout android:id="@+id/login_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/login_bg"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_marginTop="16dp">
<android.support.design.widget.TextInputLayout android:id="@+id/login_email_l"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent">
<android.support.design.widget.TextInputEditText android:id="@+id/login_email"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Email" />
</android.support.design.widget.TextInputLayout> <android.support.design.widget.TextInputLayout android:id="@+id/login_password_l"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@+id/login_email_l">
<android.support.design.widget.TextInputEditText android:id="@+id/login_password"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Password"
android:inputType="textWebPassword" />
</android.support.design.widget.TextInputLayout> <Button android:id="@+id/login_b"
style="@style/Widget.AppCompat.Button.Colored"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Login"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@+id/login_password_l" />
<Button android:id="@+id/go_reg_b"
style="?android:attr/borderlessButtonStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Don't have an account? Sign up now."
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@+id/login_b" />
</android.support.constraint.ConstraintLayout></LinearLayout>
Animasi
Beberapa definisi animasi yang dapat Anda gunakan sebagai
animasi untuk transisi aktivitas.
Fade in
<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/accelerate_decelerate_interpolator">
<alpha android:duration="1200"
android:fromAlpha="0.0"
android:toAlpha="1.0" />
</set>
Fade out
<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/accelerate_decelerate_interpolator">
<alpha android:duration="1200"
android:fromAlpha="1.0"
android:toAlpha="0.0" />
</set>
Blink
<?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.0"
android:duration="200"
android:repeatMode="reverse"
android:repeatCount="infinite"/>
</set>
Bounce
<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android"
android:fillAfter="true"
android:interpolator="@android:anim/bounce_interpolator">
<scale android:duration="400"
android:fromXScale="0.0"
android:toXScale="1.0"
android:fromYScale="1.0"
android:toYScale="1.0" />
</set>
Geser ke atas
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/linear_interpolator">
<scale android:duration="800"
android:fromXScale="1.0"
android:fromYScale="1.0"
android:toXScale="1.0"
android:toYScale="0.0" />
</set>
Meluncur ke bawah
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/linear_interpolator">
<scale android:duration="800"
android:fromXScale="1.0"
android:fromYScale="0.0"
android:toXScale="1.0"
android:toYScale="1.0" />
</set>
Pindah
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/overshoot_interpolator">
<translate android:fromXDelta="0%p"
android:toXDelta="60%p"
android:duration="1000" />
</set>
Memutar
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/cycle_interpolator">
<rotate android:fromDegrees="0" android:toDegrees="360"
android:pivotX="51%"
android:pivotY="49%"
android:duration="1200"
android:repeatMode="restart"
android:repeatCount="50"/>
</set>
Perbesar
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/decelerate_interpolator">
<scale android:duration="1200" android:fromXScale="0.5dp"
android:fromYScale="0.5dp"
android:pivotX="50%"
android:pivotY="50%"
android:toXScale="2"
android:toYScale="2" >
</scale></set>
Perkecil
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/accelerate_interpolator">
<scale android:duration="1200" android:fromXScale="2.0"
android:fromYScale="2.0"
android:pivotX="50%"
android:pivotY="50%"
android:toXScale="0.6"
android:toYScale="0.6" >
</scale></set>
Geser ke kanan
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/linear_interpolator">
<scale android:duration="800"
android:fromXScale="0.0"
android:fromYScale="1.0"
android:toXScale="1.0"
android:toYScale="1.0" />
</set>
Geser ke kiri
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/linear_interpolator">
<scale android:duration="800"
android:fromXScale="1.0"
android:fromYScale="1.0"
android:toXScale="0.0"
android:toYScale="1.0" />
</set>
itu adalah
contoh dan cara membuat transisi animasi di aplikasi android
semoga ilmunya
bermanfaat dan selamat mencoba .
0 Response to "Contoh dan cara membuat transisi animasi di aplikasi android"
Post a Comment