DEV Community: K M Rejowan Ahmmed

Android 13’s Restricted Setting: A Stronghold Against Malicious Apps

K M Rejowan Ahmmed — Sun, 09 Jul 2023 12:25:06 +0000

Dear Android users, good news is on the horizon! Google is significantly bolstering its security features with Android 13. The “Restricted Setting” feature is ready to safeguard your device from potentially harmful apps. Let’s break it down.

The Problem: Potentially Harmful Apps

There are instances when we download apps not from the official app stores, but from other sources like a browser or a messaging app. These are called sideloaded apps.

Unfortunately, not all sideloaded apps are benign. Some might have harmful intentions and could infiltrate your phone’s Accessibility settings and Notification Listener. These areas can allow apps to intercept your incoming notifications and gain access to sensitive information.

The Solution: Restricted Setting Feature

This is where the “Restricted Setting” feature steps in. It acts like a secure gatekeeper, barring any sideloaded app from accessing your Accessibility settings and Notification Listener.

The real beauty is in its alert mechanism. If Android 13 spots a potentially harmful app, it locks down the Accessibility settings for that app. A dialog pops up stating, “Restricted settings. For your security, this setting is currently unavailable”, along with an ‘OK’ button to dismiss the message. Quite a smart move!

What About Apps From The Official App Stores?

If you’re an adherent downloader from the official app stores, there’s no need for concern. These app stores utilize something called a session-based package installer. The “Restricted Setting” feature doesn’t impact apps sourced from app stores. Rest assured, you’re in safe hands here.

Is There A Way To Override The Restricted Setting?

Indeed, Google has thought of that too. Even if the “Restricted Setting” feature blocks an app, there is a way to unblock it.

You can first dismiss the restricted setting dialog by pressing ‘OK’ (which signifies your awareness of the potential risk). After this, visit the App Info page of the blocked app. From there, click on the top-right corner options menu and select ‘Allow Restricted Settings’. Be sure to use this feature cautiously, and only if you’re confident the app is safe.

And that’s it! Android 13’s “Restricted Setting” feature is a powerful ally in your fight against malicious apps.

Always remember, your data and privacy are valuable. Always download apps from trusted sources and keep your Android updated for the best protection.

Navigating Pages with Ease (Tap Left/Right) : A Custom ViewPager in Android

K M Rejowan Ahmmed — Tue, 06 Jun 2023 15:47:58 +0000

Introduction

Android provides a range of components that allow developers to create engaging and intuitive user interfaces. One such component is the ViewPager, a layout manager that allows users to flip through pages of data, akin to sliding through pages of a book. But what if we could make this navigation even more intuitive? What if a simple tap could transport you through pages? In this blog post, we'll explore how to create a custom ViewPager that responds to single-tap events for page navigation.

Purpose

The traditional ViewPager in Android responds to swipe gestures for moving between pages. However, there might be cases where you want a simpler interaction, such as a single tap. Our aim here is to create a custom ViewPager that responds to single-tap events. Tapping on the left half of the screen will take the user to the previous page, while tapping on the right half navigates to the next page.

How to Achieve That

To achieve this, we will extend the default ViewPager class and customize it to handle our desired tap events. This involves using Android's GestureDetector, which will enable us to listen for single-tap events and respond accordingly.

Code Sample

Here's a sample code of a custom ViewPager in Java:

import android.content.Context;
import android.util.AttributeSet;
import android.view.GestureDetector;
import android.view.MotionEvent;
import androidx.viewpager.widget.ViewPager;
import java.util.Objects;

public class CustomViewPager extends ViewPager {
    private GestureDetector gestureDetector;

    public CustomViewPager(Context context) {
        super(context);
        init(context);
    }

    public CustomViewPager(Context context, AttributeSet attrs) {
        super(context, attrs);
        init(context);
    }

    private void init(Context context) {
        gestureDetector = new GestureDetector(context, new GestureDetector.SimpleOnGestureListener() {
            @Override
            public boolean onSingleTapConfirmed(MotionEvent e) {
                float halfWidth = getWidth() / 2.0f;
                if (e.getX() < halfWidth) {
                    if (getCurrentItem() > 0) {
                        setCurrentItem(getCurrentItem() - 1, true);
                    }
                } else {
                    if (getCurrentItem() < Objects.requireNonNull(getAdapter()).getCount() - 1) {
                        setCurrentItem(getCurrentItem() + 1, true);
                    }
                }
                performClick();
                return super.onSingleTapConfirmed(e);
            }
        });
    }

