Develop Reference

Placing small image button on right corner of a image

I am able to take the pictures and put it grid view but, Has a picture is taken i want to place small image button on right corner of a image.

Use something like this
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#ffffff"
>
<ImageView
android:layout_width="100dp"
android:layout_height="100dp"
android:id="#+id/image"
android:src="#drawable/ic_launcher"/>
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#id/image"
android:layout_alignRight="#id/image"
android:src="#android:drawable/btn_dialog"/>
</RelativeLayout>

Try this ..
<ImageView
android:id="#+id/thumbImage"
android:layout_width="134dp"
android:layout_height="121dp"
android:scaleType="fitXY"
android:layout_centerInParent="true"
android:src="#drawable/antartica1" />
<ImageButton
android:id="#+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:button="#drawable/buttonanimation"
android:layout_margin="3dp"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true" />

I hope this will help you...
<?xml version="1.0" encoding="utf-8"?>
<ImageView
android:id="#+id/thumbImage"
android:layout_width="134dp"
android:layout_height="121dp"
android:scaleType="fitXY"
android:layout_centerInParent="true"
android:src="#drawable/antartica1" />
<ImageButton
android:id="#+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:button="#drawable/buttonanimation"
android:layout_margin="3dp"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true" />
</RelativeLayout>
Please use this layout in your Adapter

<Button
android:id="#+id/btnChat"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerInParent="true"
android:layout_marginRight="15px"
android:background="#drawable/chatbtn" />
<TextView
android:id="#+id/new_conduct_pd_txt_chat_counter_msg"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_marginBottom="36dp"
android:layout_marginRight="10dp"
android:background="#drawable/msg"
android:gravity="center"
android:maxLength="2"
android:text=""
android:textColor="#color/white"
android:textSize="13dp"
android:textStyle="bold"
android:visibility="visible" />
add My image:
add other image:
i hope this is useful for you...

Create a listview with sides like older email android app

I want to create a listview like older gmail app. See the screenshot:
I tried putting an empty view like this:
<TextView
android:id="#+id/color_highlight"
android:layout_width="5dp"
android:layout_height="match_parent"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:background="#ff0000"
android:minHeight="48dp" />
<TextView
android:id="#+id/name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_marginRight="20dp"
android:layout_marginTop="10dp"
android:layout_toLeftOf="#id/color_highlight"
android:text="Mudit Agarwal"
android:textStyle="bold"
android:textColor="#242424"
android:textIsSelectable="false"
android:textSize="22sp" />
<TextView
android:id="#+id/number"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignRight="#id/name"
android:layout_below="#id/name"
android:text="9933445566"
android:textColor="#777777"
android:textIsSelectable="false"
android:layout_marginBottom="10dp"
android:textSize="15sp" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:padding="3dp"
android:src="#drawable/contact" />
but this is not taking full height of the view. Please suggest.

What I changed is
android:layout_alignBottom="#+id/number"
to your color_highlight TextView. and instead of margin, I put padding like below in number TextView.
android:paddingBottom="20dp"
just put following layout code.
<?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="wrap_content" >
<TextView
android:id="#+id/color_highlight"
android:layout_width="5dp"
android:layout_height="match_parent"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_alignBottom="#+id/number"
android:background="#ff0000"
android:minHeight="48dp" />
<TextView
android:id="#+id/name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_marginRight="20dp"
android:layout_marginTop="10dp"
android:layout_toLeftOf="#id/color_highlight"
android:text="Mudit Agarwal"
android:textColor="#242424"
android:textIsSelectable="false"
android:textSize="22sp"
android:textStyle="bold" />
<TextView
android:id="#+id/number"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignRight="#id/name"
android:layout_below="#id/name"
android:paddingBottom="20dp"
android:text="9933445566"
android:textColor="#777777"
android:textIsSelectable="false"
android:textSize="15sp" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:padding="3dp"
android:src="#drawable/contact" />
</RelativeLayout>

