SlideShare a Scribd company logo
1 of 7
Download to read offline
How to Get Rid of Drawable-[x]dpi Folders in Your
Android Project – Using Vector Assets for
Drawables
By Nikolay Soroka, Android Engineer at Stanfy.
In Android app development, it’s a good
practice to support multiple screens. And
even if you’re making an app only for
smartphones and only for a portrait mode,
you have to deal with different screen
densities.
So, you open your design file in Photoshop or
Sketch, and start extracting assets, adding all
those multipliers for mdpi, hdpi, xhdpi, xxhdpi
and now also xxxhdpi (!) device density.
It’s a dull and tedious process. App
developers and designers even have
created scripts and plugins for that.
Don’t like this too, right??
But I will share with you a few hacks on how to make this easier!
Here is what you need:
•Android Studio 1.4
•Android Gradle plugin 1.5.0
Open your design files and export your assets in .svg
format. Now in Android Studio right click on res folder
→ new → Vector Asset. This will open Vector Asset
Studio and you can select one of the default material
icons, in case you need one, or you can import your
svg file.
A hint: if Android Vector Studio says there is an error
importing your file, no worries, there is a plenty of
online resources to help you with vector drawables. Or
you can your open svg file and copy pathData into your
vector drawable.
That’s it! Now you have only one resource for each
asset.
In reality though, vector drawables are supported only on Android 5.0, api
level 21, so what happens is that gradle plugin renders all that drawables
for different densities to package them into resulting .apk file to be
displayed on older versions.
Much faster and simpler, right??
Thanks! Hope this slides were useful!
If yes, please share it J
By Nikolay Soroka, Android Engineer at Stanfy.

More Related Content

More from Stanfy

Stanfy MadCode Meetup: Анализ и модификация HTTP запросов для тестирования мо...
Stanfy MadCode Meetup: Анализ и модификация HTTP запросов для тестирования мо...Stanfy MadCode Meetup: Анализ и модификация HTTP запросов для тестирования мо...
Stanfy MadCode Meetup: Анализ и модификация HTTP запросов для тестирования мо...
Stanfy
 
Stanfy Publications: How to Conduct Quick Usability Tests for iOS & Android A...
Stanfy Publications: How to Conduct Quick Usability Tests for iOS & Android A...Stanfy Publications: How to Conduct Quick Usability Tests for iOS & Android A...
Stanfy Publications: How to Conduct Quick Usability Tests for iOS & Android A...
Stanfy
 
Stanfy Publications: Mobile Applications UI/UX Prototyping Process
Stanfy Publications: Mobile Applications UI/UX Prototyping ProcessStanfy Publications: Mobile Applications UI/UX Prototyping Process
Stanfy Publications: Mobile Applications UI/UX Prototyping Process
Stanfy
 
Stanfy Publications: Successful Cases of Mobile Technology in Medical Industry
Stanfy Publications: Successful Cases of Mobile Technology in Medical Industry Stanfy Publications: Successful Cases of Mobile Technology in Medical Industry
Stanfy Publications: Successful Cases of Mobile Technology in Medical Industry
Stanfy
 

More from Stanfy (12)

Building Profanity Filters: clbuttic sh!t
Building Profanity Filters: clbuttic sh!tBuilding Profanity Filters: clbuttic sh!t
Building Profanity Filters: clbuttic sh!t
 
Optimistic Approach. How to show results instead spinners without breaking yo...
Optimistic Approach. How to show results instead spinners without breaking yo...Optimistic Approach. How to show results instead spinners without breaking yo...
Optimistic Approach. How to show results instead spinners without breaking yo...
 
ComponenKit and React Native
ComponenKit and React NativeComponenKit and React Native
ComponenKit and React Native
 
UX Research in mobile
UX Research in mobileUX Research in mobile
UX Research in mobile
 
Remote user research & usability methods
Remote user research & usability methodsRemote user research & usability methods
Remote user research & usability methods
 
Stanfy MadCode Meetup#6: Apple Watch. First Steps.
Stanfy MadCode Meetup#6: Apple Watch. First Steps.Stanfy MadCode Meetup#6: Apple Watch. First Steps.
Stanfy MadCode Meetup#6: Apple Watch. First Steps.
 
Stanfy MadCode Meetup: Анализ и модификация HTTP запросов для тестирования мо...
Stanfy MadCode Meetup: Анализ и модификация HTTP запросов для тестирования мо...Stanfy MadCode Meetup: Анализ и модификация HTTP запросов для тестирования мо...
Stanfy MadCode Meetup: Анализ и модификация HTTP запросов для тестирования мо...
 
Stanfy's highlights of 2013
Stanfy's highlights of 2013Stanfy's highlights of 2013
Stanfy's highlights of 2013
 
10 things to consider when choosing a mobile platform (iOS or Android)
10 things to consider when choosing a mobile platform (iOS or Android)10 things to consider when choosing a mobile platform (iOS or Android)
10 things to consider when choosing a mobile platform (iOS or Android)
 
