Develop Reference

Positioning Widgets in a Specific Arrangment

I'm quite new with Android programming in general, but I would like to know if there is a way to arrange my widgets in a particular way. Basically, I'm looking for the iOS equivalent of constraints, which will allow me to place to widgets centered horizontally and a specified distance from the bottom:
--------------------
| |
| |
| | <- android device
| |
| |
| | <- x is a button
| x x |
| |
--------------------

You can use a RelativeLayout with alignParentBottom="true"
Then you can add a padding in your relativelayout or a margin in your buttons a bit like this.
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:orientation:"horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="10dp">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
</RelativeLayout>

How to display Layout like below in android

Here i want to create a layout that contains following by using fragment how can i do this?
Should i use for top portion or can i use fragment? which one is the best approach. And instead of swipe tab i want to display .(dot) in the bottom. e.g. Android home screen bottom 3-5 dots.
+-----------------------------------------------+
| +------------+ |
| | | Line 1 |
| | Image | Line 2 |
| | | Line 3 |
| | | (Static) |
| +------------+ |
|-----------------------------------------------|
| |
| |
| |
| |
| Some Content goes here |
| (Swipe tab) |
| Swipe to next -->>> |
| Here dot(.) represent the pages |
| |
| |
| |
|____________________._._.______________________|
| |
| 3 images goes here |
| (Static Horizontal scroll able) |
+-----------------------------------------------+

Hmmm...i tried it...and here is the out put...
And here is the source...
<TableLayout 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" >
<LinearLayout
android:id="#+id/news_item_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<ImageView
android:id="#+id/news_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="Test image"
android:padding="20dp"
android:src="#drawable/ic_launcher" />
<LinearLayout
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical" >
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Your headline..."
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Your text here..."
android:textAppearance="?android:attr/textAppearanceMedium" />
<TextView
android:id="#+id/textView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Your text here..."
android:textAppearance="?android:attr/textAppearanceMedium" />
</LinearLayout>
</LinearLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#FFCCCCCC" >
<TextView
android:id="#+id/textView5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="Inner contents..."
android:textAppearance="?android:attr/textAppearanceLarge" />
</FrameLayout>
<HorizontalScrollView
android:id="#+id/horizontalScrollView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_marginBottom="10dp"
android:layout_marginTop="10dp"
android:orientation="horizontal" >
<TextView
android:id="#+id/textView6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Scrollable contents here..."
android:textAppearance="?android:attr/textAppearanceMedium" />
</LinearLayout>
</HorizontalScrollView>
NOTE: You need to put your tabs or any thing else in Inner contents section. And whatever contents in lower scrollable panel by you self. I just tried to make a structure for you...
Hope this helps...

You must put three layouts . In first linear horizontal layout place imageview and text views.
In the second one place a horizontal scrollable view with buttons or something suits to you contents with match parent widht to each . place page indicator tyo each button.
Third one is normal scrollable view or use gallery view to place you content.

Android: Placing button relative to ImageView

I want to make a part of a bitmap clickable and my layout looks like this:
________________________________
| ##### |
| ##### |
| ___________________ |
| | | |
| | | |
| | image | |
| | | |
| | | |
| ___________________ |
________________________________
I thought the easiest way to this would be to place a button over the image with a relative layout:
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<ImageView
android:id="#+id/ImageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
</ImageView>
<Button
android:id="#+id/Button"
android:layout_width="200dip"
android:layout_height="150dip"/>
</RelativeLayout>
But I haven't figured out how to get the button to align with the upper left corner of the image (instead of the upper left corner of the relative layout, as it does now). Is this possible with a relative layout?
Suggestions for other approaches are also welcome, I considered this:
http://blahti.wordpress.com/2012/06/26/images-with-clickable-areas/
But it seems a bit of an overkill for my simple rectangle area.

Try this:
<ImageView
android:id="#+id/ImageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
</ImageView>
<Button
android:id="#+id/Button"
android:layout_alignLeft="#id/ImageView"
android:layout_alignTop = "#id/ImageView"
android:layout_width="200dip"
android:layout_height="150dip"/>
</RelativeLayout>