    @Override
    public boolean onTouchEvent(MotionEvent ev) {
        performClick();
        gestureDetector.onTouchEvent(ev);
        return super.onTouchEvent(ev);
    }

    @Override
    public boolean performClick() {
        return super.performClick();
    }
}

Code Breakdown

The CustomViewPager class extends the default ViewPager and modifies its behavior through overriding certain methods and adding a GestureDetector. The GestureDetector is set up to detect single-tap events, and based on the location of the tap (left or right half of the screen), the ViewPager navigates to the previous or next page respectively. This is done in the init() method which is called from both constructors.

The onTouchEvent() is overridden to ensure that each touch event is also sent to the GestureDetector for processing, and a click action is performed for possible use by other components or accessibility services.

How to Use the Custom ViewPager

The custom ViewPager can be used in your application just like any other view component. Here's a guide on how to do it:

Java

First, you need to create an instance of the CustomViewPager in your activity and set an adapter to it:

CustomViewPager customViewPager = new CustomViewPager(this);
PagerAdapter adapter = new CustomPagerAdapter(); // This should be your custom PagerAdapter
customViewPager.setAdapter(adapter);

setContentView(customViewPager);

You can also get the current item, and set the current item programmatically:

int currentItem = customViewPager.getCurrentItem();
customViewPager.setCurrentItem(currentItem + 1, true);

XML

Alternatively, you can declare the CustomViewPager in your layout XML file and reference it in your activity:

<com.example.yourapp.CustomViewPager
    android:id="@+id/customViewPager"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

Then, in your activity:

CustomViewPager customViewPager = (CustomViewPager) findViewById(R.id.customViewPager);
PagerAdapter adapter = new CustomPagerAdapter(); // This should be your custom PagerAdapter
customViewPager.setAdapter(adapter);

Remember, in order for the ViewPager to display anything, you will need to set a PagerAdapter to it that supplies the views representing each page.

Also, please replace com.example.yourapp with your actual package name in XML usage.

Use Cases

The custom ViewPager is perfect for applications where users prefer minimal hand movement or find swiping through pages inconvenient. It can also be beneficial for applications targeting users with accessibility needs, as the single-tap navigation may be easier for them to use. For example, in a digital book reading app, this would allow users to navigate between pages with a single tap, mimicking the act of flipping a book's page on either side.

Conclusion

Enhancing the user experience is a crucial aspect of Android development. By customizing a ViewPager to respond to single-tap events, we can make navigation through an app's pages easier and more intuitive. While this post focused on single-tap events, Android's GestureDetector offers a wide range of gesture detection capabilities that developers can leverage to build engaging and user-friendly interfaces.

Documentation References

Remember, the code is just a tool to serve your user's needs. By understanding your users and tailoring the code to their preferences, you can build an application that truly stands out. Happy coding!

Building a Visual Password Strength Meter in Android: A Simple Guide

K M Rejowan Ahmmed — Mon, 05 Jun 2023 17:16:48 +0000

Creating an interactive and user-friendly interface is crucial for ensuring user engagement. One such tool that significantly boosts user experience is a password strength indicator. Today, we're going to break down the creation of a simple yet effective password strength meter implemented in Android using the Java programming language.

Code Breakdown

Let's first review the entire code:

public class PasswordStrengthIndicator extends View {

    private int passwordStrength = 0; // range 0 - 10
    private final Paint filledPaint;
    private final Paint unfilledPaint;

    public PasswordStrengthIndicator(Context context, AttributeSet attrs) {
        super(context, attrs);

        filledPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
        unfilledPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
        unfilledPaint.setColor(ContextCompat.getColor(context, R.color.grey)); // Color of unfilled dots
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);

        int width = getWidth();
        int height = getHeight();
        int dotWidth = width / 20; // Adjusted to allow space for gaps
        int dotHeight = dotWidth / 2;
        float radius = 5 * getResources().getDisplayMetrics().density; // 5dp to px
        int totalDotWidth = 10 * dotWidth + 9 * dotWidth; // total width of all dots and spaces
        int start = (width - totalDotWidth) / 2; // the starting x value to center the dots

