Develop Reference

Same layout but moved a bit to the right

I have 2 different layouts.
<ch.yourclick.kitt.classes.CopyBarVisualizer xmlns:custom="http://schemas.android.com/apk/res-auto"
android:id="#+id/bar_top"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_centerHorizontal="true"
custom:avColor="#D11817"
custom:avDensity="0.0"
custom:avGravity="bottom"
custom:avSpeed="fast"
custom:avWidth="20dp" />
<ch.yourclick.kitt.classes.CopyBarVisualizer xmlns:custom="http://schemas.android.com/apk/res-auto"
android:id="#+id/bar_bottom"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_centerHorizontal="true"
android:layout_marginTop="100dp"
android:rotation="180"
app:avColor="#D11817"
app:avDensity="0.0"
app:avGravity="bottom"
app:avSpeed="fast"
app:avWidth="20dp"
/>
The second one has a rotation of 180 and has been placed below the first one.
My problem is that the one below, looks like it has been moved a little bit to the right and I have no idea why. This is how it looks like:
As you see, they are not on the same lines.
I have tried to fix the second one with
android:layout_marginRight="1dp"
but that is not doing anything (probably because I am using android:layout_centerHorizontal="true").
How can I fix that?

I could fix that issue by adding RelativeLayout to each of these layouts. So RelativeLayout will be centered and so I can use the attribute android:layout_marginRight for the second layout to move it more to the left.
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
>
<ch.yourclick.kitt.classes.CopyBarVisualizer xmlns:custom="http://schemas.android.com/apk/res-auto"
android:id="#+id/bar_top"
android:layout_width="100dp"
android:layout_height="150dp"
custom:avColor="#D11817"
custom:avDensity="0.0"
custom:avGravity="bottom"
custom:avSpeed="fast"
custom:avWidth="20dp" />
</RelativeLayout>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
>
<ch.yourclick.kitt.classes.CopyBarVisualizer xmlns:custom="http://schemas.android.com/apk/res-auto"
android:id="#+id/bar_bottom"
android:layout_width="100dp"
android:layout_height="150dp"
android:layout_marginTop="150dp"
android:layout_marginRight="2dp"
android:layout_marginEnd="2dp"
android:rotation="180"
app:avColor="#D11817"
app:avDensity="0.0"
app:avGravity="bottom"
app:avSpeed="fast"
app:avWidth="20dp"
/>
</RelativeLayout>

Any Skin Selector Android library

Are there any android library that do:
Shows drawables in either a grid or scroll view.
Allows user to select one of the images and shows his selection.
Allows me to get the selected drawable and show it to the user.
Please see the screenshots to see what I'm trying to achieve.

