image overlaps text view in android activity - android

Hi i am new to android and i have the following problem(see image).
As seen above the image over laps the text view. Can any one help me correct it.
I am using the following code.
<EditText
android:id="#+id/outlet_id"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="170dp"
android:hint="#string/outlet_id_text"
android:inputType="textAutoComplete" />
<ImageView
android:id="#+id/search_button"
android:layout_width="32dp"
android:layout_height="32dp"
android:layout_gravity="center"
android:layout_marginTop="-48dp"
android:adjustViewBounds="true"
android:contentDescription="#string/cd_search_icon"
android:src="#drawable/search_icon" />
<?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="#color/background"
android:orientation="vertical" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentRight="true"
android:background="#color/background"
android:orientation="vertical" >
<org.fluturasymphony.recommendation.ScrollingTextView
android:text="Really Long Scrolling Text Goes Here.... ..... ............ .... ...."
android:singleLine="true"
android:ellipsize="marquee"
android:marqueeRepeatLimit="marquee_forever"
android:scrollHorizontally="true"
android:id="#+id/TextView03"
android:padding="25dip"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<EditText
android:id="#+id/outlet_id"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="170dp"
android:hint="#string/outlet_id_text"
android:inputType="textAutoComplete" />
<ImageView
android:id="#+id/search_button"
android:layout_width="32dp"
android:layout_height="32dp"
android:layout_gravity="center"
android:layout_marginTop="-48dp"
android:adjustViewBounds="true"
android:contentDescription="#string/cd_search_icon"
android:src="#drawable/search_icon" />
<Button
android:id="#+id/view_stores_on_map"
android:layout_width="221dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="76dp"
android:onClick="showStoreList"
android:text="#string/view_stores_on_map" />
<Button
android:id="#+id/view_stores"
android:layout_width="221dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="38dp"
android:onClick="showStoreList"
android:text="View List Of Stores" />
</LinearLayout>
</RelativeLayout>

you can use the following lines also . or if you want to use as a row items you can use orientation for those two items alone.
<EditText
android:layout_centerInParent="true"
android:id="#+id/outlet_id"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="170dp"
android:hint="outlet_id_text"
android:drawableRight="#drawable/ic_launcher"
android:inputType="textAutoComplete" />

Although you can manage your design using relative layout (BUT keep in mind your use is only show search image, so no need to add extra view for this requirement.), Here is simplest way is to do this
Use the android:drawableTop property on the EditText.
<EditText
...
android:drawableTop="#drawable/ic_action_search" />
and remove the <ImageView>
Other options are :
android:drawableRight, android:drawableLeft, android:drawableBottom and more..

Try this :
<?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="#color/background"
android:orientation="vertical" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentRight="true"
android:background="#color/background"
android:orientation="vertical" >
<org.fluturasymphony.recommendation.ScrollingTextView
android:id="#+id/TextView03"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:ellipsize="marquee"
android:marqueeRepeatLimit="marquee_forever"
android:padding="25dip"
android:scrollHorizontally="true"
android:singleLine="true"
android:text="Really Long Scrolling Text Goes Here.... ..... ............ .... ...." />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginTop="170dp"
android:background="#color/background"
android:orientation="horizontal" >
<EditText
android:id="#+id/outlet_id"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:hint="#string/outlet_id_text"
android:inputType="textAutoComplete" />
<ImageView
android:id="#+id/search_button"
android:layout_width="32dp"
android:layout_height="32dp"
android:adjustViewBounds="true"
android:contentDescription="#string/cd_search_icon"
android:src="#drawable/search_icon" />
</LinearLayout>
<Button
android:id="#+id/view_stores_on_map"
android:layout_width="221dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="76dp"
android:onClick="showStoreList"
android:text="#string/view_stores_on_map" />
<Button
android:id="#+id/view_stores"
android:layout_width="221dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="38dp"
android:onClick="showStoreList"
android:text="View List Of Stores" />
</LinearLayout>
</RelativeLayout>
It will solve your problem.
Thanks.

If you wanna make it move up, change android:layout_marginTop of image view to a more negative value. Do the opposite if you need it to go down.
<ImageView
android:id="#+id/search_button"
android:layout_width="32dp"
android:layout_height="32dp"
android:layout_gravity="center"
android:layout_marginTop="-48dp" <!-- add more -ve value to move up, decrease to move down -->
android:adjustViewBounds="true"
android:contentDescription="#string/cd_search_icon"
android:src="#drawable/search_icon" />

