allbest/edc-monitoring-android-app
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

improve payment success UI

Browse Source
This commit is contained in:
riz081 2025-05-30 14:59:46 +07:00
parent 46fb81b6a7
commit 191966a2e4
3 changed files with 84 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

88
app/src/main/java/com/example/bdkipoc/PinActivity.java
View File

@ -301,7 +301,7 @@ public class PinActivity extends AppCompatActivity {
// In real implementation, this would call backend API
if (isValidPin(pin)) {
// Don't show toast, show success screen instead
// Show success screen instead of toast
handleSuccessfulVerification();
} else {
showToast("PIN tidak valid. Silakan coba lagi.");
@ -323,38 +323,100 @@ public class PinActivity extends AppCompatActivity {
// Show full screen success message
showSuccessScreen();
// Navigate to receipt page after 2-3 seconds
// Navigate to receipt page after 2.5 seconds
animationHandler.postDelayed(() -> {
navigateToReceiptPage();
}, 2500); // 2.5 seconds delay
}, 2500);
}
private void showSuccessScreen() {
if (successScreen != null) {
// Hide all other UI components first
hideMainUIComponents();
// Set success message
if (successMessage != null) {
successMessage.setText("Pembayaran berhasil!");
successMessage.setText("Pembayaran Berhasil");
}
// Show success screen with fade in animation
successScreen.setVisibility(View.VISIBLE);
successScreen.setAlpha(0f);
ObjectAnimator fadeIn = ObjectAnimator.ofFloat(successScreen, "alpha", 0f, 1f);
fadeIn.setDuration(500);
fadeIn.start();
// Fade in the background
ObjectAnimator backgroundFadeIn = ObjectAnimator.ofFloat(successScreen, "alpha", 0f, 1f);
backgroundFadeIn.setDuration(500);
backgroundFadeIn.start();
// Add scale animation to success icon
// Add scale and bounce animation to success icon
if (successIcon != null) {
ObjectAnimator scaleX = ObjectAnimator.ofFloat(successIcon, "scaleX", 0f, 1f);
ObjectAnimator scaleY = ObjectAnimator.ofFloat(successIcon, "scaleY", 0f, 1f);
// Start with invisible icon
successIcon.setScaleX(0f);
successIcon.setScaleY(0f);
successIcon.setAlpha(0f);
// Scale animation with bounce effect
ObjectAnimator scaleX = ObjectAnimator.ofFloat(successIcon, "scaleX", 0f, 1.2f, 1f);
ObjectAnimator scaleY = ObjectAnimator.ofFloat(successIcon, "scaleY", 0f, 1.2f, 1f);
ObjectAnimator iconFadeIn = ObjectAnimator.ofFloat(successIcon, "alpha", 0f, 1f);
AnimatorSet iconAnimation = new AnimatorSet();
iconAnimation.playTogether(scaleX, scaleY);
iconAnimation.setDuration(600);
iconAnimation.setStartDelay(200);
iconAnimation.playTogether(scaleX, scaleY, iconFadeIn);
iconAnimation.setDuration(800);
iconAnimation.setStartDelay(300);
iconAnimation.setInterpolator(new android.view.animation.OvershootInterpolator(1.2f));
iconAnimation.start();
}
// Add slide up animation to success message
if (successMessage != null) {
successMessage.setAlpha(0f);
successMessage.setTranslationY(50f);
ObjectAnimator messageSlideUp = ObjectAnimator.ofFloat(successMessage, "translationY", 50f, 0f);
ObjectAnimator messageFadeIn = ObjectAnimator.ofFloat(successMessage, "alpha", 0f, 1f);
AnimatorSet messageAnimation = new AnimatorSet();
messageAnimation.playTogether(messageSlideUp, messageFadeIn);
messageAnimation.setDuration(600);
messageAnimation.setStartDelay(600);
messageAnimation.setInterpolator(new android.view.animation.DecelerateInterpolator());
messageAnimation.start();
}
}
}
private void hideMainUIComponents() {
// Hide all main UI components to create clean full screen success
if (backNavigation != null) {
backNavigation.setVisibility(View.GONE);
}
// Hide the red header backgrounds
View redStatusBar = findViewById(R.id.red_status_bar);
View redHeaderBackground = findViewById(R.id.red_header_background);
if (redStatusBar != null) {
redStatusBar.setVisibility(View.GONE);
}
if (redHeaderBackground != null) {
redHeaderBackground.setVisibility(View.GONE);
}
// Hide PIN card
View pinCard = findViewById(R.id.pin_card);
if (pinCard != null) {
pinCard.setVisibility(View.GONE);
}
// Hide numpad
View numpadGrid = findViewById(R.id.numpad_grid);
if (numpadGrid != null) {
numpadGrid.setVisibility(View.GONE);
}
// Hide confirm button
if (confirmButton != null) {
confirmButton.setVisibility(View.GONE);
}
}

BIN
app/src/main/res/drawable/ic_success_payment.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.0 KiB

17
app/src/main/res/layout/activity_pin.xml
View File

@ -255,7 +255,7 @@
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintVertical_bias="0"/>
<!-- Success Screen (Full Screen Overlay) -->
<!-- Success Screen (Full Screen Overlay) - IMPROVED VERSION -->
<LinearLayout
android:id="@+id/success_screen"
android:layout_width="match_parent"
@ -272,23 +272,24 @@
<!-- Success Icon -->
<ImageView
android:id="@+id/success_icon"
android:layout_width="80dp"
android:layout_height="80dp"
android:src="@drawable/ic_check_circle"
android:tint="@android:color/white"
android:layout_marginBottom="24dp"/>
android:layout_width="120dp"
android:layout_height="120dp"
android:src="@drawable/ic_success_payment"
android:layout_marginBottom="32dp"
android:scaleType="centerInside"/>
<!-- Success Message -->
<TextView
android:id="@+id/success_message"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Pembayaran berhasil!"
android:text="Pembayaran Berhasil"
android:textColor="@android:color/white"
android:textSize="24sp"
android:textStyle="bold"
android:fontFamily="@font/inter"
android:gravity="center"/>
android:gravity="center"
android:letterSpacing="0.02"/>
</LinearLayout>