Unified card settings and pay with card into 1 page and redsigned it
This commit is contained in:
@@ -0,0 +1,194 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<FrameLayout
|
||||
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:background="?attr/colorSurface">
|
||||
|
||||
<!-- Main content when cards exist -->
|
||||
<LinearLayout
|
||||
android:id="@+id/contentLayout"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="match_parent"
|
||||
android:orientation="vertical"
|
||||
android:visibility="gone">
|
||||
|
||||
<!-- Top spacer: pushes card to vertical center -->
|
||||
<View
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="0dp"
|
||||
android:layout_weight="1" />
|
||||
|
||||
<!-- Horizontal card stack. Width/padding set programmatically for centering + peek. -->
|
||||
<androidx.recyclerview.widget.RecyclerView
|
||||
android:id="@+id/rvCards"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:clipToPadding="false"
|
||||
android:overScrollMode="never" />
|
||||
|
||||
<!-- Page indicator dots -->
|
||||
<LinearLayout
|
||||
android:id="@+id/pageIndicator"
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_gravity="center_horizontal"
|
||||
android:orientation="horizontal"
|
||||
android:paddingTop="12dp"
|
||||
android:paddingBottom="2dp" />
|
||||
|
||||
<!-- Selected card type / product name -->
|
||||
<TextView
|
||||
android:id="@+id/tvSelectedCardType"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:gravity="center"
|
||||
android:paddingHorizontal="16dp"
|
||||
android:paddingTop="6dp"
|
||||
android:paddingBottom="2dp"
|
||||
android:textAppearance="?attr/textAppearanceLabelLarge"
|
||||
android:textColor="?attr/colorOnSurfaceVariant" />
|
||||
|
||||
<!-- Flexible spacer: absorbs remaining space, pushes buttons to bottom -->
|
||||
<View
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="0dp"
|
||||
android:layout_weight="1" />
|
||||
|
||||
<!-- Divider -->
|
||||
<View
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="1dp"
|
||||
android:layout_marginHorizontal="24dp"
|
||||
android:layout_marginBottom="4dp"
|
||||
android:background="?attr/colorOutlineVariant" />
|
||||
|
||||
<!-- Primary pay actions -->
|
||||
<LinearLayout
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:orientation="horizontal"
|
||||
android:paddingHorizontal="16dp"
|
||||
android:paddingTop="8dp"
|
||||
android:paddingBottom="4dp">
|
||||
|
||||
<com.google.android.material.button.MaterialButton
|
||||
android:id="@+id/btnScanToPay"
|
||||
style="@style/Widget.Material3.Button.TonalButton"
|
||||
android:layout_width="0dp"
|
||||
android:layout_weight="1"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_marginEnd="8dp"
|
||||
android:minWidth="0dp"
|
||||
android:minHeight="0dp"
|
||||
android:paddingTop="14dp"
|
||||
android:paddingBottom="14dp"
|
||||
android:text="@string/card_pay_qr"
|
||||
android:textSize="13sp"
|
||||
app:icon="@drawable/ic_qr_scan"
|
||||
app:iconSize="22dp"
|
||||
app:iconGravity="top"
|
||||
app:iconPadding="6dp" />
|
||||
|
||||
<com.google.android.material.button.MaterialButton
|
||||
android:id="@+id/btnTapToPay"
|
||||
style="@style/Widget.Material3.Button.TonalButton"
|
||||
android:layout_width="0dp"
|
||||
android:layout_weight="1"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_marginStart="8dp"
|
||||
android:minWidth="0dp"
|
||||
android:minHeight="0dp"
|
||||
android:paddingTop="14dp"
|
||||
android:paddingBottom="14dp"
|
||||
android:text="@string/card_pay_nfc"
|
||||
android:textSize="13sp"
|
||||
app:icon="@drawable/ic_nfc"
|
||||
app:iconSize="22dp"
|
||||
app:iconGravity="top"
|
||||
app:iconPadding="6dp" />
|
||||
|
||||
</LinearLayout>
|
||||
|
||||
<!-- Secondary card management actions -->
|
||||
<LinearLayout
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:orientation="horizontal"
|
||||
android:paddingHorizontal="8dp"
|
||||
android:paddingTop="4dp"
|
||||
android:paddingBottom="8dp">
|
||||
|
||||
<com.google.android.material.button.MaterialButton
|
||||
android:id="@+id/btnChangePin"
|
||||
style="@style/Widget.Material3.Button.TextButton"
|
||||
android:layout_width="0dp"
|
||||
android:layout_weight="1"
|
||||
android:layout_height="wrap_content"
|
||||
android:minWidth="0dp"
|
||||
android:minHeight="0dp"
|
||||
android:text="@string/card_action_change_pin"
|
||||
android:textSize="11sp"
|
||||
app:icon="@drawable/ic_edit"
|
||||
app:iconSize="16dp"
|
||||
app:iconPadding="3dp" />
|
||||
|
||||
<com.google.android.material.button.MaterialButton
|
||||
android:id="@+id/btnFreeze"
|
||||
style="@style/Widget.Material3.Button.TextButton"
|
||||
android:layout_width="0dp"
|
||||
android:layout_weight="1"
|
||||
android:layout_height="wrap_content"
|
||||
android:minWidth="0dp"
|
||||
android:minHeight="0dp"
|
||||
android:text="@string/card_action_freeze"
|
||||
android:textSize="11sp"
|
||||
app:icon="@drawable/ic_freeze"
|
||||
app:iconSize="16dp"
|
||||
app:iconPadding="3dp" />
|
||||
|
||||
<com.google.android.material.button.MaterialButton
|
||||
android:id="@+id/btnBlock"
|
||||
style="@style/Widget.Material3.Button.TextButton"
|
||||
android:layout_width="0dp"
|
||||
android:layout_weight="1"
|
||||
android:layout_height="wrap_content"
|
||||
android:minWidth="0dp"
|
||||
android:minHeight="0dp"
|
||||
android:text="@string/card_action_block"
|
||||
android:textSize="11sp"
|
||||
app:icon="@drawable/ic_block"
|
||||
app:iconSize="16dp"
|
||||
app:iconPadding="3dp" />
|
||||
|
||||
</LinearLayout>
|
||||
|
||||
</LinearLayout>
|
||||
|
||||
<!-- Loading state -->
|
||||
<LinearLayout
|
||||
android:id="@+id/loadingView"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="match_parent"
|
||||
android:gravity="center"
|
||||
android:orientation="vertical"
|
||||
android:visibility="gone">
|
||||
<ProgressBar
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_height="wrap_content" />
|
||||
</LinearLayout>
|
||||
|
||||
<!-- Empty state -->
|
||||
<TextView
|
||||
android:id="@+id/emptyView"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="match_parent"
|
||||
android:gravity="center"
|
||||
android:text="@string/cards_empty"
|
||||
android:textAppearance="?attr/textAppearanceBodyMedium"
|
||||
android:textColor="?attr/colorOnSurfaceVariant"
|
||||
android:visibility="gone" />
|
||||
|
||||
|
||||
</FrameLayout>
|
||||
@@ -0,0 +1,79 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<com.google.android.material.card.MaterialCardView
|
||||
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="wrap_content"
|
||||
android:layout_marginHorizontal="6dp"
|
||||
app:cardCornerRadius="16dp"
|
||||
app:cardElevation="6dp">
|
||||
|
||||
<FrameLayout
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content">
|
||||
|
||||
<ImageView
|
||||
android:id="@+id/ivCardImage"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:scaleType="fitCenter"
|
||||
android:adjustViewBounds="true"
|
||||
android:contentDescription="@string/nav_pay_with_card" />
|
||||
|
||||
<!-- Bottom gradient for text legibility -->
|
||||
<View
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="80dp"
|
||||
android:layout_gravity="bottom"
|
||||
android:background="@drawable/bg_card_overlay_gradient" />
|
||||
|
||||
<!-- Status badge (top-right) -->
|
||||
<TextView
|
||||
android:id="@+id/tvCardStatus"
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_gravity="top|end"
|
||||
android:layout_margin="8dp"
|
||||
android:paddingStart="6dp"
|
||||
android:paddingEnd="6dp"
|
||||
android:paddingTop="2dp"
|
||||
android:paddingBottom="2dp"
|
||||
android:textSize="9sp"
|
||||
android:textColor="#FFFFFF"
|
||||
android:textStyle="bold"
|
||||
android:visibility="gone" />
|
||||
|
||||
<!-- Card owner name + masked number (bottom-left) -->
|
||||
<LinearLayout
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_gravity="bottom|start"
|
||||
android:orientation="vertical"
|
||||
android:padding="12dp">
|
||||
|
||||
<TextView
|
||||
android:id="@+id/tvCardOwner"
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_height="wrap_content"
|
||||
android:textAppearance="?attr/textAppearanceLabelMedium"
|
||||
android:textColor="#FFFFFF"
|
||||
android:textStyle="bold"
|
||||
android:shadowColor="#80000000"
|
||||
android:shadowDx="1"
|
||||
android:shadowDy="1"
|
||||
android:shadowRadius="3" />
|
||||
|
||||
<TextView
|
||||
android:id="@+id/tvCardNumber"
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_marginTop="2dp"
|
||||
android:textAppearance="?attr/textAppearanceBodySmall"
|
||||
android:textColor="#CCFFFFFF"
|
||||
android:fontFamily="monospace" />
|
||||
|
||||
</LinearLayout>
|
||||
|
||||
</FrameLayout>
|
||||
|
||||
</com.google.android.material.card.MaterialCardView>
|
||||
@@ -32,9 +32,6 @@
|
||||
<item android:id="@+id/nav_pay_with_card"
|
||||
android:icon="@drawable/ic_nav_card"
|
||||
android:title="@string/nav_pay_with_card" />
|
||||
<item android:id="@+id/nav_card_settings"
|
||||
android:icon="@drawable/ic_nav_card"
|
||||
android:title="@string/nav_card_settings" />
|
||||
</group>
|
||||
|
||||
<group android:id="@+id/group_system" android:checkableBehavior="single">
|
||||
|
||||
@@ -15,9 +15,6 @@
|
||||
<item android:id="@+id/nav_pay_with_card"
|
||||
android:icon="@drawable/ic_nav_card"
|
||||
android:title="@string/nav_pay_with_card" />
|
||||
<item android:id="@+id/nav_card_settings"
|
||||
android:icon="@drawable/ic_nav_card"
|
||||
android:title="@string/nav_card_settings" />
|
||||
<item android:id="@+id/nav_otp"
|
||||
android:icon="@drawable/ic_nav_otp"
|
||||
android:title="@string/nav_otp" />
|
||||
|
||||
@@ -72,7 +72,8 @@
|
||||
<string name="nav_activities">ހަރަކާތްތައް</string>
|
||||
<string name="nav_transfer_history">ޓްރާންސެކްޝަން ތާރީހް</string>
|
||||
<string name="nav_finances">ފައިނޭންސް</string>
|
||||
<string name="nav_card_settings">ކާޑް ސެޓިންގ</string>
|
||||
<string name="nav_pay_with_card">ކާޑްތައް</string>
|
||||
<string name="nav_desc_pay_with_card">ކާޑް މެނޭޖްކޮށް ފައިސާ ދައްކާ</string>
|
||||
<string name="nav_settings">ސެޓިންގ</string>
|
||||
<string name="nav_desc_accounts">ހުރިހާ ބޭންކް އެކައުންޓްތައް ބަލާ</string>
|
||||
<string name="nav_desc_contacts">ޓްރާންސްފަ ކޮންޓެކްޓްތައް މެނޭޖް ކުރޭ</string>
|
||||
@@ -81,8 +82,6 @@
|
||||
<string name="nav_desc_activities">ފަހުގެ ޓްރާންސްފަތައް ބަލާ</string>
|
||||
<string name="nav_desc_transfer_history">އެކައުންޓް ތަކުގެ ޓްރާންސެކްޝަން ތާރީހް</string>
|
||||
<string name="nav_desc_finances">ލޯން އަދި ފައިނޭންސިންގ</string>
|
||||
<string name="nav_desc_pay_with_card">ކާޑް ބޭނުންކޮށް ފައިސާ ދައްކާ</string>
|
||||
<string name="nav_desc_card_settings">ކާޑް ސެޓިންގ މެނޭޖް ކުރޭ</string>
|
||||
<string name="nav_desc_otp">OTP ކޯޑް ތައްޔާރު ކުރޭ</string>
|
||||
<string name="nav_desc_settings">އެޕްލިކޭޝަންގެ ތަރުތީބު</string>
|
||||
<string name="nav_open_drawer">ނެވިގޭޝަން ހުޅުވާ</string>
|
||||
|
||||
@@ -93,8 +93,7 @@
|
||||
<string name="nav_desc_activities">View your recent transfers</string>
|
||||
<string name="nav_desc_transfer_history">Full transaction history by account</string>
|
||||
<string name="nav_desc_finances">Loans and financing overview</string>
|
||||
<string name="nav_desc_pay_with_card">Make a payment using your card</string>
|
||||
<string name="nav_desc_card_settings">Manage your card preferences</string>
|
||||
<string name="nav_desc_pay_with_card">Manage and pay with your cards</string>
|
||||
<string name="nav_desc_otp">Generate OTP codes for authentication</string>
|
||||
<string name="nav_desc_settings">App preferences and configuration</string>
|
||||
<string name="nav_open_drawer">Open navigation</string>
|
||||
@@ -311,9 +310,9 @@
|
||||
<string name="loan_rate_fmt">%.2f%%</string>
|
||||
|
||||
<!-- Cards -->
|
||||
<string name="nav_pay_with_card">Pay with Card</string>
|
||||
<string name="card_pay_qr">QR Pay</string>
|
||||
<string name="card_pay_nfc">NFC Pay</string>
|
||||
<string name="nav_pay_with_card">Cards</string>
|
||||
<string name="card_pay_qr">Scan to Pay</string>
|
||||
<string name="card_pay_nfc">Tap to Pay</string>
|
||||
<string name="mib_qr_nfc_not_supported">Skill issue on MIB side, Not supported</string>
|
||||
<string name="card_action_change_pin">Change PIN</string>
|
||||
<string name="card_action_freeze">Freeze</string>
|
||||
|
||||
Reference in New Issue
Block a user