Stanfy Publications: How to Conduct Quick Usability Tests for iOS & Android A...
Stanfy Publications: How to Conduct Quick Usability Tests for iOS & Android A...Stanfy Publications: How to Conduct Quick Usability Tests for iOS & Android A...
Stanfy Publications: How to Conduct Quick Usability Tests for iOS & Android A...
 
Stanfy Publications: Mobile Applications UI/UX Prototyping Process
Stanfy Publications: Mobile Applications UI/UX Prototyping ProcessStanfy Publications: Mobile Applications UI/UX Prototyping Process
Stanfy Publications: Mobile Applications UI/UX Prototyping Process
 
Stanfy Publications: Successful Cases of Mobile Technology in Medical Industry
Stanfy Publications: Successful Cases of Mobile Technology in Medical Industry Stanfy Publications: Successful Cases of Mobile Technology in Medical Industry
Stanfy Publications: Successful Cases of Mobile Technology in Medical Industry
 

Recently uploaded

Obat Penggugur Kandungan Di Apotik Kimia Farma (087776558899)
Obat Penggugur Kandungan Di Apotik Kimia Farma (087776558899)Obat Penggugur Kandungan Di Apotik Kimia Farma (087776558899)
Obat Penggugur Kandungan Di Apotik Kimia Farma (087776558899)
Cara Menggugurkan Kandungan 087776558899
 

Recently uploaded (7)

Android Application Components with Implementation & Examples
Android Application Components with Implementation & ExamplesAndroid Application Components with Implementation & Examples
Android Application Components with Implementation & Examples
 
Obat Penggugur Kandungan Di Apotik Kimia Farma (087776558899)
Obat Penggugur Kandungan Di Apotik Kimia Farma (087776558899)Obat Penggugur Kandungan Di Apotik Kimia Farma (087776558899)
Obat Penggugur Kandungan Di Apotik Kimia Farma (087776558899)
 
Mobile Application Development-Components and Layouts
Mobile Application Development-Components and LayoutsMobile Application Development-Components and Layouts
Mobile Application Development-Components and Layouts
 
Bromazolam CAS 71368-80-4 high quality opiates, Safe transportation, 99% pure
Bromazolam CAS 71368-80-4 high quality opiates, Safe transportation, 99% pureBromazolam CAS 71368-80-4 high quality opiates, Safe transportation, 99% pure
Bromazolam CAS 71368-80-4 high quality opiates, Safe transportation, 99% pure
 
Mobile App Penetration Testing Bsides312
Mobile App Penetration Testing Bsides312Mobile App Penetration Testing Bsides312
Mobile App Penetration Testing Bsides312
 
Satara Call girl escort *74796//13122* Call me punam call girls 24*7hour avai...
Satara Call girl escort *74796//13122* Call me punam call girls 24*7hour avai...Satara Call girl escort *74796//13122* Call me punam call girls 24*7hour avai...
Satara Call girl escort *74796//13122* Call me punam call girls 24*7hour avai...
 
Mobile Application Development-Android and It’s Tools
Mobile Application Development-Android and It’s ToolsMobile Application Development-Android and It’s Tools
Mobile Application Development-Android and It’s Tools
 

How to get rid of drawable [x]dpi folders in your android project – using vector assets for drawables

  • 1. How to Get Rid of Drawable-[x]dpi Folders in Your Android Project – Using Vector Assets for Drawables By Nikolay Soroka, Android Engineer at Stanfy.
  • 2. In Android app development, it’s a good practice to support multiple screens. And even if you’re making an app only for smartphones and only for a portrait mode, you have to deal with different screen densities. So, you open your design file in Photoshop or Sketch, and start extracting assets, adding all those multipliers for mdpi, hdpi, xhdpi, xxhdpi and now also xxxhdpi (!) device density. It’s a dull and tedious process. App developers and designers even have created scripts and plugins for that.
  • 3. Don’t like this too, right??
  • 4. But I will share with you a few hacks on how to make this easier! Here is what you need: •Android Studio 1.4 •Android Gradle plugin 1.5.0
  • 5. Open your design files and export your assets in .svg format. Now in Android Studio right click on res folder → new → Vector Asset. This will open Vector Asset Studio and you can select one of the default material icons, in case you need one, or you can import your svg file. A hint: if Android Vector Studio says there is an error importing your file, no worries, there is a plenty of online resources to help you with vector drawables. Or you can your open svg file and copy pathData into your vector drawable. That’s it! Now you have only one resource for each asset.
  • 6. In reality though, vector drawables are supported only on Android 5.0, api level 21, so what happens is that gradle plugin renders all that drawables for different densities to package them into resulting .apk file to be displayed on older versions. Much faster and simpler, right??
  • 7. Thanks! Hope this slides were useful! If yes, please share it J By Nikolay Soroka, Android Engineer at Stanfy.