I'm not sure but you can try putting android:layout_height="0dip" instead of android:layout_height="match_parent".

android:layout_alignBottom not working properly

In my layout, there are an ImageView and a Button (they have botonordenes, and imagelogo as id:
<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"
android:background="#drawable/fondo_descripcion_campania"
tools:context=".AlertDetailActivity" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:src="#drawable/logotipo_high_density_vinceri_movil" />
<ImageView
android:id="#+id/imageView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/imageView1"
android:src="#drawable/titulo_orden_trabajo_oncheck_high_density_vinceri_movil" />
<ImageView
android:id="#+id/imageView6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:src="#drawable/footer" />
<Button
android:id="#+id/botonrechaza"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBaseline="#+id/botonacepta"
android:layout_alignBottom="#+id/botonacepta"
android:layout_toRightOf="#+id/botonacepta"
android:background="#drawable/rechazar_azafata_orden_trabajo_oncheck_high_density_vinceri_movil" />
<Button
android:id="#+id/botonacepta"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/imageView6"
android:layout_alignParentLeft="true"
android:background="#drawable/aceptar_azafata_orden_trabajo_oncheck_high_density_vinceri_movil" />
<Button
android:id="#+id/botonordenes"
android:layout_width="wrap_content"
android:layout_height="30dp"
android:layout_toRightOf="#+id/imagelogo"
android:layout_below="#+id/nombrecampaign"
android:layout_marginLeft="20dp"
android:layout_marginRight="10dp"
android:layout_marginTop="20dp"
android:background="#drawable/btn_ver_ordenes_trabajo" />
<ImageView
android:id="#+id/botonalertdetailshome"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/imageView4"
android:layout_alignParentRight="true"
android:src="#drawable/home_high_density_vinceri_movil" />
<ImageView
android:id="#+id/botonalertdetailsos"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/botonrechaza"
android:layout_alignParentTop="true"
android:src="#drawable/icono_sos_vinceri_movil_azafatas" />
<TextView
android:id="#+id/nombrecampaign"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/botonordenes"
android:layout_below="#+id/imageView4"
android:text="Nombre Campaña"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#FFFFFF" />
<Button
android:id="#+id/botonubicaciones"
android:layout_width="wrap_content"
android:layout_height="30dp"
android:layout_alignBottom="#+id/imageView2"
android:layout_alignLeft="#+id/botonordenes"
android:layout_alignParentRight="true"
android:layout_marginBottom="10dp"
android:layout_marginRight="10dp"
android:background="#drawable/btn_ver_ubicaciones_campania" />
<TextView
android:id="#+id/textdescenc"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="14dp"
android:layout_toRightOf="#+id/imageView5"
android:layout_alignBottom="#+id/imageView5"
android:text="#string/desc"
android:textAppearance="?android:attr/textAppearanceSmall" />
<ImageView
android:id="#+id/imageView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginRight="15dp"
android:layout_toLeftOf="#+id/textofechainicioenc"
android:src="#drawable/icono_calendario" />
<ImageView
android:id="#+id/imageView5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/imageView3"
android:layout_below="#+id/imageView3"
android:layout_marginTop="14dp"
android:src="#drawable/icono_descripcion" />
<TextView
android:id="#+id/textdetailfechainicio"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/imageView3"
android:layout_toRightOf="#+id/textofechainicioenc"
android:text="Small Text"
android:textAppearance="?android:attr/textAppearanceSmall" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="64dp"
android:layout_above="#+id/botonrechaza"
android:layout_alignLeft="#+id/imageView3"
android:layout_alignParentRight="true"
android:layout_below="#+id/textdescenc"
android:orientation="vertical" >
<TextView
android:id="#+id/textdescdetail"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Small Text"
android:textAppearance="?android:attr/textAppearanceSmall" />
</LinearLayout>
<TextView
android:id="#+id/textofechainicioenc"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/imageView3"
android:layout_alignRight="#+id/imageView1"
android:layout_marginRight="15dp"
android:text="#string/fechainicio"
android:textAppearance="?android:attr/textAppearanceSmall" />
<ImageView
android:id="#+id/imageView2"
android:layout_width="70dp"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/imagelogo"
android:layout_marginTop="10dp"
android:src="#drawable/icono_mapa_ubicacion" />
<ImageView
android:id="#+id/imagelogo"
android:layout_width="69dp"
android:layout_height="65dp"
android:layout_alignBottom="#+id/botonordenes"
android:layout_alignRight="#+id/imageView2" />
As you can see, the image has android:layout_alignBottom="#+id/botonordenes". The problem is, the alignbottom is not working properly. In the emulator it is seen ok, but not in my device. The bottom line of the image is not aligned with the bottom line of the Button. The difference is not a lot, but it is visible. Why are not aligned? I tried to set a margin hoping it would push the image a bit to be aligned, but dont works. Anybody knows why this happens, and how to solve it? Thank you.

It either has to do with the predefined margins on Buttons or your hardcoded height and width values on the ImageView

What you are probably seeing is the difference between default android and what is implemented on your device for the image used on the default button. Try using one of the Holo themes and see if you still have the same issue.

How can i fit RelativeLayout to screen?

I am facing with problem button shows outside the screen in RelativeLayout. ImageView doesn't o scale picture to give a button visible place.
What I have:
What I want:
Code:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_vertical" >
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/str"
android:textAppearance="#android:style/TextAppearance.Small"
android:textColor="?android:attr/textColorTertiary"
android:layout_centerHorizontal="true"
/>
<ru.mw.widget.DrawableImageView
android:id="#+id/imageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/textView"
android:adjustViewBounds="true"
android:layout_centerHorizontal="true"
android:scaleType="centerCrop"
/>
<Button
android:id="#+id/processButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/str"
android:layout_below="#+id/imageView"
android:layout_centerHorizontal="true"
/>
Problem when I change screen orientation:
If I use Arun C Thomas's method in landscape mode everything is ok, but in portrait mode I have this (image cropped by left/right edges):
What is expected:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_vertical" >
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/str"
android:textColor="?android:attr/textColorTertiary"
android:textAppearance="#android:style/TextAppearance.Small"
android:layout_centerHorizontal="true"
/>
<ru.mw.widget.DrawableImageView
android:id="#+id/imageView"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_below="#+id/textView"
android:layout_centerHorizontal="true"
android:adjustViewBounds="true"
android:scaleType="centerCrop"
android:layout_above="#+id/processButton"
/>
<Button
android:id="#+id/processButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/str"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
/>
</RelativeLayout>
This is the solution
Now to achieve the Updated requirement add the above layout to layout-land folder in res (if you don't have one create a folder named layout-land in res ) now in default layout folder add this xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center" >
<ru.mw.widget.DrawableImageView
android:id="#+id/imageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:adjustViewBounds="true"
/>
<Button
android:id="#+id/processButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/imageView"
android:layout_centerHorizontal="true"
android:text="#string/str" />
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/imageView"
android:layout_centerHorizontal="true"
android:text="#string/str"
android:textColor="?android:attr/textColorTertiary" />
</RelativeLayout>
Thats it.

Try to add android:layout_alignParentBottom="true" to the button:
<Button
android:id="#+id/processButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/str"
android:layout_below="#+id/imageView"
android:layout_centerHorizontal="true"
android:layout_alignParentBottom="true"
/>

Align the button to parent bottom using
layout_alignParentBottom="true".
Wrap the ImageView between the TextView and Button
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_vertical" >
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/str"
android:textAppearance="#android:style/TextAppearance.Small"
android:textColor="?android:attr/textColorTertiary"
android:layout_centerHorizontal="true"
/>
<Button
android:id="#+id/processButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/str"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
/>
<ru.mw.widget.DrawableImageView
android:id="#+id/imageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/textView"
android:layout_above="#+id/processButton"
android:adjustViewBounds="true"
android:layout_centerHorizontal="true"
android:scaleType="centerCrop"
/>
</RelativeLayout>

Relative Layout Scaling?

I want to create a layout that appears on all devices as it does on my phone. I have tried to make it work for tablets, but it looks awful.
Here is what it should look like:
But here is how it appears on this tablet emulator:
What can I do to make it appear on all screen sizes like it is on my phone? I am currently using a RelativeLayout.
Here is my code:
<?xml version="1.0" encoding="UTF-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/RelativeLayout02"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<ImageView
android:id="#+id/terranlogo1"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_centerHorizontal="true"
android:src="#drawable/terranlogo" />
<ImageView
android:id="#+id/protosslogo1"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_alignParentRight="true"
android:src="#drawable/protosslogo" />
<ImageView
android:id="#+id/zerglogo1"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_alignParentLeft="true"
android:src="#drawable/zerglogo" />
<CheckBox
android:id="#+id/ck_t1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/terranlogo1"
android:layout_centerHorizontal="true" />
<CheckBox
android:id="#+id/ck_p1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#id/protosslogo1"
android:layout_below="#id/protosslogo1"
android:layout_marginLeft="25dp" />
<CheckBox
android:id="#+id/ck_z1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBaseline="#id/zerglogo1"
android:layout_below="#id/zerglogo1"
android:layout_marginLeft="25dp" />
<ImageView
android:id="#+id/terranlogo2"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_below="#id/ck_t1"
android:layout_centerHorizontal="true"
android:src="#drawable/terranlogo" />
<ImageView
android:id="#+id/protosslogo2"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_alignParentRight="true"
android:layout_below="#id/ck_p1"
android:src="#drawable/protosslogo" />
<ImageView
android:id="#+id/zerglogo2"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_alignParentLeft="true"
android:layout_below="#id/ck_z1"
android:src="#drawable/zerglogo" />
<CheckBox
android:id="#+id/ck_t2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/terranlogo2"
android:layout_centerHorizontal="true" />
<CheckBox
android:id="#+id/ck_p2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#id/protosslogo1"
android:layout_below="#id/protosslogo2"
android:layout_marginLeft="25dp" />
<CheckBox
android:id="#+id/ck_z2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBaseline="#id/zerglogo1"
android:layout_below="#id/zerglogo2"
android:layout_marginLeft="25dp" />
<TextView
android:id="#+id/textView4"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/ck_t2"
android:layout_marginRight="18dp"
android:layout_marginTop="17dp"
android:gravity="center_vertical|center_horizontal"
android:text="Choose your opponets race(s) and your race(s)"
android:textSize="30dp" />
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:text="Game Length"
android:textSize="15dp" />
<Spinner
android:id="#+id/s_answertime"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/textView1"
android:layout_alignParentLeft="true"
android:layout_below="#id/textView4" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/terranlogo2"
android:layout_alignParentBottom="true"
android:gravity="center_horizontal"
android:text="Mistakes Allowed"
android:textSize="15dp" />
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:text="Answer Time"
android:textSize="15dp" />
<Spinner
android:id="#+id/s_mistakenumber"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/s_answertime"
android:layout_alignTop="#+id/s_answertime"
android:layout_toLeftOf="#+id/s_gametime"
android:layout_toRightOf="#+id/s_answertime" />
<Spinner
android:id="#+id/s_gametime"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/textView3"
android:layout_alignLeft="#+id/protosslogo2"
android:layout_alignTop="#+id/s_mistakenumber" />
</RelativeLayout>
All help is appreciated, Lijap.

The spinners are stretched because you set layout_above and layout_below, so they stretch to accomodate both criteria. Remove one of these (probably layout_above) and set a reasonable fixed height for them (75dp?).
Also, your left/right most icon/checkboxes would probably look better with a nice healthy margin_left/right=50dp, to keep them from stretching all the way to the edge of the screen.