android how to position elements to support in all devices - android

I have a problem with positioning elements.
What I want to have is this image in all devices no matter screen size is.
what I have is this in two different sizes
I want my textViews and editTexts maintain their positions in the activity view. (The image 'Green-Blue-Red-Yellow square containing image' in an imageView)
and this is my layout.xml
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<TextView
android:layout_height="30dp"
android:layout_width="150dp"
android:layout_marginTop="60dp"
android:layout_marginLeft="100dp"
android:textSize="19dp"
android:textStyle="bold"
android:gravity="center"
android:text="#string/login_app_name">
</TextView>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="20dp"
android:layout_marginTop="128dp"
android:gravity="center_vertical">
<TextView
android:layout_height="20dp"
android:layout_width="100dp"
android:layout_marginLeft="35dp"
android:textStyle="bold"
android:gravity="right|center_vertical"
android:text="#string/login_username">
</TextView>
<EditText
android:layout_height="20dp"
android:layout_width="140dp"
android:layout_alignParentRight="true"
android:layout_marginRight="10dp"
android:background="#drawable/login_edit_text">
</EditText>
</RelativeLayout>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="20dp"
android:layout_marginTop="2dp">
<TextView
android:layout_height="20dp"
android:layout_width="100dp"
android:layout_marginLeft="35dp"
android:textStyle="bold"
android:gravity="right|center_vertical"
android:text="#string/login_password">
</TextView>
<EditText
android:layout_height="20dp"
android:layout_width="140dp"
android:layout_alignParentRight="true"
android:layout_marginRight="10dp"
android:background="#drawable/login_edit_text">
</EditText>
</RelativeLayout>
</LinearLayout>
</RelativeLayout>
I suspect the problem is related to tha paddings and margins that I used to position elements. But I couldn't find any other way around.
Is there a way that you can suggest for my elements to maintain their positions in all screen sizes?

Make separate xml files for the different devices and position the images separately for the two xml's, so as to suit the different standard resolutions. link two separate classes for the two XML files, and now based on the screen resolution call either of the two classes. You can get screen res with this code:
DisplayMetrics dm = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(dm);
final int height = dm.heightPixels;
final int width = dm.widthPixels;
Use an if-else condition and choose the class to intent to

Related

Fix Layout issue

Scenario: I've four buttons arranged Relative Layout. These button's text varies through the app life which makes button shrink or expand according to text length. Using: RelativeLayout.getChildAt().setText();
Q1) But I require the each button to occupy 40% of screen width but with varying height.
Q2) And in particular my code requires to access buttons using getChildAt().
What Layout type should I use to replace RelativeLayout to set Button's width to 40% of screen width and in particular so I can access these Buttons using getChildAt()?
SomeLayout.getChildAt(); so that the Layout is immediate parent of Buttons.
<RelativeLayout android:id="#+id/buttonRelativeLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_margin="10dp">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="New Button"
android:id="#+id/optionButton1"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="New Button"
android:id="#+id/optionButton2"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="New Button"
android:id="#+id/optionButton3"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="New Button"
android:id="#+id/optionButton4"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true" />
</RelativeLayout>
You are actually just in luck. Android just released a new percent support library. They don't have documentation yet, but here is a good sample project that you can use to see how to go about using the library. It basically allows you to size view widgets by percentage of the screen.
https://github.com/JulienGenoud/android-percent-support-lib-sample
And here are two articles talking about it as well:
http://www.androidauthority.com/using-the-android-percent-support-library-630715/
http://inthecheesefactory.com/blog/know-percent-support-library/en
Android percent support library does a awesome work of giving percentage ratio for android widgets on the screen there by replacing our traditional LinearLayout
Github demo Here !
<android.support.percent.PercentRelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/fifty_huntv"
android:background="#ff7acfff"
android:text="20% - 50%"
android:textColor="#android:color/white"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_heightPercent="20%"
app:layout_widthPercent="50%" />
<TextView
android:layout_toRightOf="#id/fifty_huntv"
android:background="#ffff5566"
android:text="80%-50%"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_heightPercent="80%"
app:layout_widthPercent="50%"
/>
</android.support.percent.PercentRelativeLayout>
Really awesome !!!
Right now I can't think of any layout element that will allow you to do that.
You can try this, on your code onCreate or on one of your init views/variables method, get the buttons and set the size to 40% of the screen, something like:
Display display = getWindowManager().getDefaultDisplay();
Point screenSize = new Point();
display.getSize(screenSize);
RelativeLayout rlParent = findViewById(R.id.<RELATIVE_LAYOUT_ID>);
for(int i = 0; i < 4; i++)
{
View btn = rlParent.getChildAt(i);
RelativeLayout.LayoutParams params = (RelativeLayout.LayoutParams)btn.getLayoutParams();
params.width= screenSize.y * 0.4f;//40%
btn.setLayoutParams(params);
}

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.

