CODEWITHSUNDEEP
androidtextview
user1844638
user1844638

Reputation: 1073

image overlaps text view in android activity

Hi i am new to android and i have the following problem(see image).

enter image description here

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>

Upvotes: 0

Views: 1601

Answers (6)

Pankaj Kumar
Pankaj Kumar

Reputation: 83028

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..

Upvotes: 2

Puneet
Puneet

Reputation: 611

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" />

Upvotes: 1

Pratik Sharma
Pratik Sharma

Reputation: 13415

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.

Upvotes: 1

Ajay S
Ajay S

Reputation: 48612

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>

Upvotes: 1

itsrajesh4uguys
itsrajesh4uguys

Reputation: 4638

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" />

Upvotes: 2

Anup Cowkur
Anup Cowkur

Reputation: 20563

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" />

Upvotes: 1

Related Questions