Try this I hope it will work.
<LinearLayout android:layout_width="fill_parent"
android:layout_height="wrap_content" android:layout_marginTop="40dp">
<EditText
android:id="#+id/outlet_id"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/outlet_id_text"
android:inputType="textAutoComplete" />
<ImageView
android:id="#+id/search_button"
android:layout_width="32dp"
android:layout_height="32dp"
android:adjustViewBounds="true"
android:contentDescription="#string/cd_search_icon"
android:src="#drawable/ic_launcher" />
</LinearLayout>

Use android:layout_below="#+id/search_button" attribute to arrange your gadgets in View.
<EditText
android:id="#+id/outlet_id"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="10dp"
android:layout_below="#+id/search_button"
android:hint="#string/outlet_id_text"
android:inputType="textAutoComplete" />
<ImageView
android:id="#+id/search_button"
android:layout_width="32dp"
android:layout_height="32dp"
android:layout_gravity="center"
android:layout_marginTop="170dp"
android:adjustViewBounds="true"
android:contentDescription="#string/cd_search_icon"
android:src="#drawable/search_icon" />

Related

Relativelayout property issue

I want to create my Toolbar layout like below image.
I written below code for create this view. Please see my xml Code.
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="#dimen/_40sdp"
android:background="#color/black"
android:padding="#dimen/_5sdp">
<ImageView
android:id="#+id/toolbar_default_img_menu"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_centerVertical="true"
android:padding="#dimen/_5sdp"
android:src="#drawable/icon_menu" />
<TextView
android:id="#+id/toolbar_default_textview_title"
style="#style/textview_normal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toEndOf="#+id/toolbar_default_img_menu"
android:layout_toStartOf="#+id/toolbar_default_img_search"
android:text="#string/app_name"
android:textColor="#color/white"
android:textSize="#dimen/_15ssp" />
<ImageView
android:id="#+id/toolbar_default_img_search"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toStartOf="#+id/toolbar_default_img_filter_tag"
android:padding="#dimen/_5sdp"
android:src="#drawable/icon_search" />
<ImageView
android:id="#+id/toolbar_default_img_filter_tag"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toStartOf="#+id/toolbar_default_img_filter"
android:padding="#dimen/_5sdp"
android:src="#drawable/icon_filter" />
<ImageView
android:id="#+id/toolbar_default_img_filter"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_centerVertical="true"
android:padding="#dimen/_5sdp"
android:src="#drawable/icon_filter" />
</RelativeLayout>
After written this code i can see my view is correct in android studio preview but when i run my project it look like below image.
only left and right imageview on correct position but my textview and other two imageview is not set on correct position after run this code.
May be problem with android:layout_toEndOf and android:layout_toStartOf property of RelativeLayout.
I don't know why this problem create.Thank you for help.
Replace this code:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="#dimen/_40sdp"
android:background="#color/black"
android:padding="#dimen/_5sdp">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:gravity="center_vertical"
android:layout_centerVertical="true"
android:orientation="horizontal"
>
<ImageView
android:id="#+id/toolbar_default_img_menu"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="#dimen/_5sdp"
android:src="#drawable/ic_launcher_background" />
<TextView
android:id="#+id/toolbar_default_textview_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:maxEms="50"
android:text="#string/app_name" />
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:gravity="center_vertical"
android:orientation="horizontal">
<ImageView
android:id="#+id/toolbar_default_img_search"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:padding="#dimen/_5sdp"
android:src="#drawable/icon_search" />
<ImageView
android:id="#+id/toolbar_default_img_filter_tag"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:padding="#dimen/_5sdp"
android:src="#drawable/icon_filter" />
<ImageView
android:id="#+id/toolbar_default_img_filter"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="#dimen/_5sdp"
android:src="#drawable/icon_filter" />
</LinearLayout>
</RelativeLayout>
Do changes as per your requirement by padding and margin to make a proper design.
Try using layout_alignParentRight , layout_toLeftOf , layout_toRightOf ,layout_alignParentLeft instead of layout_alignParentEnd , layout_toStartOf , layout_toEndOf and layout_alignParentStart or use Both in the Layout
<?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">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="40dp"
android:background="#color/black"
android:padding="5dp">
<ImageView
android:id="#+id/toolbar_default_img_menu"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:padding="5dp"
android:src="#drawable/add_btn" />
<TextView
android:id="#+id/toolbar_default_textview_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toRightOf="#+id/toolbar_default_img_menu"
android:layout_toLeftOf="#+id/toolbar_default_img_search"
android:text="#string/app_name"
android:textColor="#color/white"
android:textSize="15sp" />
<ImageView
android:id="#+id/toolbar_default_img_search"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toLeftOf="#+id/toolbar_default_img_filter_tag"
android:padding="5dp"
android:src="#drawable/add_btn" />
<ImageView
android:id="#+id/toolbar_default_img_filter_tag"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toLeftOf="#+id/toolbar_default_img_filter"
android:padding="5dp"
android:src="#drawable/add_btn" />
<ImageView
android:id="#+id/toolbar_default_img_filter"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:padding="5dp"
android:src="#drawable/add_btn" />
</RelativeLayout>
</RelativeLayout>
you need to add them as action button on the appbar
https://developer.android.com/training/appbar/actions.html
You need to add
android:layout_toLeftOf
along with
android:layout_toStartOf
and
android:layout_toRightOf
with
android:layout_toEndOf
Add
android:layout_toLeftOf:
along with
android:layout_toStartOf:
and
android:layout_toRightOf:
with
android:layout_toEndOf:
because you need to support lower API versions.

