I am using Splash screen compat library.
I am using an AVD XML (pic 1 below). When I run on android 12 (on emulator via launchbar), I see some animation happening , but my icon is clipped (as in pic 2).
.
Referring Dimensions in documentation here , it says
The icon area must be 432 dp
The inner two-thirds of the image is
visible on the launcher icon, and must be 288 dp
Point a, I was able to correct in the xml by specifying
android:width="432dp"
android:height="432dp"
But Point b, I am unable to understand. What exactly needs to be 288 dp.
I also looked at the xml given in example starter kit .
<vector
android:width="432dp"
android:height="432dp"
android:viewportWidth="432"
android:viewportHeight="432">
I don't see a 288 value anywhere.
What am I missing ?
My AVD xml looks like follows :
<vector
android:name="vector"
android:width="432dp"
android:height="432dp"
android:viewportWidth="192"
android:viewportHeight="192">
<path....
I found my mistake.
Viewport dimensions need to be 288 (as mentioned in documentation of splash screen icon) . This displays perfectly in both android 11 and 12.
android:name="vector"
android:width="432dp"
android:height="432dp"
android:viewportWidth="288"
android:viewportHeight="288">
Related
I have a problem and I don't know how to solve it.
I am trying to make an adaptive android app icon. That's the code for it:
<?xml version="1.0" encoding="utf-8"?>
<adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">
<background android:drawable="#drawable/launcher_backg" />
<foreground android:drawable="#drawable/logo" />
</adaptive-icon>
That's what it looks like:
As you can see, the foreground is way too big. I don't want that, and I don't know how to fix it. I had a workaround, where I just scaled the foreground until it was small enough. The problem then is, that I don't know what the best size is and all, and I'm sure, there is a better solution.
The foreground is a png and the background a vector graphic.
How can I make the foreground to be the perfect size for an android app icon.
As you can tell from this reference the following sizes need to be provided:
In Android 7.1 (API level 25) and earlier, launcher icons were sized at 48 x 48 dp. You must now size your icon layers using the following guidelines:
Both layers must be sized at 108 x 108 dp.
The inner 72 x 72 dp of the icon appears within the masked viewport.
The system reserves the outer 18 dp on each of the 4 sides to create
interesting visual effects, such as parallax or pulsing.
I have an idea for an application for Android. I have a decent background in Android but I have never encountered a problem like the one I am currently facing.
Background
I am creating an overlay activity on top of WhatsApp. When you launch WhatsApp a red circle shows on the overlay activity and it needs to be entered exactly above the "new chat" button in the latest version of WhatsApp (Android Lollipop).
This is easy when positioning with DP on a specific device but this circle will not be in the correct location if I test the app on my LG G3.
The obvious answer is that I would create a xxhdpi layout too, but the problem is that this circle needs to be dynamic, so if I want it to be above the search button, it needs to be there.
Question in a sentence
My question is based on margins in DP on a specific device, how can I make sure the circle appears in the exact same position on all other devices that have the same version of WhatsApp?
Example: On Note 3 (1080p, 388 PPI) margin right is 30dp, How do I use the resolution knowledge and DPI knowledge to make the circle appear in the same place on my LG G3 (1440p, 538 PPI)
What I have tried
Firstly the dumb approach at positioning it correctly on phone one with dp and running on phone two (Failed)
Second I tried positioning according the width of screen in pixels times a percent (I.E. screen_width * 0.75) so the circle will appear always at position x 75% of the screen (Failed due to screen density? 1)
Thirdly I tried the same approach as my second attempt but instead of raw pixels I used the total screen DP and used that as my relative measure (I.E. screen_width_dp * 0.75) so the circle will appear always at position x 75% in dp of the screen. (Failed 2)
Notes
In all tests I made sure that the units I am working with are correct, for example if I had screen_width_dp x 0.75 I made sure to convert the DP into PX before setting the margins.
1 - Why would this fail? using screen resolution ratios.
2 - Why did this try fail as well?
This was tested on Note 3 (1080p, 388 PPI) as base phone, and LG G3 (1440p, 538 PPI) as secondary phone that the circle should move relatively to be placed correctly on.
Thanks!
What sizes should the image be for each phone size (HDPI, MDPI, XHDPI, XXHDPI) in the navigation drawer like this one?
It should be 24dp. Refer image from material design specification for navigation drawer.
For entire specification of navigation drawer check out this link http://www.google.com/design/spec/patterns/navigation-drawer.html
According to the Google I/O 2015 App source code, it should be 40dp
You can check it here:
https://github.com/google/iosched/blob/master/android/src/main/res/layout/navdrawer.xml
Lines 72 and 73. You will see:
android:layout_width="#dimen/navdrawer_profile_image_size"
android:layout_height="#dimen/navdrawer_profile_image_size"
And, in the dimens.xml file (https://github.com/google/iosched/blob/master/android/src/main/res/values/dimens.xml), in line 136, you will be able to check that the dimen value is:
<dimen name="navdrawer_profile_image_size">40dp</dimen>
I personally found it the perfect size. It's the same used in the Gmail App, if I'm not wrong.
Edit:
I've tried and didn't achieved to get the same size than the Google I/O App, even using their exact dimen variables.
So I've created and measured the sizes, following the rules of the Google specs (https://www.google.com/design/spec/patterns/navigation-drawer.html#navigation-drawer-specs) and I achieved this which looks quite similar to Gmail and Google I/O Apps:
Hope this helps,
If you are designing in Photoshop or something similar and you need to work in pixels, the ratio of the navigation drawer image should be 16:9
In xxxhdpi folder it should be 1216 x 688 (pixels)
You might want to have your icons auto-generated (to give you the right sizes).
See Android Asset Studio.
Just select an ICON that you want from their collection (or UPLOAD one of your own), and choose the parameters (colors, etc) to match your project, and download..
You'll probably want this flavor of icons: Action bar and tab icons
The size should be based on device size for that use below icon sizes.
mdpi : 24 x 24 px
hdpi : 36 x 36 px
xhdpi : 48 x 48 px
it will fit based on device size.
I'm trying to create a background image for my app that will look sharp on all resolutions/orientations.
I'm new to android development, but I understand the easiest way to achieve this is to use 9 patch images. I thought I understood how they worked, but I can't get it to work.
I've created a background image # 768 x 1280 which is the resolution of my Nexus 4. When I don't 9 patch it and view it on my device, it looks fine (obviously, because the resolution/orientation matches the device's):
So it looks nice and sharp.
But then I add the patches onto the image using the drawer9patch.bat file and rename the file to '.9.png' and this is the result:
Knackered!
The strange thing is: in the preview pane in the right hand side of the draw9patch tool it all looks fine....
I've also tried making the image at a smaller resolution, but the logo & text don't look sharp; they look pixelated...
I feel there must be some vital piece of the puzzle I'm missing? The area I've defined as content is being stretched?
Here is my layout code:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#drawable/my_background_image_patched"
android:padding="0px">
<!-- Login controls here --->
</RelativeLayout>
Here is my 9 patch image (which is located to the 'drawable' folder):
OK, I tinkered with your 9 patch.
I must say it was poorly designed (72 dpi, while it should really be 320 dpi).
So, I redesigned it (you can see I moved the black pixels) and saved it to 320 dpi (in the drawable-xhdpi folder).
It seems it scaled well at ldpi and mdpi screens (so, I guess it will also scale well at hdpi):
The patch I used is this:
Try to generate Nine-Patch using this Nine-patch Generator allows you to quickly generate simple nine-patches at different screen densities, based on the specified source artwork
Quick question I'm trying to change my app's launch icon but it doesn't seem to want to change. I changed the dimensions of it to the following for the variety of screen sizes as seen here: http://developer.android.com/guide/practices/ui_guidelines/icon_design_launcher.html
36 x 36 for ldpi
48 x 48 for mdpi
72 x 72 for hdpi
Plus in the android manifest file I added the following line:
<application android:icon="#drawable/iss" android:label="Endeavor">
Yet when I run the app and look for it on the phone it's basic launch icon is the default android green icon. What's the problem here?
Try uninstall app and reinstall.... Sometimes the icon does not update :s
The three icons (for different dimensions) need to be saved respectively as
drawable-ldpi/iss.png
drawable-mdpi/iss.png
drawable-hdpi/iss.png
Then with your manifest they should be picked up. Also, I suggest you move your "Endeavor" value of android:label to your string resources file (usually strings.xml) and change the value here to refer to it. It'll save you a lot of pain later - trust me.