I have done something like you are thinking about. I will show you that if is useful to you (I think will be, but you must adapt this):
Context: I have created a simple game based in Space Invaders. My game has a main menu (main activity) where the player can press 'PLAY' or scan elect some 'OPTIONS', though a popup.
App main menu image
1 screen: Main menu.
2 screen: Popup appears when I press 'OPTIONS' button. This popup let me choose graphic options (change game background, ally spaceship model and enemy spaship model).
MainActivity.java
optionBoton.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
soundMenu.start();
LayoutInflater inflater = (LayoutInflater) getBaseContext().getSystemService(LAYOUT_INFLATER_SERVICE);
View viewPopup = inflater.inflate(R.layout.popup_activity, null);
popup = new PopupWindow(
viewPopup,
RelativeLayout.LayoutParams.MATCH_PARENT,
RelativeLayout.LayoutParams.WRAP_CONTENT
);
popup.showAtLocation(layoutPrincipal, Gravity.BOTTOM, 0, 0);
ImageButton closePop = (ImageButton) vistaPopup.findViewById(R.id.volver_boton);
closePop.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
soundMenu.start();
popup.dismiss();
optionBoton.setVisibility(View.VISIBLE);
}
});
optionBoton.setVisibility(View.INVISIBLE);
}
});
This code will be inside onCreate method.
Now, you need to design your own XML popup (if you decide to create a popup). Showing a popup is easy, clean and dynamic way to change the graphic options.
popup_activity.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#839ceaac"
android:orientation="vertical">
<ImageButton
android:id="#+id/volver_boton"
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_alignParentRight="true"
android:layout_marginRight="2dp"
android:layout_marginTop="3dp"
android:background="#android:color/transparent"
android:scaleType="centerCrop"
android:src="#drawable/wcerrar" />
<TextView
android:id="#+id/options_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginBottom="6dp"
android:layout_marginTop="5dp"
android:text="Opciones gráficas"
android:textSize="20dp"
android:textStyle="bold" />
<View
android:layout_width="match_parent"
android:layout_height="2dp"
android:layout_below="#id/options_title"
android:background="#9dc8a6" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/options_title"
android:layout_marginBottom="8dp"
android:layout_marginTop="5dp"
android:orientation="horizontal">
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1">
<TextView
android:id="#+id/back_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginBottom="3dp"
android:text="Fondo"
android:textSize="15sp"
android:textStyle="bold" />
<ImageView
android:id="#+id/back_1"
android:layout_width="40dp"
android:layout_height="60dp"
android:layout_below="#id/back_title"
android:layout_centerHorizontal="true"
android:layout_marginBottom="3dp"
android:adjustViewBounds="true"
android:onClick="uploadBack"
android:scaleType="centerCrop"
android:src="#drawable/fondo" />
<ImageView
android:id="#+id/back_2"
android:layout_width="40dp"
android:layout_height="60dp"
android:layout_below="#id/back_1"
android:layout_centerHorizontal="true"
android:layout_marginBottom="3dp"
android:adjustViewBounds="true"
android:onClick="uploadBack"
android:scaleType="centerCrop"
android:src="#drawable/fondo1" />
<ImageView
android:id="#+id/back_3"
android:layout_width="40dp"
android:layout_height="60dp"
android:layout_below="#id/back_2"
android:layout_centerHorizontal="true"
android:layout_marginBottom="3dp"
android:adjustViewBounds="true"
android:onClick="uploadBack"
android:scaleType="centerCrop"
android:src="#drawable/fondo3" />
</RelativeLayout>
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1">
<TextView
android:id="#+id/spaceship_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginBottom="3dp"
android:text="Spaceship"
android:textSize="15sp"
android:textStyle="bold" />
<ImageView
android:id="#+id/spaceship_1"
android:layout_width="40dp"
android:layout_height="60dp"
android:layout_below="#id/spaceship_title"
android:layout_centerHorizontal="true"
android:layout_marginBottom="3dp"
android:adjustViewBounds="true"
android:onClick="uploadSpaceship"
android:src="#drawable/diseno11" />
<ImageView
android:id="#+id/spaceship_2"
android:layout_width="40dp"
android:layout_height="60dp"
android:layout_below="#id/spaceship_1"
android:layout_centerHorizontal="true"
android:layout_marginBottom="3dp"
android:adjustViewBounds="true"
android:onClick="uploadSpaceship"
android:src="#drawable/diseno21" />
<ImageView
android:id="#+id/spaceship_3"
android:layout_width="40dp"
android:layout_height="60dp"
android:layout_below="#id/spaceship_2"
android:layout_centerHorizontal="true"
android:layout_marginBottom="3dp"
android:adjustViewBounds="true"
android:onClick="uploadSpaceship"
android:src="#drawable/diseno31" />
</RelativeLayout>
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1">
<TextView
android:id="#+id/enemy_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginBottom="3dp"
android:text="Enemies"
android:textSize="15sp"
android:textStyle="bold" />
<ImageView
android:id="#+id/enemy_1"
android:layout_width="40dp"
android:layout_height="60dp"
android:layout_below="#id/enemy_title"
android:layout_centerHorizontal="true"
android:layout_marginBottom="3dp"
android:adjustViewBounds="true"
android:onClick="uploadEnemy"
android:rotation="180"
android:src="#drawable/enemigodiseno11" />
<ImageView
android:id="#+id/enemy_2"
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_below="#id/enemy_1"
android:layout_marginBottom="3dp"
android:layout_centerHorizontal="true"
android:src="#drawable/enemigodiseno21"
android:onClick="uploadEnemy"/>
</RelativeLayout>
</LinearLayout>
</RelativeLayout>
Anyway, if you choose to don't use a popup, I will show you how you can send some data to another activity in Android development:
When you press on a graphic option, look at the call "android:onclick". This allows to call a java method to capture the option selected.
Look a simple example of this:
Method example
public void uploadBack(View view) {
switch (view.getId()) {
case R.id.back_1:
result[0] = "back";
break;
case R.id.back_2:
result[0] = "back1";
break;
case R.id.back_3:
result[0] = "back3";
break;
}
}
As you can see, I have an array of Strings with 3 positions. When I click an ImageView, I call the method wich changes the result[i] value. When I press 'PLAY' and I call the game activity, I use putExtra method to send these options and change the game settings.
I hope this serve as a help for your problem.
Have a nice day!