Using ImageViews instead of buttons in Android

I'm building my first android application.In my starting activity I want to use some ImageViews instead of buttons,These ImageViews are big tiles that their width should always match the parent Layout.I've drawn my imageViews to fit a normal mobile screen (4 inches I think ) how can i have them fit any device? like a 7 or 10 inch Tablet?
EDIT: Well sadly I used the fitCenter and didn't make any difference,that's my xml:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<Button
android:id="#+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="24dp"
android:layout_marginTop="122dp"
android:drawableLeft="#drawable/home"
android:drawablePadding="#dimen/padding_small"
android:padding="#dimen/padding_small"
android:text="My Classes"
android:textSize="#dimen/a12" />
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/button3"
android:layout_alignRight="#+id/button3"
android:layout_centerVertical="true"
android:layout_below="#+id/button3"
android:layout_marginTop="35dp"
android:drawableLeft="#drawable/image"
android:text="Update Offline Data"
android:textSize="#dimen/a12" />
<Button
android:id="#+id/button4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/button1"
android:layout_alignRight="#+id/button1"
android:layout_below="#+id/button1"
android:layout_marginTop="35dp"
android:drawableLeft="#drawable/configure"
android:text="Settings"
android:textSize="#dimen/a12" />
<ImageView
android:id="#+id/imageView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginTop="38dp"
android:scaleType="fitCenter"
android:src="#android:drawable/bottom_bar" />
for fit the images you can use android:scaleType="fitCenter" attribute in your control
like this:
<ImageButton
android:id="#+id/imageViewSecurity"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="#drawable/security"
android:background="#null"
android:scaleType="fitCenter" />
Instead of giving them an absolute width, use the constant match_parent as android:width, that will always give them the same width as the parent view. The root view of an activity will have the same size as the screen with this width and/or height.
To also size an image in the ImageView to the correct size, use fitCenter as android:scaletype.
If all you're trying to do is getting the image to match the width of its container (and its container is matching the width of *its parent) then you should set the image as the background of the View, rather than its src. I believe that will stretch it to fill the entire View, whatever its size is.

automatically resize ImageButtons in LinearLayout

