Discussion Forums  >  Capturing Images, Uploading Data

Replies: 8    Views: 3467

hasher13
Android Fan
Profile
Posts: 376
Reg: Jul 21, 2012
Wethersfield
8,060
12/19/13 03:11 PM (6 years ago)

Image size for Andoid tablet 7 and 10 inch

Looking to expand my apps to 7 and 10 inch tablets and was wondering if anyone has a quick reference of image sizes for these devices. Also when I do have the images which folder do I place them in for eclipse?

Also is there a different size for the images that I am using for the tab layout?

Thanks and sorry for all the questions.
Howard
 
SmugWimp
Smugger than thou...
Profile
Posts: 6316
Reg: Nov 07, 2012
Tamuning, GU
81,410
like
12/19/13 06:14 PM (6 years ago)
Image sizes will vary, depending on the resolution of the device.

With Android, there are so many devices, that it's hard to get 'everything' perfect.

However, you can get close using the following image 'guidelines'.

xlarge screens are at least 960dp x 720dp
large screens are at least 640dp x 480dp
normal screens are at least 470dp x 320dp
small screens are at least 426dp x 320dp

With that in mind, you'll want to read this for some guidance…

http://coding.smashingmagazine.com/2011/06/30/designing-for-android/

Hope this helps!

Cheers!

-- Smug
 
hasher13
Android Fan
Profile
Posts: 376
Reg: Jul 21, 2012
Wethersfield
8,060
like
12/19/13 06:32 PM (6 years ago)
Thanks Smug
 
hasher13
Android Fan
Profile
Posts: 376
Reg: Jul 21, 2012
Wethersfield
8,060
like
12/19/13 06:44 PM (6 years ago)
Wow that is a lot of sizes!! So I am mainly concerned about my images for the plugin "menu with images" and my icon size for the "menu button" plugin. Does the rule above apply for those?

Thanks again,
Howard
 
SmugWimp
Smugger than thou...
Profile
Posts: 6316
Reg: Nov 07, 2012
Tamuning, GU
81,410
like
12/19/13 11:31 PM (6 years ago)
Yes and no.

Fortunately, Susan (and Chris) have done a bit of the heavy lifting with respect to the Menu with Image plugin (and MWI advanced). Different from other plugins, you only need to supply a high resolution image (up to 1536 x 720) and the plugin will automatically resize to the device.

Keep in mind however, that the filesize for such an image could also hinder the Android memory management; I try to keep the filesize as small as possible, and bundle it with the app so users don't have to download a copy.

On the menu buttons however, device rules apply. You'll want to create separate images for each android resolution. It sounds a bit tedious, but it's really not (unless you do things manually). What I will typically do is create art in a larger scale (usually much larger than I plan to use anyway) and then utilize a script to create my sized images.

There are things like that available here:

http://android-ui-utils.googlecode.com/hg/asset-studio/dist/index.html

But eventually you'll find something perfect for your particular workflow.

Cheers!

-- Smug
 
hasher13
Android Fan
Profile
Posts: 376
Reg: Jul 21, 2012
Wethersfield
8,060
like
12/20/13 06:14 AM (6 years ago)
Holy Crap, at a quick glance of that link it looks perfect. I do all my artwork in Photoshop, large scale then size it down like you do. So hopefully there is not too much work ahead of me, especially with the above link.

Thank you again,
Howard
 
hasher13
Android Fan
Profile
Posts: 376
Reg: Jul 21, 2012
Wethersfield
8,060
like
12/20/13 06:21 AM (6 years ago)
Just a quick follow up, once I make the images and download them. I assume I would place them in the same folders that they are in Eclipse. Also back to your statement of keeping the app file size small, when someone downloads the app do they get all files including all the different sizes or just the files for thier particular device?

Thanks,
Howard
 
SmugWimp
Smugger than thou...
Profile
Posts: 6316
Reg: Nov 07, 2012
Tamuning, GU
81,410
like
12/20/13 06:44 AM (6 years ago)
It sort of works like this…

in iOS, you 'bundle' two images:

imageName.png

and

imageName@2x.png (for retina devices, automatically chosen by Xcode when needed)

in Android, you'll keep the same name, and place the image in the appropriate directory:

\res\drawable\imageName.png <-- the 'fallback' in case there isn't anything in the 'right' directory
\res\drawable-ldpi\imageName.png
\res\drawable-mdpi\imageName.png
\res\drawable-hdpi\imageName.png
\res\drawable-xhdpi\imageName.png

This applies to 'any' image resource; images, icons, whatever…

When I say 'fallback' I mean, if a user opens your app using an hdpi device, and the appropriate image is not available in the drawable-hdpi directory, it will look in the 'drawable' directory as a 'last resort'. If you only add images in one directory, the 'res\drawable' is the one you want to use.

On either Android or iPhone, if you call an image by URL that's the image you're going to get, regardless of device or resolution. Your server will not pick and choose for you. So make sure it's the right image for the largest variety of devices.

if you're going to create for both platforms, use the Android naming conventions for your image filenames. iOS is a lot more tolerant for filenames, and some iOS filenames will NOT work on Android. It makes creating one app for two platforms a little more tedious otherwise.

start your image name with a lower case letter only. Simplest solution around.

Cheers!

-- Smug
 
hasher13
Android Fan
Profile
Posts: 376
Reg: Jul 21, 2012
Wethersfield
8,060
like
12/20/13 10:56 AM (6 years ago)
Wow, great! Also when I went to the website, I see that it says for the tabs and menu icon it will be for prior Android 3.0.

My app is now for 3.0, so can I not use them?

Thanks again,
Howard
 

Login + Screen Name Required to Post

pointerLogin to participate so you can start earning points. Once you're logged in (and have a screen name entered in your profile), you can subscribe to topics, follow users, and start learning how to make apps like the pros.