relative layout gravity center not aligning correctly

I'm trying to center the chilldren of my relative layout in the center of my screen but it's acting like it's aligned to the top of the parent and I can't figure out why.
my .XML:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"
android:gravity="center"
android:background="#f70909">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imageView2"
android:adjustViewBounds="true"
android:src="#drawable/dice"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:id="#+id/textMessage"
android:layout_centerHorizontal="true"
android:layout_below="#+id/imageView2" />
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/editUserSplash"
android:hint="Username"
android:gravity="center"
android:layout_centerHorizontal="true"
android:layout_below="#+id/textMessage" />
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/editPasswordSplash"
android:hint="Password"
android:layout_centerHorizontal="true"
android:gravity="center"
android:layout_below="#+id/editUserSplash" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Login"
android:id="#+id/btnSplash"
android:layout_centerHorizontal="true"
android:layout_below="#+id/editPasswordSplash" />
<ProgressBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/prgSplash"
style="#android:style/Widget.DeviceDefault.ProgressBar.Large"
android:layout_centerHorizontal="true"
android:indeterminate="true"
android:layout_below="#+id/btnSplash" />
</RelativeLayout>
I've tried making the parent a relativelayout without success and it won't align to the bottom either. Initially I thought the layout wasn't filling the whole screen but since its height and width are match_parent I don't think that's the problem. in android studio it is displaying correctly though so I must be missing something small.
I also tried using the gravity and layoutgravity parameters and a combination of the two but without success
Edit: I need the views to stay in the same formation relative to each other but centered in the screen vertically.
Edit 2:I set the background of the RelativeLayout to red and got this: So the relativelayout isn't filling my screen.
Edit 3:
Edit 4:
try this:
<?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="#f70909">
<RelativeLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imageView2"
android:adjustViewBounds="true"
android:src="#drawable/dice"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:id="#+id/textMessage"
android:layout_centerHorizontal="true"
android:layout_below="#+id/imageView2" />
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/editUserSplash"
android:hint="Username"
android:gravity="center"
android:layout_centerHorizontal="true"
android:layout_below="#+id/textMessage" />
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/editPasswordSplash"
android:hint="Password"
android:layout_centerHorizontal="true"
android:gravity="center"
android:layout_below="#+id/editUserSplash" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Login"
android:id="#+id/btnSplash"
android:layout_centerHorizontal="true"
android:layout_below="#+id/editPasswordSplash" />
<ProgressBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/prgSplash"
style="#android:style/Widget.DeviceDefault.ProgressBar.Large"
android:layout_centerHorizontal="true"
android:indeterminate="true"
android:layout_below="#+id/btnSplash" />
</RelativeLayout>
</RelativeLayout>
Try something like this.
<?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">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imageView2"
android:adjustViewBounds="true"
android:layout_centerInParent="true"/>
<LinearLayout
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
android:layout_centerInParent="true">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:id="#+id/textMessage" />
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/editUserSplash"
android:hint="Username"
android:gravity="center" />
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/editPasswordSplash"
android:hint="Password"
android:gravity="center" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Login"
android:id="#+id/btnSplash" />
<ProgressBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/prgSplash"
style="#android:style/Widget.DeviceDefault.ProgressBar.Large"
android:indeterminate="true" />
</LinearLayout>
</RelativeLayout>
UPDATE:
If setting the xml in an AlertDialog, it's possible that there is a space allotted at the bottom. I google and found this alert_dialog.xml for reference. It seems that there is a buttonPanel at the bottom with a minimum height of 54dip.
<LinearLayout android:id="#+id/buttonPanel"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="54dip"
android:orientation="vertical" >
<LinearLayout
style="?android:attr/buttonBarStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:paddingTop="4dip"
android:paddingStart="2dip"
android:paddingEnd="2dip"
android:measureWithLargestChild="true">
<LinearLayout android:id="#+id/leftSpacer"
android:layout_weight="0.25"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:visibility="gone" />
<Button android:id="#+id/button1"
android:layout_width="0dip"
android:layout_gravity="start"
android:layout_weight="1"
style="?android:attr/buttonBarButtonStyle"
android:maxLines="2"
android:layout_height="wrap_content" />
<Button android:id="#+id/button3"
android:layout_width="0dip"
android:layout_gravity="center_horizontal"
android:layout_weight="1"
style="?android:attr/buttonBarButtonStyle"
android:maxLines="2"
android:layout_height="wrap_content" />
<Button android:id="#+id/button2"
android:layout_width="0dip"
android:layout_gravity="end"
android:layout_weight="1"
style="?android:attr/buttonBarButtonStyle"
android:maxLines="2"
android:layout_height="wrap_content" />
<LinearLayout android:id="#+id/rightSpacer"
android:layout_width="0dip"
android:layout_weight="0.25"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:visibility="gone" />
</LinearLayout>
</LinearLayout>
I think this may help you
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:gravity="center">
<RelativeLayout
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Login"
android:textStyle="bold"
android:textAppearance="?android:attr/textAppearanceLarge"
android:id="#+id/textMessage"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true" />
<EditText
android:layout_margin="10dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/editUserSplash"
android:hint="Username"
android:layout_below="#+id/textMessage"
android:gravity="center" />
<EditText
android:layout_margin="10dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/editPasswordSplash"
android:hint="Password"
android:layout_below="#+id/editUserSplash"
android:gravity="center" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Login"
android:id="#+id/btnSplash"
android:layout_below="#+id/editPasswordSplash"
android:layout_centerHorizontal="true" />
</RelativeLayout>
Thanks to ank I was able to figure out that the reason why the RelativeLayout didn't fill my screen is that I used it in an alertDialog. So RelativeLayouts parent isn't the screen but the alertDialog. Since an alertDialog wraps its content it doesn't fill the entire screen.

