[Q] Drawable resources - Java for Android App Development

I am new to Android and I am trying to learn it by doing a pet project. I want to display some images on the screen. I have added the images of different resolutions in the corresponding drawable folders and on small devices it looks great, but on large screens the images are very small. How can I make the images look bigger on bigger screens? I have noticed that the Nexus 4 and Nexus 7 are sharing the same drawable folder(xhdpi) and it looks perfect on Nexus 4, but too small for Nexus 7(both 1st and 2nd editions) and Nexus 10. I thought about modifing the width and height of image view in the coresponding layer.xml, but I don't think that's the best solution.
My code for an image is as follows:
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/doneAddingButton"
android:id="@+id/imageMars"
android:src="@drawable/mars"
android:contentDescription="@string/content_desc_mars"
android:layout_toRightOf="@+id/imageEarth"
android:layout_margin="5dp"
android:adjustViewBounds="true"/>

sw folder
I'll suggest using separate image (with greater resolution) and separate layout xml file in folder like layout-sw***dp, where *** - number of dp, lower limit for screen width of device, using xml from this folder. For instance, create
Code:
layout-sw600dp
folder, which would be enough for most today's tablets. Then put your layout xml file there and set bigger width and height of your ImageView element. That's it.

syniuhin said:
I'll suggest using separate image (with greater resolution) and separate layout xml file in folder like layout-sw***dp, where *** - number of dp, lower limit for screen width of device, using xml from this folder. For instance, create
Code:
layout-sw600dp
folder, which would be enough for most today's tablets. Then put your layout xml file there and set bigger width and height of your ImageView element. That's it.
Click to expand...
Click to collapse
I have separate images in the drawable folders(same image, different resolutions) but shouldn't Android chose the one which fits best(mdpi, hdpi, xhdpi, etc) and auto-scale it for the screen size(dp to px transform)?

Jaws1992 said:
I have separate images in the drawable folders(same image, different resolutions) but shouldn't Android chose the one which fits best(mdpi, hdpi, xhdpi, etc) and auto-scale it for the screen size(dp to px transform)?
Click to expand...
Click to collapse
If you put different images with the same name in folders like drawable-mdpi and drawable-hdpi - yes. It's my bad actually, you need only to create layout-sw***dp as I suggested earlier

Jaws1992 said:
I am new to Android and I am trying to learn it by doing a pet project. I want to display some images on the screen. I have added the images of different resolutions in the corresponding drawable folders and on small devices it looks great, but on large screens the images are very small. How can I make the images look bigger on bigger screens? I have noticed that the Nexus 4 and Nexus 7 are sharing the same drawable folder(xhdpi) and it looks perfect on Nexus 4, but too small for Nexus 7(both 1st and 2nd editions) and Nexus 10. I thought about modifing the width and height of image view in the coresponding layer.xml, but I don't think that's the best solution.
My code for an image is as follows:
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/doneAddingButton"
android:id="@+id/imageMars"
android:src="@drawable/mars"
android:contentDescription="@string/content_desc_mars"
android:layout_toRightOf="@+id/imageEarth"
android:layout_margin="5dp"
android:adjustViewBounds="true"/>
Click to expand...
Click to collapse
You might try using "android:scaleType=" in XML.

Related

Mobile shell 2.0 Skins (color wallpaper) + Different layout mods - Have fun!