Android Studio: Images behind other images

What I am trying to do seems very basic in theory, but cannot find any information on this on the web. I have a series of clickable imagebuttons, containing images. I would like it so that when a user clicks on one of these imagebuttons, it becomes highlighted with a simple border.
To achieve this, I have created a basic solid-colour 62x62 pixel image and wish to place it -behind- my original 60x60 imagebutton. This will create the illusion of a border. My plan is to set it to non-visible by default and then have the code set it to visible on click. Sounds straight-forward.
However, in my layout, the solid-colour image always sits on top of the original image, and I cannot find any way of sending it behind. I would rather not do this in code, I am sure this is a layout issue (but will set it in code if I absolutely must).
Relevant section of layout, where the ImageView needs to sit behind the player 1 ImageButton:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingLeft="20dp"
android:paddingRight="20dp"
android:paddingTop="20dp"
android:paddingBottom="20dp" tools:context=".MainActivity"
android:id="#+id/Form_PlayerSelection"
android:background="#drawable/dark_wood">
<ImageButton
android:id="#+id/btnPlayer1"
android:layout_width="60dp"
android:layout_height="60dp"
android:src="#drawable/player_blank"
android:adjustViewBounds="false"
android:clickable="true"
android:cropToPadding="false"
android:padding="0dp"
android:scaleType="fitXY"
android:layout_marginLeft="15dp"
android:layout_marginTop="50dp" />
<ImageView
android:id="#+id/p1border"
android:layout_width="62dp"
android:layout_height="62dp"
android:src="#drawable/selectborder"
android:clickable="false"
android:cropToPadding="false"
android:padding="0dp"
android:scaleType="fitXY"
android:layout_marginLeft="13dp"
android:layout_marginTop="48dp"/>
<ImageButton
android:id="#+id/btnPlayer2"
android:layout_width="60dp"
android:layout_height="60dp"
android:src="#drawable/player_blank"
android:adjustViewBounds="false"
android:clickable="true"
android:cropToPadding="false"
android:padding="1dp"
android:scaleType="fitXY"
android:layout_marginLeft="85dp"
android:layout_marginTop="50dp" />
</RelativeLayout>

Each child is added in order and to the top of the ViewGroup. So, the bottom element should be your first child.

Zoom controls for several images in a relative layout

