New card layout

app/src/main/java/protect/card_locker/LoyaltyCardCursorAdapter.java

@@ -75,15 +75,6 @@ public class LoyaltyCardCursorAdapter extends BaseCursorAdapter<LoyaltyCardCurso
         // Invisible until we want to show something more
         inputHolder.mDivider.setVisibility(View.GONE);
 
-        // remove outline shadow
-        inputHolder.mThumbnailContainer.setOutlineProvider(new ViewOutlineProvider() {
-            @Override
-            public void getOutline(View view, Outline outline) {
-                ViewOutlineProvider.BACKGROUND.getOutline(view, outline);
-                outline.setAlpha(0f);
-            }
-        });
-
         int size = mSettings.getFontSizeMax(mSettings.getSmallFont());
 
         if (mDarkModeEnabled) {
@@ -143,43 +134,12 @@ public class LoyaltyCardCursorAdapter extends BaseCursorAdapter<LoyaltyCardCurso
             inputHolder.mCardIcon.setBackgroundColor(Color.TRANSPARENT);
         } else {
             inputHolder.mCardIcon.setImageBitmap(Utils.generateIcon(mContext, loyaltyCard.store, loyaltyCard.headerColor).getLetterTile());
-            if (loyaltyCard.headerColor != null) {
-                inputHolder.mCardIcon.setBackgroundColor(loyaltyCard.headerColor);
-            }
+        }
+        if (loyaltyCard.headerColor != null) {
+            inputHolder.mIconLayout.setBackgroundColor(loyaltyCard.headerColor);
         }
 
         inputHolder.mStarIcon.setVisibility(loyaltyCard.starStatus != 0 ? View.VISIBLE : View.GONE);
-        int imageSize = dpToPx((size * 46) / 14, mContext);
-        inputHolder.mCardIcon.getLayoutParams().height = imageSize;
-        inputHolder.mCardIcon.getLayoutParams().width = imageSize;
-        inputHolder.mStarIcon.getLayoutParams().height = imageSize;
-        inputHolder.mStarIcon.getLayoutParams().width = imageSize;
-        inputHolder.mTickIcon.getLayoutParams().height = imageSize;
-        inputHolder.mTickIcon.getLayoutParams().width = imageSize;
-
-        /* Changing Padding and Mragin of different views according to font size
-         * Views Included:
-         * a) InformationContainer padding
-         * b) Store left padding
-         * c) Divider Margin
-         * d) note top margin
-         * e) row margin
-         * */
-        int marginPaddingSize = dpToPx((size * 16) / 14, mContext);
-        inputHolder.mInformationContainer.setPadding(marginPaddingSize, marginPaddingSize, marginPaddingSize, marginPaddingSize);
-        inputHolder.mStoreField.setPadding(marginPaddingSize, 0, 0, 0);
-        LinearLayout.LayoutParams lpDivider = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT,
-                LinearLayout.LayoutParams.WRAP_CONTENT);
-        lpDivider.setMargins(0, marginPaddingSize, 0, marginPaddingSize);
-        inputHolder.mDivider.setLayoutParams(lpDivider);
-        LinearLayout.LayoutParams lpNoteField = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT,
-                LinearLayout.LayoutParams.WRAP_CONTENT);
-        lpNoteField.setMargins(0, marginPaddingSize / 2, 0, 0);
-        inputHolder.mNoteField.setLayoutParams(lpNoteField);
-        LinearLayout.LayoutParams lpRow = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT,
-                LinearLayout.LayoutParams.WRAP_CONTENT);
-        lpRow.setMargins(marginPaddingSize / 2, marginPaddingSize / 2, marginPaddingSize / 2, marginPaddingSize / 2);
-        inputHolder.mRow.setLayoutParams(lpRow);
 
         inputHolder.itemView.setActivated(mSelectedItems.get(inputCursor.getPosition(), false));
         applyIconAnimation(inputHolder, inputCursor.getPosition());