Summary: I want a horizontal row of ImageButtons to scale down evenly to fit in the screen size.
I have a row of ImageButtons at the top of the screen. A left-aligned logo ImageButton and then right-aligned ImageButtons for various actions.
Yes, that does sound a lot like a Honeycomb/ICS Action Bar, but the code is targeted for Froyo, so I need to implement the design in 2.2-compatible layouts.
I programmatically detect when I'm on a 7" screen or larger and switch to larger images for the ImageButtons (as the drawable-xlarge directory only works for 10" and up, and drawable-large works for 4" and up).
This works great on a phone or on a 10" tablet. However, on a 7" tablet, the images are too large for the space in portrait mode (the app is locked to portrait mode).
I have tried many different approaches to making the images scale down, as I'd rather not use yet another set of images just for 7" tablets. But the images are not spaced properly, or scale at different levels, or only some of the images appear on the screen. I've used RelativeLayout, LinearLayout, android:weightSum, setting the images as background images, as src images, etc.
EDIT: Another quirk I noticed in my experimentation was that if I set the same layout_weight, the layout worked, forcing each item to have the same width. If I want some items to have different widths--which is necessary in this case, as the first button needs to be substantially wider--then the layout breaks when I set a layout_weight that doesn't match the others. Only one or two of the items appear on screen, the rest presumable being pushed off.
Here's the layout I'm using. This is my best so far--it works great on 10" tablets and phones, and is almost tolerable on 7" tablets. But the logo--which should be the same height as the buttons and about 2.5 times wider--is noticeably taller than the other buttons. Any suggestions on improving the layout?
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/actionBarLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0"
android:padding="5dip"
android:gravity="center_vertical"
android:orientation="horizontal"
android:background="#drawable/action_bar_bg"
>
<ImageButton
android:id="#+id/logoButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#null"
android:src="#drawable/save_logo_03"
android:padding="2dip"
android:adjustViewBounds="true"
android:scaleType="centerInside"
/>
<View
android:id="#+id/spacer"
android:layout_width="50dip"
android:layout_height="1dip"
android:layout_weight="1"
android:visibility="invisible"
/>
<ImageButton
android:id="#+id/listButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:src="#drawable/list_button"
android:background="#null"
android:adjustViewBounds="true"
android:padding="2dip"
android:scaleType="centerInside"
/>
<ImageButton
android:id="#+id/mapButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#null"
android:src="#drawable/map_button2"
android:adjustViewBounds="true"
android:padding="2dip"
android:scaleType="centerInside"
/>
<ImageButton
android:id="#+id/ltoButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#null"
android:src="#drawable/lto_button"
android:adjustViewBounds="true"
android:padding="2dip"
android:scaleType="centerInside"
/>
<ImageButton
android:id="#+id/searchButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#null"
android:src="#drawable/search_button"
android:adjustViewBounds="true"
android:padding="2dip"
android:scaleType="centerInside"
/>
</LinearLayout>
Unfortunately, in the end I did have to programmatically change the button sizes depending on the size of the screen.
My final layout looked like this (sanitized):
<?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="wrap_content"
android:layout_weight="0"
android:padding="5dip"
android:gravity="center_vertical"
android:orientation="horizontal"
android:background="#drawable/action_bar_bg"
>
<ImageButton
android:id="#+id/logoButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="0"
android:background="#null"
android:padding="2dip"
android:adjustViewBounds="true"
android:src="#drawable/logo"
android:scaleType="centerInside"
/>
<View
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_weight="1"/>
<ImageButton
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="0"
android:background="#null"
android:padding="2dip"
android:src="#drawable/button1"
android:scaleType="centerInside"
android:adjustViewBounds="true"
/>
<ImageButton
android:id="#+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="0"
android:background="#null"
android:padding="2dip"
android:src="#drawable/button2"
android:scaleType="centerInside"
android:adjustViewBounds="true"
/>
<ImageButton
android:id="#+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="0"
android:background="#null"
android:padding="2dip"
android:src="#drawable/button3"
android:scaleType="centerInside"
android:adjustViewBounds="true"
/>
<ImageButton
android:id="#+id/button4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="0"
android:background="#null"
android:padding="2dip"
android:src="#drawable/button4"
android:adjustViewBounds="true"
android:scaleType="centerInside"
/>
</LinearLayout>
Notice the empty View that fills up available space, pushing the other buttons over to the right side of the screen.
In the code, I check the screen size. If it seems to be >= 7", then I switch to larger images.
If it seems to be >=7" but < 9", then I programmatically change the size of the images--and that I had to experiment with to come up with just the right number for it to work. If I had more images or they changed, I would have to repeat it. I'm not proud of such an inflexible solution, but I couldn't find anything else that worked.
This is what I've got:
In your specific case, we can say that your app layout and buttons size are under dependecy of:
The mobile device screensize/resolution;
The number of buttons in the
row;
I recommend 2 approaches to you:
Implementing your layout with RelativeLayout and weight tags. Flexible layouts can be made very easy with these ones;
Programatically define your button sizes using DisplayMetrics class, something like the snippet in the end of this post, and use an extra .xml file (say integer.xml) where you can define a constant value for your number of buttons;
In this snippet, dm is a structure that holds your device resolutions.
DisplayMetrics dm = new DisplayMetrics();
context.getWindowManager().getDefaultDisplay().getMetrics(dm);
Hope it helped you! :)

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

Categories

Resources