How to make header with scrollview

I want to make a header in my layout just like below image:-
enter image description here
here my code:-
<RelativeLayout
android:id="#+id/header_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="5dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_alignParentLeft="true"
android:text="#string/filter"
android:drawableLeft="#drawable/filter1"
android:textSize="16dp"
android:id="#+id/textView"
android:background="#android:color/white"
android:textColor="#000"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/sort"
android:layout_centerVertical="true"
android:layout_alignParentRight="true"
android:gravity="center_vertical"
android:id="#+id/textview_sort"
android:textSize="16sp"
android:drawableLeft="#drawable/sort1"
android:background="#android:color/white"
android:textColor="#000"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignRight="#+id/textView"
android:drawableLeft="#drawable/view1"
android:text="#string/view"
android:textSize="16sp"
android:background="#android:color/white"
android:id="#+id/change_view"
android:textColor="#000"/>
</LinearLayout>
</RelativeLayout>
Any one can help me how solve my problem. I am new in android developing please help me.Thanks in advance
It Could be achieved by two manner.
1) Custom Header
2) Actionbar/Toolbar.
Custom header means only height attribute you have to take as#dimen/abs__action_bar_default_height(if you are using appcompat).
For eg. sample demo
`
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="#dimen/abc_action_bar_default_height_material"
android:background="#FF6600"
>
<ImageView
android:id="#+id/menu"
android:layout_width="50dp"
android:layout_height="100dp"
android:src="#drawable/abc_ic_menu_moreoverflow_mtrl_alpha"
android:layout_centerVertical="true"
/>
<Spinner
android:id="#+id/spinner"
android:layout_width="180dp"
android:layout_height="wrap_content"
android:layout_toRightOf="#+id/menu"
android:entries="#array/array_name"
>
</Spinner>
<ImageView
android:id="#+id/search"
android:layout_width="50dp"
android:layout_height="100dp"
android:src="#drawable/abc_ic_search_api_mtrl_alpha"
android:layout_toRightOf="#+id/spinner"
android:layout_centerVertical="true"
/>
<ImageView
android:id="#+id/star"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/star_yellow"
android:layout_toRightOf="#+id/search"
android:layout_marginLeft="5dp"
android:layout_centerVertical="true"
/>
<ImageView
android:id="#+id/shop"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/abc_ic_menu_copy_mtrl_am_alpha"
android:layout_toRightOf="#+id/star"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
/>
</RelativeLayout>
</LinearLayout>
`
Just give it a try.