You can also use
<Button
android:id="#+id/image"
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="#drawable/image1"
android:drawableLeft="#drawable/image2t"
android:drawableRight="#drawable/image3"
android:drawableTop="#drawable/image4"
android:drawableTop="#drawable/image4"
android:textColor="#ffffff"
/>

Okay, my google-fu improved and thanks to asenovm I figured it out! The imageview has a android:adjustViewBounds property, which is by default set to false. Setting it to true adjusts the imageviews bounds to the image, so that alignLeft and alignTop work correctly for the button.
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<ImageView
android:id="#+id/ImageView"
android:layout_centerInParent="true"
android:adjustViewBounds="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
</ImageView>
<Button
android:id="#+id/Button"
android:layout_alignLeft="#id/ImageView"
android:layout_alignTop = "#id/ImageView"
android:layout_width="200dip"
android:layout_height="150dip"/>
</RelativeLayout>

Positioning of textview for Android

Is there a way to position a textview to be slightly above a centerd android button? I don't want to hardcode values for a particular screen obviously, but something that will dynamically scale. The button will always be centered, however...
Thanks in advance!

Yes if your parent layout is a RelativeLayout you can position Views in relation to each other or to the parent here is a simple example (Warning didn't type this into IDE, may contain typo):
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<Button
android:id="#+id/mBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="I am a Button!"
android:layout_centerInParent="true" />
<TextView
android:id="#+id/mTxt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:text"Some Text"
android:layout_above="#+id/mBtn" />
</RelativeLayout>
That will make your layout look roughly like this:
________________________
| |
| |
| Some Text |
| [I am a Button!] |
| |
| |
|______________________|

Android AppWidget layout troubles with ellipsize

I'm writing an app-widget that displays some numbers, each with label in front of it.
The layout looks like this:
.-----------------------------.
| Label1 | AAAAAAAAAAA |
| LongerLabelLabel2 | BBBBBBB |
| LongLabel3 | CCCCCCCCCC |
'-----------------------------'
There is one outer (vertical) LinearLayout, and each row is a horizontal LinearLayout with two TextViews.
The problem is that the numbers get ellipsized if the width of the label and the number is too wide for the widget. I want the labels to get ellipsized.
The above situation for instance, would end up like this:
.-----------------------------.
| Label1 | AAAAAAAAAAA |
| LongerLabelLabel2 | BBBB... |
| LongLabel3 | CCCCCCCCCC |
'-----------------------------'
instead of the desired
.---------------------------.
| Label1 | AAAAAAAAAAA |
| LongerLabelL... | BBBBBBB |
| LongLabel3 | CCCCCCCCCC |
'---------------------------'
I can't for my life figure out how to solve this. Any help is appreciated.
My current layout is the following:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/widget"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:padding="0dip"
android:orientation="vertical"
style="#style/WidgetBackground">
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/ROW1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:paddingTop="7dip"
android:paddingBottom="0dip"
android:paddingRight="10dip"
android:paddingLeft="10dip"
android:orientation="horizontal">
<TextView android:id="#+id/NAME1" android:singleLine="true" android:layout_width="wrap_content" android:layout_height="wrap_content" android:ellipsize="end" style="#style/Text.account" />
<TextView android:id="#+id/BAL1" android:singleLine="true" android:layout_width="fill_parent" android:layout_height="wrap_content" android:gravity="right" style="#style/Text.balance" />
</LinearLayout>
... (more similar rows in the outer layout)
</LinearLayout>

I suspect your problem, in part, is that you have android:layout_width="wrap_content" for your label. I would not expect it to ellipsize at all, since there is enough room to show it.
I would switch away from LinearLayout to RelativeLayout. Define your number "column" as android:layout_alignParentRight="true" and android:layout_width="wrap_content". Define your label "column" as android:layout_alignParentLeft="true", android:layout_toLeftOf="..." (where ... is your number column), and android:ellpsize="end". That should give the number all the space it needs and constrain the label, forcing it to ellipsize.