hey guys, heres some themes. go to the custo icon's thread for how - to
i've also attached an example.
enjoy!
oh yea, ppl it'd be nice if everybady can post ready to go themes here.
so it'd be a sorta skins dl page =)
edit
its now possible to have a new bmp per page. see my post on pg2 for the example file.
heres a lil illustration 2 give u an idea..
nice collection
can you teach us how to apply them out?
thank???????????????????
sure.
unzip the files
and replace the ones in your spb mobile shell folder
Heres one I made quickly, at the moment the full colour screen only appears on MS Professional now screen! I'm still trying to figure out how to get it displayed on all screens!!!
Again credit to asefsef!
i was only jk gfreak lol, its a dirty trick.
btw, full screen pic is confirmed to work on other screens, just copy the separator line into their corresponding xml's and point to that same separator bmp for same walls on the screens.
or, point to a diff set of bmp's for different walls per page
asefsef said:
i was only jk gfreak lol, its a dirty trick.
btw, full screen pic is confirmed to work on other screens, just copy the separator line into their corresponding xml's and point to that same separator bmp for same walls on the screens.
or, point to a diff set of bmp's for different walls per page
Click to expand...
Click to collapse
Thanks got it working on all screens except one the "Classic Now Screen" do you know which xml file I have to edit? I thought it was the xml's time and lockscreen but it not those:-/
Just a quickie!! Could someone post a simple intructional on changing the background pic? I have the icons and (still testing) possible layout I want, but I would like to change my background!! I have a simple pic I would like on all my pages, so any help would be appreciated!!!
asefsef said:
i was only jk gfreak lol, its a dirty trick.
btw, full screen pic is confirmed to work on other screens, just copy the separator line into their corresponding xml's and point to that same separator bmp for same walls on the screens.
or, point to a diff set of bmp's for different walls per page
Click to expand...
Click to collapse
I hate to sound incredibly dense, but what attribute did you set to make the separator point to a different bitmap? Or are you talking about using one of the other separators, and substituting a full screen bitmap for them?
As far as I can tell from the XML, specifying <Point Name="Separator3Y" X="0" Y="0"/> implies that the image will be coming from a specific bitmap.
RoboDad said:
I hate to sound incredibly dense, but what attribute did you set to make the separator point to a different bitmap? Or are you talking about using one of the other separators, and substituting a full screen bitmap for them?
As far as I can tell from the XML, specifying <Point Name="Separator3Y" X="0" Y="0"/> implies that the image will be coming from a specific bitmap.
Click to expand...
Click to collapse
I've got colour background on all screens buy editing xml's time,lockscreen,waether,launcher and spb menu by having this class definition:
<Plugin Class="Spb.LSP.GradBackground" Name="Background">
<Int Name="NoBackgrd" Value="0"/>
<Point Name="Separator3Y" X="0" Y="0"/>
However, except one screen the "Classic Now Screen" don't understand why? I'm sure I'm missing something in lockscreen xml???
gfreek said:
I've got colour background on all screens buy editing xml's time,lockscreen,waether,launcher and spb menu by having this class definition:
<Plugin Class="Spb.LSP.GradBackground" Name="Background">
<Int Name="NoBackgrd" Value="0"/>
<Point Name="Separator3Y" X="0" Y="0"/>
However, except one screen the "Classic Now Screen" don't understand why? I'm sure I'm missing something in lockscreen xml???
Click to expand...
Click to collapse
Right, I also have one image working on all of my screens as well (as far as what you might be missing, I'm not sure, but I do know that whatever is missing will be in lockscreen.xml, most likely in the Detailed layout section).
What my question is, is how asefsef was able to get a different image on each screen.
RoboDad said:
Right, I also have one image working on all of my screens as well (as far as what you might be missing, I'm not sure, but I do know that whatever is missing will be in lockscreen.xml, most likely in the Detailed layout section).
What my question is, is how asefsef was able to get a different image on each screen.
Click to expand...
Click to collapse
ok! here's what i've got in lockscreen xml;
<Layout Name="Detailed">
<Plugins>
<Plugin Class="Spb.LSP.GradBackground" Name="Background">
<Int Name="NoBackgrd" Value="1"/>
<Point Name="Separator3Y" X="0" Y="0"/>
the above class definition works for "Professional Screen Now" however if I do the same for Classic screen under the following class definition:
<Layout Name="Simple">
<Plugins>
<Plugin Class="Spb.LSP.GradBackground" Name="Background"/>
<Int Name="NoBackgrd" Value="1"/>
<Point Name="Separator3Y" X="0" Y="0"/>
not sure whats missing??
and yes I'd also would like to know how asefsef can get different bmp's for screen!
a quick question
gfreek said:
Heres one I made quickly, at the moment the full colour screen only appears on MS Professional now screen! I'm still trying to figure out how to get it displayed on all screens!!!
Again credit to asefsef!
Click to expand...
Click to collapse
do you know how to make it 9 tab selection?
and how have you made it as 4 as you can see there are no icons on the 3rd tab
character said:
do you know how to make it 9 tab selection?
and how have you made it as 4 as you can see there are no icons on the 3rd tab
Click to expand...
Click to collapse
answer to you first question starts from this thread: http://forum.xda-developers.com/showthread.php?t=374335&page=14 you need to go into registry and creat one! I know it's tedious but somewhare in that thread there's even cab fix to get all nine icons working.
As for your second question sorry I don't use the the 4 + 1 tab just the 3 + 1 hence there is no iicon but again if you look in the above thread I've mentioned you will find the htc style 4 + 1 tab!
forgive me for being a noob at spb ... how can i make it 3+1? searched the settings for spb mobile shell
>>> now screen
>>>today
>>> animation
>>> tabs
>>> advanced
>>> theme
>>> weather
still there are no options there for 3+1 or 4+1
am @ lost here
or am I the only one that doesn't understand the term? regarding xml how can i edit it? sorry again i am new with spb shell thanks
gfreek said:
I've got colour background on all screens buy editing xml's time,lockscreen,waether,launcher and spb menu by having this class definition:
<Plugin Class="Spb.LSP.GradBackground" Name="Background">
<Int Name="NoBackgrd" Value="0"/>
<Point Name="Separator3Y" X="0" Y="0"/>
However, except one screen the "Classic Now Screen" don't understand why? I'm sure I'm missing something in lockscreen xml???
Click to expand...
Click to collapse
hey, i changed the classic now screen by editing the files "separator.bmp and separator_m.bmp" instead of separator2
e.g.
<Layout Name="Simple">
<Plugins>
<Plugin Class="Spb.LSP.GradBackground" Name="Background"/>
<Int Name="NoBackgrd" Value="1"/>
<Point Name="Separator2Y" X="0" Y="0"/>
or was it..
<Layout Name="Simple">
<Plugins>
<Plugin Class="Spb.LSP.GradBackground" Name="Background"/>
<Int Name="NoBackgrd" Value="1"/>
<Point Name="Separator1Y" X="0" Y="0"/>
each screen has its own links to a separator right, so for different screens, you make new separators (dupe originals, then rename them to something else, so you have extras, now instead of specifying e.g. separator2.bmp, you specify "separator_hey hey new bmp!.bmp")
i'll post up diff bmp ones soon
heres ya go, 3 diff wallpapers
achieved by vertical shift of separator2 (aka 3y)
one of them is the analog layout
asefsef said:
achieved by vertical shift of separator2 (aka 3y)
one of them is the analog layout
Click to expand...
Click to collapse
DO again, more more mdr please
asefsef said:
achieved by vertical shift of separator2 (aka 3y)
one of them is the analog layout
Click to expand...
Click to collapse
Great work.
I edited other xml files with your code. Now I have background image on all screens.

[Q] Disproportioned images

Hello,
I'm not the direct dev for our app, but we are having this problem:
We have a few images that we are drawing onscreen. I've made separate sizes for hdpi and mdpi. This way, no ugly scaling occurs. For example, here is the hdpi:
Attached (hdpi copy.png) is what it should look like, made in photoshop. And fail.png is what it shows up as in Eclipse. There are a few images that are used:
The slider backgrounds (2)
The sliders (2)
Thanks

Image dpi, bit depth etc?

ok developed an app and just decided to use images for buttons.
Made a nice glossy button in photoshop, added to my app and put it on my HTC HD 2 for a test.
Why does the image not look as smooth? like I can see the blend/gradient lines.
Does the dpi have any effect and bit depth? Image was made at 72dpi
Cheers
DPI only comes into play if you print your image. Bit depth might make a difference. I don't know offhand the color bit depth of the HD2's display, but if it isn't the same as your computer's display, your buttons will look different.
yep its the colour depth. PC, i'm using 32bpp where as most phones are at 16bpp.
What language is the pictures being used in? Recently I've found out that C# uses Bilinear image resizing, which means it inserts estimated pixels in with the image when resizing.
Try the following:
1) save the image as a 24 or 32 bit png
2) make the image the same size as the button
I'm using c# and I'm not resizing the image at all.
The other thing i have noted is that if I add a picturebox to my app and set the image to the same one I'm using for my button, again I make sure I display the image at its actual size, it looks better than what it does for the button.
Why is that?
Same image, displayed at actual size looks, better in a picturebox than it does in my custom control?