        for (int i = 0; i < 10; i++) {
            int x = start + i * (dotWidth * 2); 
            RectF rectF = new RectF(x, (height - dotHeight) / 2, x + dotWidth, (height + dotHeight) / 2);

            if (i < passwordStrength) {
                if (passwordStrength <= 3) {
                    filledPaint.setColor(ContextCompat.getColor(getContext(), R.color.red));
                } else if (passwordStrength <= 7) {
                    filledPaint.setColor(ContextCompat.getColor(getContext(), R.color.yellow));
                } else {
                    filledPaint.setColor(ContextCompat.getColor(getContext(), R.color.green));
                }
                canvas.drawRoundRect(rectF, radius, radius, filledPaint);
            } else {
                canvas.drawRoundRect(rectF, radius, radius, unfilledPaint);
            }
        }
    }

    public void setPasswordStrength(int passwordStrength) {
        this.passwordStrength = passwordStrength;
        invalidate();
    }
}

The class PasswordStrengthIndicator extends View, the base class for widgets in Android, which allows it to be used in your UI layouts.

Initializing Paint Objects

In the constructor, we initialize two Paint objects. The Paint class holds style and color information about how to draw geometries, text, and bitmaps. In our case, we use two separate instances: filledPaint for filled dots and unfilledPaint for unfilled ones.

Drawing on Canvas

The drawing takes place in the onDraw(Canvas canvas) method. We first determine the width and height of our widget and the size of the dots that represent the password strength.

We calculate the total width required for the dots and the gaps between them and calculate a starting point to center them. We then loop through 10 times (our password strength range is 0 - 10), drawing either a filled or unfilled dot depending on the current password strength.

The color of the filled dots changes based on the password strength:

Strength less than or equal to 3: Red
Strength between 4 and 7: Yellow
Strength greater than 7: Green

Updating the Password Strength

Finally, we have a public method setPasswordStrength(int passwordStrength). This method sets the password strength and calls invalidate(). The invalidate() method tells the system that this view should be redrawn, causing the onDraw method to be called again.

How Does This Work?

This password strength indicator is purely a visual representation. You must create a mechanism to calculate the actual strength of the password entered by the user. The calculation can be based on the inclusion of uppercase letters, lowercase letters, digits, special characters, and the overall length of the password.

Whenever the password input changes, call setPasswordStrength(int passwordStrength) on this view with the new strength. The indicator will update automatically, providing real-time feedback to the user.

Further Customizations

The customization possibilities are endless. You could modify the colors to better fit your app's theme. Moreover, you could adjust the dot size and radius to best suit your needs. You might also consider creating a gradient password strength meter for a more visually pleasing indicator.

Color Resources

In the provided code, we refer to color resources like R.color.red, R.color.yellow, and R.color.green. These color resources should be defined in your project's res/values/colors.xml file. You can learn more about color resources in the Android Developer's guide to More Resource Types.

How to Use It in Your Layout

To utilize the PasswordStrengthIndicator in your Android layout, use the XML code snippet below:

<com.yourPackage.PasswordStrengthIndicator
    android:id="@+id/password_strength_indicator"
    android:layout_width="match_parent"
    android:layout_height="30dp"
    android:layout_gravity="center"/>

Replace com.yourPackage with the actual package name where you have placed the PasswordStrengthIndicator class.

And in java, call using this way to set strength according to your needs:

PasswordStrengthIndicator passwordStrengthIndicator = findViewById(R.id.password_strength_indicator);
passwordStrengthIndicator.setPasswordStrength(10);

Lastly

I hope this post has given you a thorough understanding of how to create a visually appealing and interactive password strength indicator. With this simple guide, you can create your very own password strength meter and customize it according to your app's requirements.

RecyclerView Last Item Extra Bottom Margin

K M Rejowan Ahmmed — Fri, 02 Jun 2023 20:34:26 +0000

RecyclerView has been an everyday used item in Android App Development. During our use case, we often need some extra twists with the existing RecyclerView. One of them is to have some extra bottom margin for the last element of RecyclerView. Today, we'll try a good solution for that.

Solution

A good way to make this possible is to use LayoutParams in onBindViewHolder in the adapter class. We can set params for the last item and params for the rest of the items. The last item will have an extra bottom margin to achieve the goal.

Example Code

    @Override
    public void onBindViewHolder(@NonNull ViewHolder holder, int position) {

        if (position == list.size() - 1) {
            RecyclerView.LayoutParams params = (RecyclerView.LayoutParams) holder.itemView.getLayoutParams();
            params.bottomMargin = 150; // last item bottom margin
            holder.itemView.setLayoutParams(params);

        } else {
            RecyclerView.LayoutParams params = (RecyclerView.LayoutParams) holder.itemView.getLayoutParams();
            params.bottomMargin = 10; // other items bottom margin
            holder.itemView.setLayoutParams(params);
        }

        // all other codes

    }