@@ -188,38 +148,29 @@ public class LoyaltyCardCursorAdapter extends BaseCursorAdapter<LoyaltyCardCurso
 
     private void applyClickEvents(LoyaltyCardListItemViewHolder inputHolder, final int inputPosition) {
         inputHolder.mRow.setOnClickListener(inputView -> mListener.onRowClicked(inputPosition));
-        inputHolder.mInformationContainer.setOnClickListener(inputView -> mListener.onRowClicked(inputPosition));
 
         inputHolder.mRow.setOnLongClickListener(inputView -> {
             mListener.onRowLongClicked(inputPosition);
             inputView.performHapticFeedback(HapticFeedbackConstants.LONG_PRESS);
             return true;
         });
-
-        inputHolder.mInformationContainer.setOnLongClickListener(inputView -> {
-            mListener.onRowLongClicked(inputPosition);
-            inputView.performHapticFeedback(HapticFeedbackConstants.LONG_PRESS);
-            return true;
-        });
     }
 
     private void applyIconAnimation(LoyaltyCardListItemViewHolder inputHolder, int inputPosition) {
         if (mSelectedItems.get(inputPosition, false)) {
-            inputHolder.mThumbnailFrontContainer.setVisibility(View.GONE);
-            resetIconYAxis(inputHolder.mThumbnailBackContainer);
-            inputHolder.mThumbnailBackContainer.setVisibility(View.VISIBLE);
-            inputHolder.mThumbnailBackContainer.setAlpha(1);
+            inputHolder.mCardIcon.setVisibility(View.GONE);
+            resetIconYAxis(inputHolder.mTickIcon);
+            inputHolder.mTickIcon.setVisibility(View.VISIBLE);
             if (mCurrentSelectedIndex == inputPosition) {
-                LoyaltyCardAnimator.flipView(mContext, inputHolder.mThumbnailBackContainer, inputHolder.mThumbnailFrontContainer, true);
+                LoyaltyCardAnimator.flipView(mContext, inputHolder.mTickIcon, inputHolder.mCardIcon, true);
                 resetCurrentIndex();
             }
         } else {
-            inputHolder.mThumbnailBackContainer.setVisibility(View.GONE);
-            resetIconYAxis(inputHolder.mThumbnailFrontContainer);
-            inputHolder.mThumbnailFrontContainer.setVisibility(View.VISIBLE);
-            inputHolder.mThumbnailFrontContainer.setAlpha(1);
+            inputHolder.mTickIcon.setVisibility(View.GONE);
+            resetIconYAxis(inputHolder.mCardIcon);
+            inputHolder.mCardIcon.setVisibility(View.VISIBLE);
             if ((mReverseAllAnimations && mAnimationItemsIndex.get(inputPosition, false)) || mCurrentSelectedIndex == inputPosition) {
-                LoyaltyCardAnimator.flipView(mContext, inputHolder.mThumbnailBackContainer, inputHolder.mThumbnailFrontContainer, false);
+                LoyaltyCardAnimator.flipView(mContext, inputHolder.mTickIcon, inputHolder.mCardIcon, false);
                 resetCurrentIndex();
             }
         }
@@ -285,25 +236,20 @@ public class LoyaltyCardCursorAdapter extends BaseCursorAdapter<LoyaltyCardCurso
     public static class LoyaltyCardListItemViewHolder extends RecyclerView.ViewHolder {
 
         public TextView mStoreField, mNoteField, mBalanceField, mExpiryField;
-        public LinearLayout mInformationContainer;
         public ImageView mCardIcon, mStarIcon, mTickIcon;
-        public MaterialCardView mRow;
+        public MaterialCardView mIconLayout, mRow;
         public View mDivider;
-        public RelativeLayout mThumbnailFrontContainer, mThumbnailBackContainer;
-        public MaterialCardView mThumbnailContainer;
 
         public LoyaltyCardListItemViewHolder(View inputView, CardAdapterListener inputListener) {
             super(inputView);
             mRow = inputView.findViewById(R.id.row);
+            mIconLayout = inputView.findViewById(R.id.icon_layout);
             mDivider = inputView.findViewById(R.id.info_divider);
-            mThumbnailContainer = inputView.findViewById(R.id.thumbnail_container);
-            mThumbnailFrontContainer = inputView.findViewById(R.id.thumbnail_front);
-            mThumbnailBackContainer = inputView.findViewById(R.id.thumbnail_back);
-            mInformationContainer = inputView.findViewById(R.id.information_container);
             mStoreField = inputView.findViewById(R.id.store);
             mNoteField = inputView.findViewById(R.id.note);
             mBalanceField = inputView.findViewById(R.id.balance);
             mExpiryField = inputView.findViewById(R.id.expiry);
+
             mCardIcon = inputView.findViewById(R.id.thumbnail);
             mStarIcon = inputView.findViewById(R.id.star);
             mTickIcon = inputView.findViewById(R.id.selected_thumbnail);

app/src/main/res/layout/content_main.xml

@@ -38,7 +38,7 @@
 
     <androidx.recyclerview.widget.RecyclerView
         android:id="@+id/list"
-        app:layoutManager="androidx.recyclerview.widget.StaggeredGridLayoutManager"
+        app:layoutManager="androidx.recyclerview.widget.GridLayoutManager"
         app:spanCount="@integer/main_view_card_columns"
         android:layout_width="match_parent"
         android:layout_height="match_parent"

app/src/main/res/layout/loyalty_card_layout.xml

@@ -1,146 +1,140 @@
 <?xml version="1.0" encoding="utf-8"?>
-<com.google.android.material.card.MaterialCardView
-    xmlns:android="http://schemas.android.com/apk/res/android"
+<com.google.android.material.card.MaterialCardView 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:id="@+id/row"
-    android:orientation="horizontal"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     android:layout_margin="8dp">
 
-    <LinearLayout
+    <androidx.constraintlayout.widget.ConstraintLayout
         android:layout_width="match_parent"
-        android:layout_height="wrap_content"
-        android:orientation="vertical">
+        android:layout_height="wrap_content">
 
-        <LinearLayout
-            android:id="@+id/information_container"
+        <com.google.android.material.card.MaterialCardView
+            android:id="@+id/icon_layout"
+            android:layout_width="match_parent"
+            android:layout_height="0dp"
+            app:layout_constraintDimensionRatio="2:1"
+            app:cardCornerRadius="8dp"
+            app:layout_constraintTop_toTopOf="parent"
+            app:layout_constraintBottom_toTopOf="@+id/store">
+
+            <ImageView
+                android:id="@+id/thumbnail"
+                android:scaleType="fitCenter"
+                android:layout_width="match_parent"
+                android:layout_height="match_parent"
+                android:contentDescription="@string/thumbnailDescription"
+                android:src="@mipmap/ic_launcher"
+                app:layout_constraintTop_toTopOf="parent"
+                app:layout_constraintBottom_toBottomOf="parent"
+                app:layout_constraintEnd_toEndOf="parent"
+                app:layout_constraintStart_toStartOf="parent" />
+
+            <ImageView
+                android:id="@+id/selected_thumbnail"
+                android:scaleType="fitCenter"
+                android:layout_width="match_parent"
+                android:layout_height="match_parent"
+                android:contentDescription="@string/thumbnailDescription"
+                app:srcCompat="@drawable/ic_done"
+                app:layout_constraintTop_toTopOf="parent"
+                app:layout_constraintBottom_toBottomOf="parent"
+                app:layout_constraintEnd_toEndOf="parent"
+                app:layout_constraintStart_toStartOf="parent"/>
+
+            <ImageView
+                android:id="@+id/star"
+                android:layout_width="@dimen/cardThumbnailSize"
+                android:layout_height="@dimen/cardThumbnailSize"
+                android:layout_gravity="end"
+                app:srcCompat="@drawable/ic_starred_white"
+                android:contentDescription="@string/starImage"
+                app:tint="?attr/colorControlNormal"
+                android:visibility="gone"
+                tools:visibility="visible"
+                android:elevation="4dp"
+                app:layout_constraintTop_toTopOf="parent"
+                app:layout_constraintEnd_toEndOf="parent" />
+        </com.google.android.material.card.MaterialCardView>
+
+        <TextView
+            android:id="@+id/store"
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
-            android:orientation="vertical"
-            android:padding="16dp">
+            android:layout_marginStart="4dp"
+            android:layout_marginEnd="4dp"
+            android:textAppearance="?attr/textAppearanceHeadline2"
+            app:layout_constraintTop_toBottomOf="@+id/icon_layout"
+            app:layout_constraintBottom_toTopOf="@+id/note"
+            app:layout_constraintEnd_toEndOf="parent"
+            app:layout_constraintStart_toStartOf="parent"
+            tools:text="Example store"/>
 
-            <RelativeLayout
-                android:layout_width="match_parent"
-                android:layout_height="wrap_content"
-                android:orientation="horizontal">
+        <TextView
+            android:id="@+id/note"
+            android:layout_width="match_parent"
+            android:layout_height="wrap_content"
+            android:layout_marginStart="4dp"
+            android:layout_marginEnd="4dp"
+            android:textAppearance="?attr/textAppearanceBody2"
+            android:textColor="?android:attr/textColorSecondary"
+            android:visibility="gone"
+            tools:visibility="visible"
+            app:layout_constraintTop_toBottomOf="@+id/store"
+            app:layout_constraintBottom_toTopOf="@+id/info_divider"
+            app:layout_constraintEnd_toEndOf="parent"
+            app:layout_constraintStart_toStartOf="parent"
+            tools:text="Example note"/>
 
-                <com.google.android.material.card.MaterialCardView
-                    android:id="@+id/thumbnail_container"
-                    android:layout_width="wrap_content"
-                    android:layout_height="wrap_content"
-                    app:cardCornerRadius="4dp"
-                    android:layout_alignParentStart="true"
-                    android:layout_centerVertical="true"
-                    app:cardBackgroundColor="@android:color/transparent">
+        <View
+            android:id="@+id/info_divider"
+            android:layout_width="match_parent"
+            android:layout_height="1dp"
+            android:layout_margin="4dp"
+            android:background="?android:attr/dividerVertical"
+            android:visibility="gone"
+            tools:visibility="visible"
+            app:layout_constraintTop_toBottomOf="@+id/note"
+            app:layout_constraintBottom_toTopOf="@+id/balance"
+            app:layout_constraintEnd_toEndOf="parent"
+            app:layout_constraintStart_toStartOf="parent"/>
 
-                    <RelativeLayout
-                        android:id="@+id/thumbnail_front"
-                        android:layout_width="wrap_content"
-                        android:layout_height="wrap_content"
-                        android:layout_alignTop="@+id/storeContainer"
-                        android:layout_alignBottom="@+id/storeContainer"
-                        android:layout_gravity="center_vertical">
+        <TextView
+            android:id="@+id/balance"
+            android:layout_width="match_parent"
+            android:layout_height="wrap_content"
+            android:layout_marginStart="4dp"
+            android:layout_marginEnd="4dp"
+            android:textAppearance="?attr/textAppearanceBody2"
+            android:textColor="?android:attr/textColorSecondary"
+            app:drawableLeftCompat="@drawable/ic_baseline_payments_24"
+            android:drawablePadding="4dp"
+            android:visibility="gone"
+            app:layout_constraintTop_toBottomOf="@+id/info_divider"
+            app:layout_constraintBottom_toTopOf="@+id/expiry"
+            app:layout_constraintEnd_toEndOf="parent"
+            app:layout_constraintStart_toStartOf="parent"
+            tools:visibility="visible"
+            tools:text="525 points"/>
 
-                        <ImageView
-                            android:id="@+id/thumbnail"
-                            android:scaleType="fitCenter"
-                            android:layout_width="@dimen/cardThumbnailSize"
-                            android:layout_height="@dimen/cardThumbnailSize"
-                            android:layout_centerVertical="true"
-                            android:contentDescription="@string/thumbnailDescription"
-                            android:src="@mipmap/ic_launcher" />
-
-                    </RelativeLayout>
-
-                    <RelativeLayout
-                        android:id="@+id/thumbnail_back"
-                        android:layout_width="wrap_content"
-                        android:layout_height="wrap_content"
-                        android:layout_gravity="center_vertical">
-
-                        <ImageView
-                            android:id="@+id/selected_thumbnail"
-                            android:layout_width="@dimen/cardThumbnailSize"
-                            android:layout_height="@dimen/cardThumbnailSize"
-                            android:layout_centerInParent="true"
-                            android:contentDescription="@string/thumbnailDescription"
-                            android:scaleType="centerCrop"
-                            app:srcCompat="@drawable/ic_done" />
-
-                    </RelativeLayout>
-                </com.google.android.material.card.MaterialCardView>
-
-                <TextView
-                    android:id="@+id/store"
-                    android:paddingStart="16dp"
-                    android:layout_width="wrap_content"
-                    android:layout_height="wrap_content"
-                    android:gravity="left"
-                    android:layout_toRightOf="@+id/thumbnail_container"
-                    android:layout_toLeftOf="@+id/star"
-                    android:textAppearance="?attr/textAppearanceHeadline6" />
-
-                <ImageView
-                    android:id="@+id/star"
-                    android:layout_width="@dimen/cardThumbnailSize"
-                    android:layout_height="@dimen/cardThumbnailSize"
-                    android:layout_centerVertical="true"
-                    android:scaleType="centerCrop"
-                    app:srcCompat="@drawable/ic_starred_white"
-                    android:contentDescription="@string/starImage"
-                    app:tint="?attr/colorControlNormal"
-                    android:layout_alignParentEnd="true"
-                    android:visibility="gone" />
-            </RelativeLayout>
-
-            <TextView
-                android:id="@+id/note"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:textAppearance="?attr/textAppearanceBody2"
-                android:textColor="?android:attr/textColorSecondary"
-                android:visibility="gone" />
-
-            <View android:id="@+id/info_divider"
-                android:layout_width="match_parent"
-                android:layout_height="1dp"
-                android:layout_marginTop="16dp"
-                android:layout_marginBottom="16dp"
-                android:background="?android:attr/dividerVertical"
-                android:visibility="gone" />
-
-            <RelativeLayout
-                android:layout_width="match_parent"
-                android:layout_height="wrap_content"
-                android:orientation="horizontal">
-                <TextView
-                    android:id="@+id/balance"
-                    android:layout_width="wrap_content"
-                    android:layout_height="wrap_content"
-                    android:layout_centerVertical="true"
-                    android:gravity="center_vertical"
-                    android:paddingEnd="8dp"
-                    android:textAppearance="?attr/textAppearanceBody2"
-                    android:textColor="?android:attr/textColorSecondary"
-                    app:drawableLeftCompat="@drawable/ic_baseline_payments_24"
-                    android:drawablePadding="4dp"
-                    android:layout_alignParentStart="true"
-                    android:visibility="gone" />
-                <TextView
-                    android:id="@+id/expiry"
-                    android:layout_width="wrap_content"
-                    android:layout_height="wrap_content"
-                    android:layout_centerVertical="true"
-                    android:gravity="center_vertical"
-                    android:textAppearance="?attr/textAppearanceBody2"
-                    android:textColor="?android:attr/textColorSecondary"
-                    app:drawableLeftCompat="@drawable/ic_baseline_access_time_24"
-                    android:drawablePadding="4dp"
-                    android:layout_toEndOf="@+id/balance"
-                    android:visibility="gone" />
-            </RelativeLayout>
-        </LinearLayout>
-    </LinearLayout>
+        <TextView
+            android:id="@+id/expiry"
+            android:layout_width="match_parent"
+            android:layout_height="wrap_content"
+            android:layout_marginStart="4dp"
+            android:layout_marginEnd="4dp"
+            android:textAppearance="?attr/textAppearanceBody2"
+            android:textColor="?android:attr/textColorSecondary"
+            app:drawableLeftCompat="@drawable/ic_baseline_access_time_24"
+            android:drawablePadding="4dp"
+            android:visibility="gone"
+            app:layout_constraintTop_toBottomOf="@+id/balance"
+            app:layout_constraintBottom_toBottomOf="parent"
+            app:layout_constraintEnd_toEndOf="parent"
+            app:layout_constraintStart_toStartOf="parent"
+            tools:visibility="visible"
+            tools:text="Tomorrow"/>
+    </androidx.constraintlayout.widget.ConstraintLayout>
 </com.google.android.material.card.MaterialCardView>

app/src/main/res/values-w600dp/integers.xml

@@ -1,4 +1,4 @@
 <?xml version="1.0" encoding="utf-8"?>
 <resources>
-    <integer name="main_view_card_columns">2</integer>
+    <integer name="main_view_card_columns">3</integer>
 </resources>

app/src/main/res/values/integers.xml

@@ -1,4 +1,4 @@
 <?xml version="1.0" encoding="utf-8"?>
 <resources>
-    <integer name="main_view_card_columns">1</integer>
+    <integer name="main_view_card_columns">2</integer>
 </resources>