Develop Reference

Making the Button's align_parentBottom = "true" when other view's height is not Zero

First the title may look senseless but I don't know how I describe my problem well in the title.
I have a Relative layout which has 2 buttons (Past games and Upcoming Games) and 2 listviews. Whenever a button is pressed the associated listview is collapsed (height will be zero) if it is already expanded or the reverse will happen. ( i used this solution)
Problem:
Everything is fine when I run it on a 5-inch screen phone. Please see the following picture:
[![][2]][2]
But if I run it on a 10-inch tablet it looks like this:
[![][3]][3]
The same will happen when it will run on less than 5-inch phone.
My questions
Do I need to make another layout for the tablet? like in the layout-large folder?
or I can use some event(s) in Jave file that dynamically set the buttons align parent bottom property when the listview is not collapsed.
or it can be fixed in my current XML
Below is the code for that part I am asking for help
<LinearLayout
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:layout_marginTop="10dp"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:id="#+id/btnPastGames"
android:layout_width="match_parent"
android:layout_height="30dp"
android:layout_centerHorizontal="true"
android:layout_marginLeft="15dp"
android:layout_marginStart="15dp"
android:background="#color/YellowColor"
android:text="Past Games"
android:textAllCaps="false"
android:textSize="15sp" />
<ListView
android:id="#+id/lvPastGames"
android:layout_width="match_parent"
android:layout_height="255dp"
android:layout_below="#+id/btnPastGames"
android:layout_centerHorizontal="true"
android:layout_marginLeft="17dp"
android:layout_marginStart="17dp"
android:layout_marginTop="5dp"
android:divider="#null" />
<Button
android:id="#+id/btnUpcommigGames"
android:layout_width="match_parent"
android:layout_height="30dp"
android:layout_below="#+id/lvPastGames"
android:layout_centerHorizontal="true"
android:layout_marginLeft="15dp"
android:layout_marginStart="15dp"
android:background="#color/YellowColor"
android:text="Up Coming Games"
android:textAllCaps="false"
android:textSize="15sp" />
<ListView
android:id="#+id/lvUpcomingGames"
android:layout_width="match_parent"
android:layout_height="255dp"
android:layout_below="#+id/btnUpcommigGames"
android:layout_centerHorizontal="true"
android:layout_marginLeft="17dp"
android:layout_marginStart="17dp"
android:divider="#null" />
</RelativeLayout>
</LinearLayout>
If you guys can give me some advice on making the user interface that will run on all screen sizes and densities I will be very thankful
Thanks to anyone who will help me

You are trying to workaround functionality of ExpandableListView. Look at the following page:
http://www.androidhive.info/2013/07/android-expandable-list-view-tutorial/

How to port RelativeLayout from Android source code?

Background
I have a card-like UI on my app, which uses a RelativeLayout.
The problem
Recently I've discovered that on at least one device ( or rom, or andorid version), when I switch to an RTL language (such as Hebrew), everything got messed up.
This has happened only on LG G2 with Android V4.2.2 .
Here's what I see:
If you compare it to the screenshots of the app, you can see this is not how it should look like.
That's even though on all Android devices that I've checked, and on all emulators, I've never seen it (even when switching to Hebrew).
What I've tried
I've tried to fix it by using a GridLayout instead, but that wasn't working well (link here).
I've also tried to use a LinearLayout, but considering there might be issues with it, I've used LinearLayoutCompat instead. It works, but it's not recommended to use so many.
Another thing I've tried is to port the RelativeLayout of Android source code, but this gives me a lot of warnings and errors that are quite hard to handle.
Here's the original XML of the layout, BTW (I've removed the irrelevant stuff, to make it shorter) :
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:descendantFocusability="afterDescendants" >
<ImageView
android:id="#+id/appIconImageView"
android:layout_width="48dp"
android:layout_height="48dp"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_centerVertical="true"
android:adjustViewBounds="true"
android:src="#android:drawable/sym_def_app_icon" />
<LinearLayout
android:id="#+id/appDetailsContainer"
android:layout_width="0px"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toEndOf="#+id/appIconImageView"
android:layout_toLeftOf="#+id/overflowView"
android:layout_toRightOf="#+id/appIconImageView"
android:layout_toStartOf="#+id/overflowView"
android:orientation="vertical" >
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ellipsize="marquee"
android:text="label" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="description" />
</LinearLayout>
<ImageView
android:id="#+id/overflowView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:src="#android:drawable/sym_def_app_icon" />
<ImageView
android:id="#+id/isSystemAppImageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:src="#android:drawable/sym_def_app_icon" />
</RelativeLayout>
The question
As I use RelativeLayout, how can I port the code from the official source code of Android?
Is there maybe a library that does it?