Setting ImageViews side by side inside LinearLayout

I was trying to get two images side by side inside my LinearLayout. I tried setting my layout weight to 1 as suggested by many other posts I saw here for both views but to no avail. The imageViews in question are the ones with the ID rainfall and wind. What am I doing wrong here? I even tried wrapping them inside a relative layout and it did not work. This is what they look like with the code below: I just want the umbrellas to be side by side instead of one being slightly below the other one? Any ideas?
<Button
android:layout_width="wrap_content"
android:id="#+id/city"
android:layout_gravity="center"
android:gravity="center"
android:layout_height="wrap_content"
android:background="#null"
android:onClick="location"/>
<ImageButton
android:id="#+id/condition"
android:layout_gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#null"
android:onClick="sendMessage"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/txtCondition"
android:gravity="center"
android:layout_gravity="center" />
<TextView
android:layout_width="wrap_content"
android:id="#+id/temp"
android:layout_gravity="center"
android:gravity="center"
android:layout_height="wrap_content" />
<TextView
android:id="#+id/maxMin"
android:gravity="center"
android:layout_gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:id="#+id/highTemp"
android:layout_gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<ImageView
android:id="#+id/wind"
android:src="#drawable/ic_umbrella"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_gravity="start" />
<ImageView
android:id="#+id/rainfall"
android:src="#drawable/ic_umbrella"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_gravity="end" />
<TextView
android:id="#+id/secDay"
android:layout_width="wrap_content"
android:layout_gravity="center"
android:layout_height="wrap_content" />
<TextView
android:id="#+id/weekHigh"
android:layout_gravity="bottom|center"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
Try to put them inside a LinearLayout :
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:id="#+id/wind"
android:src="#drawable/ic_umbrella"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="start" />
<ImageView
android:id="#+id/rainfall"
android:src="#drawable/ic_umbrella"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_gravity="end" />
</LinearLayout>

Android button position changes while the screen rotating

Hai all I am new in android programming.....
For my application I am using image button and it successfully
installed on the device. But when I rotate the screen all the button
position get changed... and I need all the button placed at centre
of the screen.... And here is my code....
<TextView
android:id="#+id/testText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#FFCC99"
android:textSize="24dp" />
<ImageButton
android:id="#+id/up"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_marginRight="124dp"
android:layout_marginTop="80dp"
android:src="#drawable/up" />
<ImageButton
android:id="#+id/left"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_below="#+id/up"
android:layout_marginRight="200dp"
android:layout_marginTop="150dp"
android:src="#drawable/left" />
<ImageButton
android:id="#+id/right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_below="#+id/up"
android:layout_marginRight="50dp"
android:layout_marginTop="150dp"
android:src="#drawable/right" />
<ImageButton
android:id="#+id/down"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/up"
android:layout_alignParentRight="true"
android:layout_marginRight="124dp"
android:layout_marginTop="80dp"
android:src="#drawable/down" />
Please help............
Set android:gravity to center.
The following layout will do for you:
<?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:gravity="center"
android:orientation="horizontal" >
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Cool Button" />
</LinearLayout>
There are other ways to do it.
1. Using relative layout
2. Using 2 layouts : 1 one for portrait and and 1 for landscape.
You have to put all your widgets in a single container (LinearLayout) and center it. For that you can use the gravity attribute.
You can check this page:
http://developer.android.com/guide/topics/ui/layout/linear.html
I've made some modifications to your code. Please check whether this is the desired one.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center_horizontal"
android:orientation="vertical" >
<TextView
android:id="#+id/testText"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:gravity="center_horizontal"
android:text="Sample text"
android:textColor="#FFCC99"
android:textSize="24dp" />
<ImageButton
android:id="#+id/up"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/up" />
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<ImageButton
android:id="#+id/left"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_gravity="left"
android:src="#drawable/left" />
<ImageButton
android:id="#+id/right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_gravity="right"
android:src="#drawable/right" />
</RelativeLayout>
<ImageButton
android:id="#+id/down"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/down" />
</LinearLayout>

Categories

Resources