How to Optimize Your Flash SWF Files

Flash files are used widely, but when people use it, they always need new demand. People always chase perfect. SWF files optimization is one of the chasing things. Here is the tip for how to optimaiz flash swf files.
General optimization
Please use symbols, animated or otherwise, for every element that appears more than once. You need to use tweened animations when you are creating animation sequences, because these animations occupy less file space than keyframs. Use movie clips instead of graphic symbols for animations sequences. You need to reduce the area of change in each keyframe as possible as you can to make the action happen in as small area as possible. Try your best to avoid animating bitmap elements and use bitmap images as background or static elements.
Colors
You can use Color menu in the Symbol Property inspector to create many instances of a single symbol in different colors. Then you need to use Color Mixer to match the color palette of the document to a browser-specific palette. Use gradients sparingly. You need about 50 bytes for filling an area with gradient color. You can use alpha transparency sparingly because it can slow playback.
Texts and fonts
You need limit the number of fonts and font style. Please use embedded fonts sparingly because they can increase file size. Select only the needed characters instead of including the entire font for Embed Fonts options.
Lines and elements
Do your best to group elements. You can separate elements that minimize the number of separate lines that are used to describe shapes by using layers. Reduce the number of special line types as possible as you can, such as dashed, dotted, ragged. Solid lines require less memory and lines that are created with the Pencil tool need less memory than brush strokes.
With these tips, you need not to spend extra money to buy some software or tool. What’s more, these tips are easy to understand, you are not required much flash knowledge.