I'm new with android, and I have to make improvements for an existing app. Inside this app we have a relative layout with a group of 15 imageViews, 1 dynamic imageView and two textViews to which I have to program zoom controls for zooming in and out. The last couple of days I've been reading continuously this website to try to find an answer in the existing questions without any results because lots of questions are without an answer.
My biggest problem is that I don't know which frame or layout to use. All the images are placed and working well in the relative layout, but I don't seem to get the zoom controls working with the content and I've read in different threads and questions that the RelativeLayout doesn't work with zoom at all. I thought of maybe using a FrameLayout but I think it has the same problem.
This is the XML code from the layout:
<RelativeLayout
android:id="#+id/relativeLayoutMachine"
android:layout_width="1000dp"
android:layout_height="550dp"
android:layout_above="#+id/relativeLayout1"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:background="#color/brm_back_1" >
<ImageView
android:id="#+id/imageView01"
android:layout_width="82dp"
android:layout_height="67dp"
android:layout_marginLeft="409dp"
android:layout_marginTop="83dp"
android:contentDescription="#id/imageVeuwBandInloopKoker"
android:src="#drawable/lva_bandinloopkoker" />
<ImageView
android:id="#+id/imageView02"
android:layout_width="82dp"
android:layout_height="67dp"
android:layout_marginLeft="409dp"
android:layout_marginTop="149dp"
android:contentDescription="#id/imageViewTussenKoker"
android:src="#drawable/lva_tussenkoker" />
<ImageView
android:id="#+id/imageView03"
android:layout_width="172dp"
android:layout_height="88dp"
android:layout_marginLeft="401dp"
android:layout_marginTop="216dp"
android:contentDescription="#id/imageViewHMI_Graph_04_Flap"
android:src="#drawable/lva_flap_open" />
<ImageView
android:id="#+id/imageView04"
android:layout_width="281dp"
android:layout_height="61dp"
android:layout_marginLeft="401dp"
android:layout_marginTop="303dp"
android:contentDescription="#id/imageViewHMI_Graph_03_Ram"
android:src="#drawable/lva_ram_retour" />
<ImageView
android:id="#+id/imageView05"
android:layout_width="110dp"
android:layout_height="47dp"
android:layout_marginLeft="571dp"
android:layout_marginTop="257dp"
android:contentDescription="#id/imageViewHMI_Graph_01_Unit"
android:src="#drawable/lva_unit" />
<ImageView
android:id="#+id/imageView06"
android:layout_width="51dp"
android:layout_height="54dp"
android:layout_marginLeft="431dp"
android:layout_marginTop="28dp"
android:contentDescription="#id/imageViewHMI_Graph_15_Feeder"
android:src="#drawable/lva_feeder_off" />
<ImageView
android:id="#+id/imageView07"
android:layout_width="90dp"
android:layout_height="40dp"
android:layout_marginLeft="585dp"
android:layout_marginTop="218dp"
android:contentDescription="#id/imageViewHMI_Graph_02_Pump"
android:src="#drawable/lva_main_motor_off" />
<ImageView
android:id="#+id/imageView08"
android:layout_width="199dp"
android:layout_height="124dp"
android:layout_marginLeft="157dp"
android:layout_marginTop="240dp"
android:contentDescription="#id/imageViewChannel"
android:src="#drawable/lva_channel" />
<ImageView
android:id="#+id/imageView09"
android:layout_width="82dp"
android:layout_height="166dp"
android:layout_marginLeft="410dp"
android:layout_marginTop="50dp"
android:contentDescription="#id/imageViewHMI_Graph_013_Turbo"
android:src="#drawable/lva_turbo_off"
android:visibility="invisible" />
<ImageView
android:id="#+id/imageView10"
android:layout_width="88dp"
android:layout_height="67dp"
android:layout_marginLeft="402dp"
android:layout_marginTop="149dp"
android:contentDescription="#id/imageViewHMI_Graph_012_Perforator"
android:src="#drawable/lva_perforator_off"
android:visibility="invisible" />
<ImageView
android:id="#+id/ImageView11"
android:layout_width="88dp"
android:layout_height="67dp"
android:layout_marginLeft="408dp"
android:layout_marginTop="149dp"
android:contentDescription="#id/ImageViewHMI_Graph_10_Ruffler"
android:src="#drawable/lva_ruffler_off"
android:visibility="invisible" />
<ImageView
android:id="#+id/ImageView12"
android:layout_width="174dp"
android:layout_height="72dp"
android:layout_marginLeft="362dp"
android:layout_marginTop="146dp"
android:contentDescription="#id/ImageViewHMI_Graph_11_Prepress"
android:src="#drawable/lva_prepress_open"
android:visibility="invisible" />
<ImageView
android:id="#+id/imageView13"
android:layout_width="46dp"
android:layout_height="68dp"
android:layout_marginLeft="356dp"
android:layout_marginTop="297dp"
android:contentDescription="#id/imageViewHMI_Graph_07_Needles_Hor"
android:src="#drawable/lva_needles_hor_none" />
<ImageView
android:id="#+id/imageView14"
android:layout_width="44dp"
android:layout_height="111dp"
android:layout_marginLeft="356dp"
android:layout_marginTop="187dp"
android:contentDescription="#id/imageViewHMI_Graph_05_Needles_Vert"
android:src="#drawable/lva_needles_vert_high" />
<ImageView
android:id="#+id/imageView15"
android:layout_width="10dp"
android:layout_height="24dp"
android:layout_marginLeft="371dp"
android:layout_marginTop="272dp"
android:contentDescription="#id/imageViewHMI_Graph_06_Knotter_Vert"
android:src="#drawable/lva_motor_off" />
<FrameLayout
android:id="#+id/frameLayoutBale"
android:layout_width="140dp"
android:layout_height="51dp"
android:layout_marginLeft="19dp"
android:layout_marginTop="307dp" >
<ImageView
android:id="#+id/imageViewAnimation"
android:layout_width="140dp"
android:layout_height="51dp"
android:layout_gravity="right"
android:contentDescription="#id/imageViewHMI_Graph_Bale"
android:scaleType="fitXY"
android:src="#drawable/baal" />
</FrameLayout>
<TextView
android:id="#+id/textView01"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="110dp"
android:layout_marginTop="316dp"
android:gravity="right"
android:text="#string/percentage"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#color/brm_back_2" />
<TextView
android:id="#+id/textView02"
android:layout_width="142dp"
android:layout_height="wrap_content"
android:layout_marginLeft="22dp"
android:layout_marginTop="271dp"
android:gravity="center"
android:text="#string/puntjes"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#color/brm_back_2" />
<ZoomControls
android:id="#+id/zoomControls"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignRight="#+id/textCurrMaterial" />
</RelativeLayout>
This is the code I used on my main to declare the zoom controls:
btnZoomControls = (ZoomControls) findViewById(R.id.zoomControls);
btnZoomControls.setOnZoomInClickListener(new View.OnClickListener() {public void onClick(View v) {setZoomIn(); }});
btnZoomControls.setOnZoomOutClickListener(new View.OnClickListener() {public void onClick(View v) {setZoomOut(); }});
And this are the functions for zooming in and out
private void setZoomIn()
{
m_ZoomController.getContainer();
m_ZoomController.getZoomControls();
m_ZoomController.setZoomInEnabled(true);
}
private void setZoomOut()
{
m_ZoomController.getContainer();
m_ZoomController.getZoomControls();
m_ZoomController.setZoomOutEnabled(true);
}
Had any of you a similar problem like mine, and how you found a solution to fix it?