Explanation

by position == last.size() - 1 we find out the last item of the list. And with the LayoutParams we set the bottom margin for the last item. And in the else section, we set the bottom margin for the rest of the items.
Now you know how to add an extra bottom margin to the last item to RecyclerView.

Find me on - Github, Facebook

Making Android Views Draggable: A Practical Guide

K M Rejowan Ahmmed — Fri, 02 Jun 2023 20:25:14 +0000

In Android, views are fundamental building blocks of UI (User Interface). They define components like buttons, labels, text fields, image views, etc. Typically, these views have fixed positions as defined in layout files or programmatically. But what if we want to make these views movable or draggable by the user?

This post focuses on how to make any view in Android draggable. We will be working with Floating Action Button, ImageView, and LottieAnimation View, converting these into custom views using a reference code snippet. This feature can significantly enhance user interactivity, offering a more dynamic UI experience.

We will leverage Android's onTouch listener to detect touch events, calculate the new position, and then reposition the view based on the user's drag. The reference code we're using here illustrates the logic using a Floating Action Button (FAB), a common element that could benefit from this feature.

The Reference Code

Here's the original Java code that we will modify for our purpose. This code shows how to make a FloatingActionButton draggable:

import android.content.Context;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.view.View;
import android.view.ViewGroup;

import com.google.android.material.floatingactionbutton.FloatingActionButton;

public class MovableFloatingActionButton extends FloatingActionButton implements View.OnTouchListener {

    private final static float CLICK_DRAG_TOLERANCE = 10; // Often, there will be a slight, unintentional, drag when the user taps the FAB, so we need to account for this.

    private float downRawX, downRawY;
    private float dX, dY;

    public MovableFloatingActionButton(Context context) {
        super(context);
        init();
    }

    public MovableFloatingActionButton(Context context, AttributeSet attrs) {
        super(context, attrs);
        init();
    }

    public MovableFloatingActionButton(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init();
    }

    private void init() {
        setOnTouchListener(this);
    }

    @Override
    public boolean onTouch(View view, MotionEvent motionEvent){

        ViewGroup.MarginLayoutParams layoutParams = (ViewGroup.MarginLayoutParams)view.getLayoutParams();

        int action = motionEvent.getAction();
        if (action == MotionEvent.ACTION_DOWN) {

            downRawX = motionEvent.getRawX();
            downRawY = motionEvent.getRawY();
            dX = view.getX() - downRawX;
            dY = view.getY() - downRawY;

            return true; // Consumed

        }
        else if (action == MotionEvent.ACTION_MOVE) {

            int viewWidth = view.getWidth();
            int viewHeight = view.getHeight();

            View viewParent = (View)view.getParent();
            int parentWidth = viewParent.getWidth();
            int parentHeight = viewParent.getHeight();

            float newX = motionEvent.getRawX() + dX;
            newX = Math.max(layoutParams.leftMargin, newX); // Don't allow the FAB past the left hand side of the parent
            newX = Math.min(parentWidth - viewWidth - layoutParams.rightMargin, newX); // Don't allow the FAB past the right hand side of the parent

            float newY = motionEvent.getRawY() + dY;
            newY = Math.max(layoutParams.topMargin, newY); // Don't allow the FAB past the top of the parent
            newY = Math.min(parentHeight - viewHeight - layoutParams.bottomMargin, newY); // Don't allow the FAB past the bottom of the parent

            view.animate()
                    .x(newX)
                    .y(newY)
                    .setDuration(0)
                    .start();

            return true; // Consumed

        }
        else if (action == MotionEvent.ACTION_UP) {

            float upRawX = motionEvent.getRawX();
            float upRawY = motionEvent.getRawY();

            float upDX = upRawX - downRawX;
            float upDY = upRawY - downRawY;

            if (Math.abs(upDX) < CLICK_DRAG_TOLERANCE && Math.abs(upDY) < CLICK_DRAG_TOLERANCE) { // A click
                return performClick();
            }
            else { // A drag
                return true; // Consumed
            }

        }
        else {
            return super.onTouchEvent(motionEvent);
        }

    }

}

Breaking Down the Code

The above class extends the FloatingActionButton and implements the View.OnTouchListener interface. The OnTouchListener interface is crucial here, as it allows us to handle touch events.

In the onTouch method, we handle different touch events:

ACTION_DOWN: This is when the user first touches the view. We record the position where the user touched down.

ACTION_MOVE: This is when the user moves their finger while still touching the screen. We calculate the new X and Y coordinates for the view, ensuring it doesn't move past the parent's edges.

ACTION_UP: This is when the user lifts their finger from the screen. Here, we handle both click and drag actions. If the movement was small enough, we consider it a click and call performClick(). Otherwise, it's a drag event, and we simply consume the event.

Making Other Views Draggable

We can apply the same concept to make other views draggable. The key change is to extend the view you want to make draggable. For example, to make an ImageView draggable, you'd use public class DraggableImageView extends ImageView implements View.OnTouchListener.

Similarly, for a LottieAnimationView, public class DraggableLottieAnimationView extends LottieAnimationView implements View.OnTouchListener.

Remember to replace any FloatingActionButton specific code with code applicable to your view. The main concept remains the same - implement the OnTouchListener, handle the different touch events, and update the view's position during a move event.

Conclusion

By implementing the View.OnTouchListener and handling different touch events, you can make any Android view draggable, significantly improving user interactivity. Whether it's a FloatingActionButton, ImageView, BottomNavigationView, or a LottieAnimationView, the logic remains consistent. The sky is the limit!

References

Hide the Soft Keyboard and Remove Focus from EditText in Android

K M Rejowan Ahmmed — Wed, 31 May 2023 11:44:53 +0000

Hello Android Developers,

If you're reading this, chances are you're looking for a way to improve your app's user experience by managing the visibility of the soft keyboard and the focus of EditText views more effectively. You might be wondering how to automatically hide the keyboard and remove focus from an EditText (or its subclass) when a user clicks elsewhere in your app. In this post, we'll go through a simple solution for this common situation.

The dispatchTouchEvent() Method

Before diving into the solution, let's introduce dispatchTouchEvent(). This is an Android Activity class method called whenever a touch event is dispatched (i.e., when a user interacts with the touch screen). The touch event contains key information about the interaction, such as the location and type of touch (e.g., down, move, up).

The Solution Explained

Here's the code snippet that handles this UX enhancement:

@Override
public boolean dispatchTouchEvent(MotionEvent event) {
    if (event.getAction() == MotionEvent.ACTION_DOWN) {
        View v = getCurrentFocus();
        if (v instanceof EditText) {
            Rect outRect = new Rect();
            v.getGlobalVisibleRect(outRect);
            if (!outRect.contains((int) event.getRawX(), (int) event.getRawY())) {
                v.clearFocus();
                InputMethodManager imm = (InputMethodManager) getSystemService(Context.INPUT_METHOD_SERVICE);
                imm.hideSoftInputFromWindow(v.getWindowToken(), 0);
            }
        }
    }
    return super.dispatchTouchEvent(event);
}

Let's break this down:

Checking for ACTION_DOWN: We're interested in the 'down' event, which signifies the start of a touch (i.e., the user's finger first makes contact with the screen). We check for this event with if (event.getAction() == MotionEvent.ACTION_DOWN).

Identifying the Current Focus: The getCurrentFocus() function is used to identify the view currently in focus - this is usually the view the user is or has last interacted with.

Verifying if it's an EditText: The if (v instanceof EditText) statement checks if the currently focused view is an instance of EditText. We want to ensure the following operations (like hiding the keyboard) only happen when an EditText loses focus.

Defining the Touch Boundary: We create a Rect object (representing a rectangle) to denote the visible area of the EditText view on the screen.

Detecting a Touch Outside EditText: We then check if the touch event is within this rectangle. If it's not, it means that the user has touched outside of the EditText view.

Removing Focus and Hiding Keyboard: If the touch is detected outside the EditText, we clear the focus from the EditText and fetch the Input Method Manager (a system service that deals with the soft keyboard). We use this to hide the keyboard.

Passing on the Event: Finally, we pass the touch event on to the super class's dispatchTouchEvent(). This is crucial as the touch event may need further processing by other views or the system.

Working with TextInputEditText

For those wondering about TextInputEditText (a subclass of EditText), fear not! This code works perfectly well for TextInputEditText views as well. If you wish to specifically apply this functionality to TextInputEditText views, you can replace if (v instanceof EditText) with if (v instanceof TextInputEditText).

Wrapping Up

This simple yet effective method can drastically improve the user experience of your Android app, particularly when working with forms or text inputs. Remember, a seamless user experience often leads to higher user satisfaction.

Keep coding and enhancing!

