<style>/*<link href='https://www.blogger.com/dyn-css/authorization.css?targetBlogID=548045071468246972&zx=d04458ed-0c22-4fb3-a5e3-fd62b280c84e' media='none' onload='if(media!='all')media='all'' rel='stylesheet'/><noscript><link href='https://www.blogger.com/dyn-css/authorization.css?targetBlogID=548045071468246972&zx=d04458ed-0c22-4fb3-a5e3-fd62b280c84e' rel='stylesheet'/></noscript>
<meta name='google-adsense-platform-account' content='ca-host-pub-1556223355139109'/>
<meta name='google-adsense-platform-domain' content='blogspot.com'/>

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-6102615754735220&host=ca-host-pub-1556223355139109" crossorigin="anonymous"></script>

<!-- data-ad-client=ca-pub-6102615754735220 -->

</head><body>*/</style>

How to Customize Background Shape Bottom Navigation View Material Design Component in Android Studio

Abdul Aziz Ahwan

27 Jan, 2020

#CustomShape #BottomNavigationView #AndroidStudio #Modern

Hi everyone, I am Abdul Aziz Ahwan . In this post, we are going to Learn How do I Customize Background Shape Bottom Navigation View Material Design Component in Android Studio.

To customize background shape it's so simple, we can simply create drawable resource file and set that file as the background.

If you want to learn more, you can watch the tutorial below.
Android Studio Project File (abdulazizahwan.androidstudio)

Bottom Navigation View Component Design Material Design Tutorial UI UI Design YouTube

Add Comment