Actually, You have two major ways for zooming:
1) Call setScaleX() and setScaleY() (since API 11) on whole layout or on particular view. Per my experience, images scaling works fine, but text on some versions produces weird behaviour (this scaling get applied by view group during draw process and so, quite fast). This way is quite smooth and fast for not very big layouts;
2) Change layout parameters on every view (You might need, probably, to provide new pictures for image views during scaling). This way is not so fast, but should work on almost all android revisions.

How to design Twitter interface Layout in Android

In my android app i want to design a layout exactly like twitter layout with a Image and Text View.
See the following screenshot
Please help me with this. How can i design this layout ?
Update:
Forget about background images and top bar. I am requiring 6 images and textviews. In the below image twobirds with Tweets(167), Lists, Mentions, Retweets etc.,

What you want is fairly simple, tho I am sure there are more fancy way's of doing this then i'm
about to show you.
For my application I used 4 ImageButtons, but the principle is the same for 4 or 6 buttons.
This is my XML layout:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
android:id="#+id/actionbar_layout"
android:layout_width="fill_parent"
android:layout_height="45dip"
android:background="#drawable/actionbar_background"
android:gravity="center_vertical">
<TextView
android:id="#+id/tekst"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="App name"
android:textColor="#FFFFFF"
android:textSize="18dp"
android:layout_marginLeft="5dp"
android:textStyle="bold"/>
</RelativeLayout>
<RelativeLayout
android:id="#+id/button_layout"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:layout_below="#id/actionbar_layout">
<ImageButton
android:id="#+id/button_schedule"
android:src="#drawable/schedule_icon"
android:scaleType="fitCenter"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_marginLeft="40dp"
android:layout_marginTop="40dp"
android:background="#FFFFFF"
/>
<TextView
android:id="#+id/text_schedule"
android:layout_width="80dp"
android:layout_height="wrap_content"
android:layout_marginLeft="40dp"
android:text="Rooster"
android:textSize="20dp"
android:layout_below="#id/button_schedule"
android:gravity="center"
/>
<ImageButton
android:id="#+id/button_locations"
android:src="#drawable/locations_icon"
android:scaleType="fitCenter"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_marginLeft="40dp"
android:layout_marginTop="50dp"
android:background="#FFFFFF"
android:layout_below="#id/text_schedule"
/>
<TextView
android:id="#+id/text_locations"
android:layout_width="80dp"
android:layout_height="wrap_content"
android:layout_marginLeft="40dp"
android:text="Links"
android:textSize="20dp"
android:layout_below="#id/button_locations"
android:gravity="center"
/>
<ImageButton
android:id="#+id/button_rss"
android:src="#drawable/rss_icon"
android:scaleType="fitCenter"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_marginLeft="40dp"
android:layout_marginTop="40dp"
android:background="#FFFFFF"
android:layout_toRightOf="#id/button_schedule"
android:layout_alignParentRight="true"
/>
<TextView
android:id="#+id/text_rss"
android:layout_width="150dp"
android:layout_height="wrap_content"
android:layout_marginLeft="40dp"
android:text="RSS"
android:textSize="20dp"
android:layout_toRightOf="#id/text_schedule"
android:layout_below="#id/button_rss"
android:layout_alignParentRight="true"
android:gravity="center"
/>
<ImageButton
android:id="#+id/button_settings"
android:src="#drawable/settings_icon"
android:scaleType="fitCenter"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_marginLeft="40dp"
android:layout_marginTop="50dp"
android:background="#FFFFFF"
android:layout_toRightOf="#id/text_locations"
android:layout_below="#id/text_schedule"
android:layout_alignParentRight="true"
/>
<TextView
android:id="#+id/text_settings"
android:layout_width="150dp"
android:layout_height="wrap_content"
android:layout_marginLeft="40dp"
android:text="Instellingen"
android:textSize="20dp"
android:layout_toRightOf="#id/text_locations"
android:layout_below="#id/button_settings"
android:layout_alignParentRight="true"
android:gravity="center"
/>
</RelativeLayout>
<RelativeLayout
android:id="#+id/twitter_layout"
android:layout_width="wrap_content"
android:layout_height="150dp"
android:layout_alignParentBottom="true"
android:layout_below="#id/button_layout">
<Gallery android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#+id/gallery"
android:layout_gravity="bottom"
android:layout_alignParentBottom="true">
</Gallery>
</RelativeLayout>
I pasted the whole file, so you can see how I implemented my actionbar.
But what you need is the second RelativeLayout tag.
You align your buttons/textviews by using "android:layout_toRightOf" and "android:layout_below" attributes.
Your first button is simple, the second one (the one to its right) you align with "android:layout_toRightOf="#id/first_button"
A third button (below the first button) can be aligned using "android:layout_below="#id/first_button"
The same goes for textviews, just use layout_toRightOf and layout_below to align them. The attributes only apply to the RelativeLayout.
Hope this will help you out a bit.