Android SearchView.OnCloseListener Not Working? Here is how to fix it.

K M Rejowan Ahmmed — Mon, 27 Feb 2023 05:25:17 +0000

I was working on an android app project which required a SearchView. While working on the SearchView, I discovered that the method setOncloseListener is not working for the SearchView. I did some research and found that a lot of people like are having the same issues. After some testing I found a solution to make the close icon click listener or the OnCloseListener for SearchView work. It is not ideal, but here we go.

SearchViewSearchView with Close IconBefore going further here are some primary details,

I'm using androidx.appcompat.widget.SearchView in a layout.
I needed the method to clear queries from searchView, remove focus and finally hide the soft keyboard.

Solution

In your java code add these lines to make the magic work:


 java
        SearchView searchView = findViewById(R.id.search_view);

        int searchCloseButtonId = searchView.findViewById(androidx.appcompat.R.id.search_close_btn).getId();
        ImageView closeButton = searchView.findViewById(searchCloseButtonId);
        closeButton.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                searchView.setQuery("", false);
                searchView.clearFocus();
                binding.searchResultLayout.setVisibility(GONE);
                hideKeyboard();
            }
        });

for hideKeyboard:


 java
        private void hideKeyboard() {
        InputMethodManager imm = (InputMethodManager) getSystemService(Context.INPUT_METHOD_SERVICE);
        imm.hideSoftInputFromWindow(binding.searchView.getWindowToken(), 0);
        }

And that's it. Now you can make your searchView close icon work as you like.

How it's working?

SearchView has IDs for its own components, in this case, the close icon. In the code have searchView.findViewById(androidx.appcompat.R.id.search_close_btn).getId() which calls the id of the close image from searchView itself.
Later we added this id to an ImageView by using searchView.findViewById(searchCloseButtonId) this. And then just setting on click listener for the ImageView and creating a method for hideKeyboard from searchView windowToken.

So, now you have a solution to fix problems with searchView.setOnCloseListener.

Find me on - Github, Facebook

CuteDialog - A Custom Material Design Dialog Library for Android

K M Rejowan Ahmmed — Fri, 28 Oct 2022 14:00:07 +0000

Hi,
Today I'm sharing a Custom Material Design Dialog Library named CuteDialog created by CuteLibs Project . I'm a co-author of this repo and tried my best to make a good and reliable library for the community.

CuteDialog

As mentioned on the repo page-

CuteDialog is a Highly Customizable Material Design Android Library. CuteDialog allows developer to create beautiful dialogs with material design. It is highly customizable and can be used for lots of different purposes.

Screenshot

Icon	Image	Animation

Prerequisites

Add this to your root build.gradle

Theme

You must use any MaterialComponents Theme. Example-

Basic Usage

Advanced

Customizations

( Visit Wiki for more )

Thanks for Reading. Have a good day.

Find me on - Github, Facebook

CardView Vs MaterialCardView

K M Rejowan Ahmmed — Thu, 27 Oct 2022 19:35:11 +0000

As we're focusing more on design, Material Design is a hot topic here. Google's Material Library ( com.google.android.material ) created a huge impact in this area. Today I'm going to discuss one of the most used elements in the design, the CardView.

Google has introduced a new version of CardView called MaterialCardView . Both CardView and MaterialCardView could be used in the same cases and they look pretty similar. But there is still a vast difference in both design and functionality.

Let's start with some background data about these twos-

CardView

Previously, CardView was provided by Android Support Library (android.support.v7.widget.CardView). But with the latest migration to Andoridx, now it is provided by Androidx (androidx.cardview.widget.CardView) Library. CardView is created by extending the FrameLayout.

MaterialCardView

This is introduced with Google Material Library (com.google.android.material). It is provided by Material Components Library ( com.google.android.material.card.MaterialCardView). MaterialCardView is created by extending the CardView.

Differences

MaterialCardView has all the elements of CardView with its extra features. Here is a list containing the differences-

Stroke Color and Stroke Width can be added to MaterialCardView which wasn't possible using CardView.
MaterialCardView is Checkable. Check icon, color, and position can be set in MaterialCardView. Check conditions can be called also. This will be really useful as CardView has a huge usage in lists and grids.
Ripple Color can be set to MaterialCardView which is not available in CardView.

Code Example

CardView

MaterialCardView

Shots

CardView

MaterialCardView

Details

Thanks for reading. Have a good day.

Find me on - Github, Facebook

More- CuteLibs Projects, CuteDialog