How to achieve this kind of layout in Android

I'm new to Android development and I'm trying to achieve a layout for my app that is capable of handling different screen resolutions/ratios.
I've been reading a lot of the documentation and questions on this site to try to understand the basics and concepts.
First I went through:
developer.android.com/guide/practices/screens_support.html
And questions like:
stackoverflow.com/questions/6403619/how-to-support-all-the-different-resolutions-of-android-products
I've got a pretty basic idea on how to handle things out. But still, its pretty difficult for a starter to get going, and I found myself stucked trying to achieve the solution I came up with.
I designed my app to a target resolution of 480x800, and set it up to always show in portrait mode.
This is how it looks like and how I understand it should work (I used Waldo for the sake of example haha):
(sorry for the link, I need 10 rep to post images)
http://i.imgur.com/KXTAXir.jpg
My root Layout is a LinearLayout, wich contains 3 other Layouts being A and C set up to a weight of 0.8 while B is at 8.4. This is all fine, but the contents of B are set up to DP units at the moment just to be able to test.
B consists of a frame Layout who has 3 other Layouts inside, where 2 of them are working fine, and shown only when needed. The problem is that I need B to be able to adapt based on the contents of it first child: a LinearLayout wich contains 2 ImageView and 1 ProgressBar. I need that those ImageView always keep their ratio.
Here is an example of how it should work:
http://i.imgur.com/cH7fUze.jpg
Imagine those 4 are real screens, wich vary in ratio and size. So my app should only adapt B (from my first image) to keep the images original ratio.
Here is the layout code:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/darkgray"
android:orientation="vertical" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.8"
android:background="#666666" >
<TextView
android:id="#+id/level_text_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:text="LEVEL"
android:textAppearance="?android:attr/textAppearanceSmall" />
<TextView
android:id="#+id/level_text_score"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:text="SCORE"
android:textAppearance="?android:attr/textAppearanceMedium" />
<TextView
android:id="#+id/level_text_clock"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:text="01:59"
android:textAppearance="?android:attr/textAppearanceSmall" />
</RelativeLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="8.4" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="match_parent"
android:layout_height="200dp"
android:adjustViewBounds="true" />
<ProgressBar
android:id="#+id/progressBar1"
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:max="1000"
android:progress="0" />
<ImageView
android:id="#+id/imageView2"
android:layout_width="match_parent"
android:layout_height="200dp"
android:adjustViewBounds="true" />
</LinearLayout>
<RelativeLayout
android:id="#+id/pauseMask"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#000000"
android:visibility="gone" >
</RelativeLayout>
<RelativeLayout
android:id="#+id/gameoverMask"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#FFFFFF"
android:visibility="gone" >
</RelativeLayout>
</FrameLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.8"
android:background="#666666" >
<TextView
android:id="#+id/level_text_status"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:text="0/0"
android:textAppearance="?android:attr/textAppearanceMedium" />
<Button
android:id="#+id/button1"
style="?android:attr/buttonStyleSmall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:text="Button"
android:onClick="useHint" />
<Button
android:id="#+id/button2"
style="?android:attr/buttonStyleSmall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toLeftOf="#+id/button1"
android:layout_centerVertical="true"
android:text="Button"
android:onClick="toggleSound" />
<Button
android:id="#+id/button3"
style="?android:attr/buttonStyleSmall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toLeftOf="#+id/button2"
android:layout_centerVertical="true"
android:text="Button"
android:onClick="togglePause" />
</RelativeLayout>
The last thing that stays unclear to me is how to handle the text and button sizes. Should I set them in DPs? How do I get them to scale accordingly like it can be seen on the bottom of my second picture.
Thank you for your help, I also want this to serve as an example to others that are having trouble to understand how to handle this kind of scenarios.

I'm not sure, if I got your question right.
However, you can specify different layouts for different screen sizes and orientations, as described here: http://developer.android.com/guide/practices/screens_support.html
Just give the respective suffix in the name of your layout XML file.

I ended up creating a custom View for my images. The view calculates the space thats left on its parent, scales the images manually and then resizes itself to the same size of the resulting image.
To resize the progress bar to have the same width as the images, I used a custom listener that gets triggered when my custom views get resized. Then I resize the progressbar to match their width.
With this I achieved what I wanted, a layout that will work perfectly in all screen sizes.

Designing simple android layout?