What you want to do is called a Dashboard pattern.
You can find implementation of ActionBar and Dashboard patterns in sources of the Google IO app. ActionBar in the file actionbar.xml (and HomeActivity.java, ActivityHelper.java), Dashboard in the file fragment_dashboard.xml (and DashBoard.java).

im sure , it's can be created like this :
image and textView mustBe on layout - so :
//start "a" code
LinearLayout oneObject ;
oneObject= new LinearLayout(this);
//need set to vertical mode
oneObject.setOrientation(LinearLayout.VERTICAL);
//it's our one object . image+text
next : TextView text = new TextView(this);
text.setText("tweets"); // or get from array
///image it's can be what you want - button, layout, textView(-____-)
// just need set on background new image . iget button - for normal clicking ;//
ImageButton image = new ImageButton(this);
image.setImageResource(r.drawable.blabla)
oneObject.addView(image);
oneObject.addView(text);
//also u need create 2 columns and add to this columns our object
//for size of oneObject - use LinearLayout.LayoutParams param = new LinearLayout.LayoutParams(curWidth/2,curHeight/6); curWidth and curHeight - its my resolution of screen.
//end "a" code
for creating 6 objects u must rung it in cycle :
all code = "a"; so
for(int i = 0;i<6;i++)
{
a/// where a all our code
}
Hope it's help you.. also i can put more code where need some fixings