Create a Custom Loading Progress Bar In Android Studio

by | Jul 11, 2020 | Android for Beginners, Android UI/UX Tutorials, Basics, City Guide App, UI UX | 0 comments

In this tutorial, we will create a custom progress bar in android studio. We will use a regular progress bar but will add a custom background. If you want to watch any of the videos that are created before then click here.

Watch Youtube tutorial


Create a background

To create a custom progress bar android we have to create a background which will be white and in circular shape So, to create that GOTO -> res -> drawable -> right click and create a new resource file and name it white_circle and paste the code below.


<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="">

    <solid android:color="@color/white"></solid>
    <corners android:radius="100dp"></corners>


Create a Custom Progress Bar Android

Now to create a custom progress bar android we have to add a <RelativeLayout> in that we will add a background color and change it’s visibilty to show, Gone or hidden. Inside this relativelayout we will use the progress bar.

Progress Bar XML





🚀 Supercharge your Flutter skills! Subscribe to my YouTube channel now for mind-blowing coding insights, expert tips, and exclusive content. Don’t miss out!


Android firebase app - android app 2022 - firebase android app - bulls rent app - coding with t app - android app
android complete login signup product by taimoor sikander free for any type of android app
Flutter E Commerce App Modern and latest
Flutter Login App UI Source Code - Flutter Complete App - Flutter App Design - Flutter App 2023 - Complete Flutter App 2023
Learn flutter from scratch in 4 hours - Flutter Crash Course - Coding with T

Latest Tutorial

How to create a Custom Appbar in flutter. Custom Appbar Design. Flutter App Design
How to create a Custom Shape in Flutter. Flutter E Commerce app Design. Ecommerce app design Flutter. Flutter clippath tutorial
Bottom Navigation bar in Flutter. Flutter Material 3 bottom navigation bar. How to design background color of Flutter bottom navigation bar. Flutter ecommerce app design
Access Admin Panel, Premium Tutorials, Live Chat, 50% off Codes, and More on Patreon!
This is default text for notification bar