I'm having a little trouble laying out my android app. I didn't plan it out very well, and i'm not new to java, but im new to these android xml layouts. What i have is a horizontal linear layout parent, which contains two relative layouts. The right relative layout consists of a custom view (GridView) and under it i want 3 buttons. I've added one button (button1) to my xml file and it won't show up on screen as you can see. I'm thinking i need to set the size of my gridview some how? Its height is 2x its width. Or can i set it by pixels programatically at runtime?
I'm also thinking i sort of over complicated things at this point. Like i said i'm new to these weird layouts, im used to just using x and y offsets in .net. Maybe this could all be done in one relative layout instead of using two and nesting them inside a linear layout?
Here's what i got so far:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal" >
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="match_parent" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:text="#string/next" />
<com.mydomain.tetrisv2.PreviewGridView
android:id="#+id/previewGridView1"
android:layout_width="100dp"
android:layout_height="150dp"
android:layout_alignParentLeft="true"
android:layout_below="#+id/textView1" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/previewGridView1"
android:text="Score: " />
</RelativeLayout>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="match_parent" >
<com.mydomain.tetrisv2.GridView
android:id="#+id/gridView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="50dp" />
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/gridView1"
android:text="Button" />
</RelativeLayout>
</LinearLayout>
I can't post images but heres the visual result: http://i50.tinypic.com/orscgi.png
Also side note (unrelated), this is a project for experimentation and learning purposes but are there any legal copyright repercussions to making a tetris game and putting it on the play store?

Just change our right sides gridview's below button to this code
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true" // change is here
android:text="Button" />
Hope this will help you..

Exercise: views, layouts and buttons to create android GUI

Ok, so I'm pretty noobish to android but starting to get the hang of it. Before I move on I would like to ask for some general feedback for creating android GUI using API views, lists and layouts. For the sake of exercise I will use GUI as an example:
http://imgur.com/71NmI
Let's say I want the buttons (and perhaps the "Something") to be able to interact with whatever is in the RelativeLayout. In general, what is best practice for creating such a GUI and what API elements would you use to achieve it?
[Removed unnecessary questions]
Any comments, both general and specific, as well as examples are highly appreciated!
Edit: I have looked through your guide, #Mark Lapasa, thanks for an introduction of the basics. My suggested xml-file is then like this:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout android:layout_width="fill_parent"
android:layout_height="fill_parent"
xmlns:android="http://schemas.android.com/apk/res/android">
<ImageView android:id="#+id/header"
android:layout_width="match_parent"
android:background="#drawable/header" android:layout_height="30dp">
</ImageView>
<RelativeLayout android:id="#+id/leftLayout"
android:layout_height="match_parent"
android:layout_width="wrap_content"
android:layout_alignParentLeft="true" android:layout_below="#id/header">
<Button android:text="Left btn1"
android:id="#+id/leftBtn1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"/>
<Button
android:text="Left btn2"
android:id="#+id/leftBtn2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/leftBtn1"/>
<Button
android:text="Left btn3"
android:id="#+id/leftBtn3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/leftBtn2"/>
</RelativeLayout>
<RelativeLayout android:id="#+id/rightLayout"
android:layout_height="match_parent"
android:layout_width="wrap_content"
android:layout_alignParentRight="true" android:layout_below="#id/header">
<Button android:text="Right btn1"
android:id="#+id/rightBtn1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true" android:layout_marginTop="5dp"/>
<Button
android:text="Right btn2"
android:id="#+id/rightBtn2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/rightBtn1"/>
<Button
android:text="Right btn3"
android:id="#+id/rightBtn3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/rightBtn2"/>
</RelativeLayout>
<ImageView android:id="#+id/footer"
android:layout_width="match_parent"
android:background="#drawable/footer" android:layout_height="20dp" android:layout_alignParentBottom="true">
</ImageView>
<RelativeLayout android:id="#+id/gameLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#id/footer"
android:layout_below="#id/header"
android:layout_toLeftOf="#id/rightLayout"
android:layout_toRightOf="#id/leftLayout">
</RelativeLayout>
</RelativeLayout>
This works fine. However, this isn't best practice. I now have a total of four RelativeLayouts to work with. Is there some smooth solution to achieve this without using unnecessary system resources and power like this? Also, how is the best way to set the widths and heights so that they are device independent?

Looks like you are new to Relative Layouts. You might want to try my visual tutorial on it cause I had a hard enough time with the docs:
A Visual Guide to Relative Layouts In Android
http://knowledge.lapasa.net/?p=334

I have used some time on this and think the best way to achieve such results is to use fragments.