<style>/*
<script type="text/javascript" src="https://www.blogger.com/static/v1/widgets/591462033-widgets.js"></script>
<script type='text/javascript'>
window['__wavt'] = 'AOuZoY50D9B4i0sRVUPeFnlT20K4rsNXvg:1696207481741';_WidgetManager._Init('//www.blogger.com/rearrange?blogID\x3d548045071468246972','//www.abdulazizahwan.com/2020/01/customshape-bottomnavigationview.html','548045071468246972');
_WidgetManager._SetDataContext([{'name': 'blog', 'data': {'blogId': '548045071468246972', 'title': 'Abdul Aziz Ahwan - Mobile Dev Enthusiast', 'url': 'https://www.abdulazizahwan.com/2020/01/customshape-bottomnavigationview.html', 'canonicalUrl': 'https://www.abdulazizahwan.com/2020/01/customshape-bottomnavigationview.html', 'homepageUrl': 'https://www.abdulazizahwan.com/', 'searchUrl': 'https://www.abdulazizahwan.com/search', 'canonicalHomepageUrl': 'https://www.abdulazizahwan.com/', 'blogspotFaviconUrl': 'https://www.abdulazizahwan.com/favicon.ico', 'bloggerUrl': 'https://www.blogger.com', 'hasCustomDomain': true, 'httpsEnabled': true, 'enabledCommentProfileImages': true, 'gPlusViewType': 'FILTERED_POSTMOD', 'adultContent': false, 'analyticsAccountNumber': 'UA-117523963-3', 'encoding': 'UTF-8', 'locale': 'en', 'localeUnderscoreDelimited': 'en', 'languageDirection': 'ltr', 'isPrivate': false, 'isMobile': false, 'isMobileRequest': false, 'mobileClass': '', 'isPrivateBlog': false, 'isDynamicViewsAvailable': true, 'feedLinks': '\x3clink rel\x3d\x22alternate\x22 type\x3d\x22application/atom+xml\x22 title\x3d\x22Abdul Aziz Ahwan - Mobile Dev Enthusiast - Atom\x22 href\x3d\x22https://www.abdulazizahwan.com/feeds/posts/default\x22 /\x3e\n\x3clink rel\x3d\x22alternate\x22 type\x3d\x22application/rss+xml\x22 title\x3d\x22Abdul Aziz Ahwan - Mobile Dev Enthusiast - RSS\x22 href\x3d\x22https://www.abdulazizahwan.com/feeds/posts/default?alt\x3drss\x22 /\x3e\n\x3clink rel\x3d\x22service.post\x22 type\x3d\x22application/atom+xml\x22 title\x3d\x22Abdul Aziz Ahwan - Mobile Dev Enthusiast - Atom\x22 href\x3d\x22https://www.blogger.com/feeds/548045071468246972/posts/default\x22 /\x3e\n\n\x3clink rel\x3d\x22alternate\x22 type\x3d\x22application/atom+xml\x22 title\x3d\x22Abdul Aziz Ahwan - Mobile Dev Enthusiast - Atom\x22 href\x3d\x22https://www.abdulazizahwan.com/feeds/2170809270918164940/comments/default\x22 /\x3e\n', 'meTag': '', 'adsenseClientId': 'ca-pub-6102615754735220', 'adsenseHostId': 'ca-host-pub-1556223355139109', 'adsenseHasAds': true, 'adsenseAutoAds': true, 'boqCommentIframeForm': true, 'loginRedirectParam': '', 'view': '', 'dynamicViewsCommentsSrc': '//www.blogblog.com/dynamicviews/4224c15c4e7c9321/js/comments.js', 'dynamicViewsScriptSrc': '//www.blogblog.com/dynamicviews/2d0a24a4c015fadb', 'plusOneApiSrc': 'https://apis.google.com/js/platform.js', 'disableGComments': true, 'interstitialAccepted': false, 'sharing': {'platforms': [{'name': 'Get link', 'key': 'link', 'shareMessage': 'Get link', 'target': ''}, {'name': 'Facebook', 'key': 'facebook', 'shareMessage': 'Share to Facebook', 'target': 'facebook'}, {'name': 'BlogThis!', 'key': 'blogThis', 'shareMessage': 'BlogThis!', 'target': 'blog'}, {'name': 'Twitter', 'key': 'twitter', 'shareMessage': 'Share to Twitter', 'target': 'twitter'}, {'name': 'Pinterest', 'key': 'pinterest', 'shareMessage': 'Share to Pinterest', 'target': 'pinterest'}, {'name': 'Email', 'key': 'email', 'shareMessage': 'Email', 'target': 'email'}], 'disableGooglePlus': true, 'googlePlusShareButtonWidth': 0, 'googlePlusBootstrap': '\x3cscript type\x3d\x22text/javascript\x22\x3ewindow.___gcfg \x3d {\x27lang\x27: \x27en\x27};\x3c/script\x3e'}, 'hasCustomJumpLinkMessage': false, 'jumpLinkMessage': 'Read more', 'pageType': 'item', 'postId': '2170809270918164940', 'postImageThumbnailUrl': 'https://1.bp.blogspot.com/-nFi-HkBORxg/Xi8-t1SXcjI/AAAAAAAAKqc/gPeNVJf8sQsFnJaB2uMVSpiDK3zZWQn6wCLcBGAsYHQ/s72-c/How%2Bto%2BCustomize%2BBackground%2BShape%2BBottom%2BNavigation%2BView%2BMaterial%2BDesign%2BComponent%2Bin%2BAndroid%2BStudio.png', 'postImageUrl': 'https://1.bp.blogspot.com/-nFi-HkBORxg/Xi8-t1SXcjI/AAAAAAAAKqc/gPeNVJf8sQsFnJaB2uMVSpiDK3zZWQn6wCLcBGAsYHQ/s640/How%2Bto%2BCustomize%2BBackground%2BShape%2BBottom%2BNavigation%2BView%2BMaterial%2BDesign%2BComponent%2Bin%2BAndroid%2BStudio.png', 'pageName': 'How to Customize Background Shape Bottom Navigation View Material Design Component in Android Studio', 'pageTitle': 'Abdul Aziz Ahwan - Mobile Dev Enthusiast: How to Customize Background Shape Bottom Navigation View Material Design Component in Android Studio', 'metaDescription': 'How to Customize Background Shape Bottom Navigation View Material Design Component in Android Studio'}}, {'name': 'features', 'data': {}}, {'name': 'messages', 'data': {'edit': 'Edit', 'linkCopiedToClipboard': 'Link copied to clipboard!', 'ok': 'Ok', 'postLink': 'Post Link'}}, {'name': 'template', 'data': {'name': 'custom', 'localizedName': 'Custom', 'isResponsive': true, 'isAlternateRendering': false, 'isCustom': true}}, {'name': 'view', 'data': {'classic': {'name': 'classic', 'url': '?view\x3dclassic'}, 'flipcard': {'name': 'flipcard', 'url': '?view\x3dflipcard'}, 'magazine': {'name': 'magazine', 'url': '?view\x3dmagazine'}, 'mosaic': {'name': 'mosaic', 'url': '?view\x3dmosaic'}, 'sidebar': {'name': 'sidebar', 'url': '?view\x3dsidebar'}, 'snapshot': {'name': 'snapshot', 'url': '?view\x3dsnapshot'}, 'timeslide': {'name': 'timeslide', 'url': '?view\x3dtimeslide'}, 'isMobile': false, 'title': 'How to Customize Background Shape Bottom Navigation View Material Design Component in Android Studio', 'description': 'How to Customize Background Shape Bottom Navigation View Material Design Component in Android Studio', 'featuredImage': 'https://1.bp.blogspot.com/-nFi-HkBORxg/Xi8-t1SXcjI/AAAAAAAAKqc/gPeNVJf8sQsFnJaB2uMVSpiDK3zZWQn6wCLcBGAsYHQ/s640/How%2Bto%2BCustomize%2BBackground%2BShape%2BBottom%2BNavigation%2BView%2BMaterial%2BDesign%2BComponent%2Bin%2BAndroid%2BStudio.png', 'url': 'https://www.abdulazizahwan.com/2020/01/customshape-bottomnavigationview.html', 'type': 'item', 'isSingleItem': true, 'isMultipleItems': false, 'isError': false, 'isPage': false, 'isPost': true, 'isHomepage': false, 'isArchive': false, 'isLabelSearch': false, 'postId': 2170809270918164940}}, {'name': 'widgets', 'data': [{'title': 'Upload Image', 'type': 'Image', 'sectionId': 'upload-image', 'id': 'Image10'}, {'title': 'Logo', 'type': 'HTML', 'sectionId': 'header-main', 'id': 'HTML10'}, {'title': 'Icons, Dark, Search', 'type': 'LinkList', 'sectionId': 'header-main', 'id': 'LinkList10'}, {'title': 'Menu', 'type': 'LinkList', 'sectionId': 'header-main', 'id': 'LinkList11'}, {'title': '#Advertisement', 'type': 'HTML', 'sectionId': 'before-blog', 'id': 'HTML11'}, {'title': '#Advertisement', 'type': 'HTML', 'sectionId': 'before-post', 'id': 'HTML12'}, {'title': 'Blog Posts', 'type': 'Blog', 'sectionId': 'blog-post', 'id': 'Blog1', 'posts': [{'id': '2170809270918164940', 'title': 'How to Customize Background Shape Bottom Navigation View Material Design Component in Android Studio', 'featuredImage': 'https://1.bp.blogspot.com/-nFi-HkBORxg/Xi8-t1SXcjI/AAAAAAAAKqc/gPeNVJf8sQsFnJaB2uMVSpiDK3zZWQn6wCLcBGAsYHQ/s640/How%2Bto%2BCustomize%2BBackground%2BShape%2BBottom%2BNavigation%2BView%2BMaterial%2BDesign%2BComponent%2Bin%2BAndroid%2BStudio.png', 'showInlineAds': false}], 'footerBylines': [{'regionName': 'footer1', 'items': [{'name': 'author', 'label': 'Posted by'}, {'name': 'timestamp', 'label': 'd MMM, yyyy'}, {'name': 'comments', 'label': 'Comment'}, {'name': 'share', 'label': ''}]}, {'regionName': 'footer2', 'items': [{'name': 'labels', 'label': 'Labels:'}]}], 'allBylineItems': [{'name': 'author', 'label': 'Posted by'}, {'name': 'timestamp', 'label': 'd MMM, yyyy'}, {'name': 'comments', 'label': 'Comment'}, {'name': 'share', 'label': ''}, {'name': 'labels', 'label': 'Labels:'}]}, {'title': '#Advertisement', 'type': 'HTML', 'sectionId': 'ads-post', 'id': 'HTML13'}, {'title': '#Advertisement', 'type': 'HTML', 'sectionId': 'ads-post', 'id': 'HTML14'}, {'title': '#You may also like', 'type': 'HTML', 'sectionId': 'ads-post', 'id': 'HTML15'}, {'title': '#Advertisement', 'type': 'HTML', 'sectionId': 'ads-post', 'id': 'HTML16'}, {'title': '#Advertisement', 'type': 'HTML', 'sectionId': 'ads-post', 'id': 'HTML17'}, {'title': '#Advertisement', 'type': 'HTML', 'sectionId': 'after-blog', 'id': 'HTML18'}, {'title': '#Popular Posts', 'type': 'PopularPosts', 'sectionId': 'sidebar-static', 'id': 'PopularPosts10', 'posts': [{'title': 'Taskade: Empowering Team Collaboration through AI-Powered Productivity Tools', 'id': 3469093081350540285}, {'title': 'Tutorial Cara Mengubah File PDF Menjadi Ms Word Doc', 'id': 8955683279570399141}, {'title': 'Cara Membuat dan Meminta Video Kaleidoskop 2017 di Facebook #YearInReview', 'id': 1705363180262523969}, {'title': 'Tutorial Cara Mudah Mengatasi Tidak Bisa Download File Yang Terinfeksi Virus di Google Drive', 'id': 4367497257190601733}, {'title': 'Introducing Project IDX: A New Age of Cloud-based App Development', 'id': 6877313266842710651}]}, {'title': 'Categories', 'type': 'Label', 'sectionId': 'sidebar-static', 'id': 'Label10'}, {'title': 'Hashtag', 'type': 'Label', 'sectionId': 'sidebar-static', 'id': 'Label11'}, {'title': '#Recent Post', 'type': 'HTML', 'sectionId': 'sidebar-static', 'id': 'HTML19'}, {'title': '#Advertisement', 'type': 'HTML', 'sectionId': 'sidebar-sticky', 'id': 'HTML20'}, {'title': 'About Us', 'type': 'HTML', 'sectionId': 'footer-widget', 'id': 'HTML21'}, {'title': 'Learn More', 'type': 'LinkList', 'sectionId': 'footer-widget', 'id': 'LinkList13'}, {'title': 'Follow Us', 'type': 'LinkList', 'sectionId': 'footer-widget', 'id': 'LinkList14'}, {'title': 'Copyright', 'type': 'HTML', 'sectionId': 'copyright', 'id': 'HTML23'}, {'title': 'SVG Icons', 'type': 'HTML', 'sectionId': 'jet-options', 'id': 'HTML24'}]}]);
_WidgetManager._RegisterWidget('_ImageView', new _WidgetInfo('Image10', 'upload-image', document.getElementById('Image10'), {'resize': false}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML10', 'header-main', document.getElementById('HTML10'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_LinkListView', new _WidgetInfo('LinkList10', 'header-main', document.getElementById('LinkList10'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_LinkListView', new _WidgetInfo('LinkList11', 'header-main', document.getElementById('LinkList11'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML11', 'before-blog', document.getElementById('HTML11'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML12', 'before-post', document.getElementById('HTML12'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_BlogView', new _WidgetInfo('Blog1', 'blog-post', document.getElementById('Blog1'), {'cmtInteractionsEnabled': false, 'lightboxEnabled': true, 'lightboxModuleUrl': 'https://www.blogger.com/static/v1/jsbin/3769133935-lbx.js', 'lightboxCssUrl': 'https://www.blogger.com/static/v1/v-css/3268905543-lightbox_bundle.css'}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML13', 'ads-post', document.getElementById('HTML13'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML14', 'ads-post', document.getElementById('HTML14'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML15', 'ads-post', document.getElementById('HTML15'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML16', 'ads-post', document.getElementById('HTML16'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML17', 'ads-post', document.getElementById('HTML17'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML18', 'after-blog', document.getElementById('HTML18'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_PopularPostsView', new _WidgetInfo('PopularPosts10', 'sidebar-static', document.getElementById('PopularPosts10'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_LabelView', new _WidgetInfo('Label10', 'sidebar-static', document.getElementById('Label10'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_LabelView', new _WidgetInfo('Label11', 'sidebar-static', document.getElementById('Label11'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML19', 'sidebar-static', document.getElementById('HTML19'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML20', 'sidebar-sticky', document.getElementById('HTML20'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML21', 'footer-widget', document.getElementById('HTML21'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_LinkListView', new _WidgetInfo('LinkList13', 'footer-widget', document.getElementById('LinkList13'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_LinkListView', new _WidgetInfo('LinkList14', 'footer-widget', document.getElementById('LinkList14'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML23', 'copyright', document.getElementById('HTML23'), {}, 'displayModeFull'));
_WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML24', 'jet-options', document.getElementById('HTML24'), {}, 'displayModeFull'));
</script>
</body>*/</style>