[BOOT ANIMATION] aWpTiger's boot animations.

Hello , i am 13 and i like to test lots of things on my nexus 5. Today i decided to create my own boot animations.
Currently i have only one that is attached below and not so exciting , but i'll keep this thread updated with my new creations.
PS : Can you explain me how to put it in the thread? Like a preview
[EDIT] - New boot animation available. Download it below (BAtry2) , it's smoother
aWpTiger said:
Hello , i am 13 and i like to test lots of things on my nexus 5. Today i decided to create my own boot animations.
Currently i have only one that is attached below and not so exciting , but i'll keep this thread updated with my new creations.
PS : Can you explain me how to put it in the thread? Like a preview
Click to expand...
Click to collapse
Welcome!
I'll start with some tips for boot animations on the Nexus 5:
- Frame dimensions should not exceed 1080x768 or 720x1280; any larger and many users experience lockups. (I used to use 1080x720 as a max value, but 768 appears to work OK).
- Frame count in a folder must not exceed 199.
- Keep individual frame files under 200k if at all possible. For a small frame count (less than 20), I'd still target well-under 300k.
- Keep the complete zip archive a reasonable size (my largest zip animation is still under 13mb).
- You're telling a story with the animation; keep the focus to about 9 seconds or less. The animation loop or main part of the animation should either perform a complete cycle or be finished in this time.
- Remove transparencies from the images ("flatten" them). The only time I've seen transparent images in boot animations is as the framework level; a zip animation doesn't benefit from them.
- Always "touch" the 1080 screen width, either with the frames set to a width of 1080 (on a black background), or scaled with the desc.txt to 1080. Some ROMs will stretch the images to 1080. Ex: you have frames that are 640x640; some ROMs will stretch the image to 1080x640.
Your animation:
- Frame images are very large (900k)
- Frame dimensions are large (1080x1920)
- I'm seeing some transparency artefacts left in the image (on images 3 & 4). The transparent areas should be either black or white. I'm guessing that you want them black; they may show up as white areas. Odd that they're there.
Overall, a great start. I like the animation, and what you're doing with 4 frames is cool. Scale the images to 720x1080 (keep the desc.txt file at 1080x1920). If you save the frames as 80 quality jpg images, the files will be under 250k. You could also convert the frames to 256 (8-bit) colors, but that may degrade the overall look of your images. The advantage to JPG is that it will "flatten" the image, as it doesn't support transparency; unfortunately, it will change transparent areas to white.
As far as previews go, you need to have the images or animations on external sites, and call them through the html script. I use Photobucket.com. Some folks use Imgur.com.
androcraze said:
Welcome!
I'll start with some tips for boot animations on the Nexus 5:
- Frame dimensions should not exceed 1080x768 or 720x1280; any larger and many users experience lockups. (I used to use 1080x720 as a max value, but 768 appears to work OK).
- Frame count in a folder must not exceed 199.
- Keep individual frame files under 200k if at all possible. For a small frame count (less than 20), I'd still target well-under 300k.
- Keep the complete zip archive a reasonable size (my largest zip animation is still under 13mb).
- You're telling a story with the animation; keep the focus to about 9 seconds or less. The animation loop or main part of the animation should either perform a complete cycle or be finished in this time.
- Remove transparencies from the images ("flatten" them). The only time I've seen transparent images in boot animations is as the framework level; a zip animation doesn't benefit from them.
- Always "touch" the 1080 screen width, either with the frames set to a width of 1080 (on a black background), or scaled with the desc.txt to 1080. Some ROMs will stretch the images to 1080. Ex: you have frames that are 640x640; some ROMs will stretch the image to 1080x640.
Your animation:
- Frame images are very large (900k)
- Frame dimensions are large (1080x1920)
- I'm seeing some transparency artefacts left in the image (on images 3 & 4). The transparent areas should be either black or white. I'm guessing that you want them black; they may show up as white areas. Odd that they're there.
Overall, a great start. I like the animation, and what you're doing with 4 frames is cool. Scale the images to 720x1080 (keep the desc.txt file at 1080x1920). If you save the frames as 80 quality jpg images, the files will be under 250k. You could also convert the frames to 256 (8-bit) colors, but that may degrade the overall look of your images. The advantage to JPG is that it will "flatten" the image, as it doesn't support transparency; unfortunately, it will change transparent areas to white.
As far as previews go, you need to have the images or animations on external sites, and call them through the html script. I use Photobucket.com. Some folks use Imgur.com.
Click to expand...
Click to collapse
Well , i'll try to make a new boot animation based on your tips . And thanks for your time! If you want subscribe to the thread to see my new animations
aWpTiger said:
Hello , i am 13 and i like to test lots of things on my nexus 5. Today i decided to create my own boot animations.
Currently i have only one that is attached below and not so exciting , but i'll keep this thread updated with my new creations.
PS : Can you explain me how to put it in the thread? Like a preview
Click to expand...
Click to collapse
Oh, and the desc.txt file:
1080 1920 30
p 800 0 part0
Just have "p 0 0 part0". The first zero implies an infinite loop.
androcraze said:
Oh, and the desc.txt file:
1080 1920 30
p 800 0 part0
Just have "p 0 0 part0". The first zero implies an infinite loop.
Click to expand...
Click to collapse
So i have to modify to 0 for an infinite loop?

Categories

Resources