I'm making my app compatible with tablets, and I am trying to understand what the best way of doing this would be.
I have a GridView with images and text under each image. Currently the height of each image is set to 120dp rather than wrap_content so that it gets scaled and aligned properly to its height and everything looks even. The orientation change works great, and the GridView changes from 2xN to 3xN automatically.
Now that I want to put it on a tablet, the GridView ends up being 5xN and 7xN depending on orientation (on a 10" tablet). However, to make the GridView look better, I would rather change the image height to a larger value (say 300dp) and have fewer items that are larger in size. What's the best way of doing this?
I don't want to pull out just the element and replicate all its values, changing just one. Ideally, I'd like to simply be able to put the height value into something like strings.xml and strings-xlarge.xml, and then reference it from the layout. Is that possible? I really hate duplicating code/resources.
Thank you.
What you're looking for is the dimen tag. It works similarly to the string tag but for dimensions. You can have something like this in values/dimens.xml:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<dimen name="image_size">120dp</dimen>
</resources>
And in values-xlarge/dimens.xml:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<dimen name="image_size">300dp</dimen>
</resources>
Your XML can reference the size by #dimen/image_size and everything will be taken care of for you. You can also programatically access it with getResources().getDimension(R.dimen.image_size) from Context.
Note that as of 3.2, you can use pixel requirements (such as w720dp) in your resource names instead of "buckets" like xlarge. More info here.
Related
I may be trying to do something that is not possible. I am writing an app that is using a picture of a remote control as its background, and then I am placing buttons on top of the background using relative layout and margins to position the buttons correctly. I thought I would be able to specifiy different margins in different layout files, but it will only take the margins from the main layout file (the one in /layout). I have two layouts for xxhdpi and xhdpi, and the proper graphics are being picked up, but I can't for the life of me figure out how to move them a different amount based on the screen size. I can get one screen size to look fine, but then the other ones are messed up, no matter what I put in the respective xml files. Is it even possible to do this?
Thanks....
you can place the relative layout anywhere on the view in run time. Here is the sample code this may help you.
RelativeLayout DispView = new RelativeLayout(this);
RelativeLayout.LayoutParams DispViewLayoutParams = new RelativeLayout.LayoutParams(w,h);
DispViewLayoutParams.addRule(RelativeLayout.RIGHT_OF, someview.getId());
DispViewLayoutParams.addRule(RelativeLayout.BELOW, someview2.getId());
DispViewLayoutParams.setMargins(x,y,0,0);
Mainview.addView(DispView , DispViewLayoutParams );
You have to create dimens file under various values folders (values,values-ldpi-v6, values-mdpi-v6 etc.) to specify different margins and the system will automatically pick the relevant values based on the screen resolution.
For example
<?xml version="1.0" encoding="utf-8"?>
<resources>
<dimen name="call_log_margin">4dp</dimen>
<dimen name="no_call_log_margin_left">10dp</dimen>
</resources>
Use these values "call_log_margin" and "no_call_log_margin_left" in your layouts .These will have different values in different dimens.xml
My designer has given me the following layout (a little bit changed to protect my business :)
Now, I am facing a lot of doubts as how I can incorporate every element to my android layout.
As you can see, the background has a light noise to it. I tried creating a 9patch from it, but when loading in Android, I completely lost the quality of the imaged. It stretched out weirdly. Should I have one background for the different resolutions (ie. mdpi, hdpi... ) or can this be achieved with 9 patch
What to do with the button? I tried saving the button (which in photoshop it is a group) into a new image and saved it as a PNG. When loading in the layout with a ImageButton and trying on my phone, the button is just too big. How can I guarantee the size of the button on different type of screens? Will I need different sizes of this button for different resolutions (mdpi... ) and if so, how will I know what is the size of this button for a hdpi resolution, or for a mdpi resolution? Or maybe I should force the width and height of the button to a value like 60dp, but that doesn't sound right to me. I understand I can create a shape and apply it to the background of the button but, what about the Facebook button? I imagine that, in that case, I will need a ImageButton with the PNG as background.
I know this is late as hell but hopefully it will help others.
1) Ask your designer for a repeatable image that you can tile for the background. I don't see any reason why it couldn't be tiled. To tile an image make an xml file of type drawable for each of the generalized dpi folders. Put this code in the xml file:
<?xml version="1.0" encoding="utf-8"?>
<bitmap xmlns:android="http://schemas.android.com/apk/res/android"
android:dither="true"
android:src="#drawable/piece_of_the_background_that_can_be_repeated"
android:tileMode="repeat" />
Set the background drawable to this xml file.
2) Set a 9patch image as the button background and use this custom textView for the text. Use the innerShadow attribute to get the shadow effect your designer shows.
I would like to know whether there is such possibility to customize the screen size on Android devices? Something like using half part of the screen and the other half is blank.
For this kind of problems, you can work with percentage. There are 2 common ways:
in java:
You can get the display height from your used lcd-panel and then multiply with your number of percents. In this way, you have to format the button in your activity.
in layout xml:
You should design your layout within the xml-files and not in java code (my oppinion). Use layout-weight like following post: set position size of ui element as percentage of screen size
I am wondering as a new Android developer (10+ years C# OOP) which would be the better way to create a simple repeating background. The background will be consistent no matter the screen size, density, or orientation. I've read the Android Developers Dev Guide about things such as supporting multiple screens, nine patch drawables etc. I have seen tutorials such as this one (http://androidforbeginners.blogspot.com/2010/06/how-to-tile-background-image-in-android.html) telling you how you can use an image and get it to repeat.
Of course using an image then you have to provide multiple images for multiple densities or risk bitmap scaling and pixelation. For a complex background pattern I can see how this might be the way to go. But my pattern is a simple grid pattern so isn't there a better way using just xml?
I looked at GridView and TableLayout and both allowed me to set a background color, specify cell width / height, but I did not see a way to specify the grid line color.
For now I am using the slightly older 2.3.3 api as that is the largest version currently in use.
I don't suspect I'll need much hand holdong just some good solid advise from those who know better than I.
Thank You
JB
You can create a drawable like this:
<?xml version="1.0" encoding="utf-8"?>
<bitmap xmlns:android="http://schemas.android.com/apk/res/android"
android:src="AndroidPuzzlesSolver/#drawable/bg_tile"
android:tileMode="repeat"
android:dither="true" />
Place the above in a "background.xml" file at the drawable folder. Then you can use it in your layout like this:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:background="#drawable/background">
You can use a background with all Layouts.
I don't think there is an out-of-the-box way to do an alternate repeat, e.g. show one image at some places and another one in some others. If you want something like this, then you would probably need to implement your own View and override the onDraw method. You could use a FrameLayout to combine this background View with any other elements.
I have a problem in android application interface design(GUI).
For example when we insert an editText field the height is too big. Yes we can change the width and bit modify.
But does anyone have any link of a reference or idea of how to design the exact design we want. And when we add 2 -3 editText(views) the entire space finish. have to scroll to go through entire page.
And to design the GUI for all kind of screen sizes, what are the standard things that have to follow. I searched but didn't find exact answer.
Any link to a good reference or idea is highly appreciated.
Thank you
set the layout of text edit with:
layout_width="wrap_content" //wrap_content fill the dimension like the content and fill_content all the space free
layout_height="wrap_content"
In order to make your app resolution free you have to take care for the following items
Widgets in your activity (wrap_content, match_parent, fill_parent, or left, right gravity in relative layout etc)
Icons and Images in your activity (You have to keep icons of 3 different sizes in 3 different drawable folders, hdpi, mdpi and ldpi and if you are making your app for tablets also then xdpi (i think))
You have to provide similar text sizes for different screen sizes (3 sizes should be suffice I believe) You can make a general xml file for this and keep it in another drawable folder.
Let me know if you need more detail on this.