CODEWITHSUNDEEP
androidimageviewandroid-linearlayout
vetalitet
vetalitet

Reputation: 703

ImageView in LinearLayout is displayed on wrong place

I have a layout with one row:

<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center_horizontal"
    android:gravity="center_horizontal"
    android:orientation="horizontal" >

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:paddingRight="@dimen/total_sales_page_summary_text_distance"
        android:text="test2"
        android:textSize="@dimen/total_sales_page_info_font_size" />

    <TextView
        android:id="@+id/year_on_year"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textColor="@color/total_sales_info_text_color"
        android:textSize="@dimen/total_sales_page_info_font_size" />

    <ImageView
        android:id="@+id/tradeGreen"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginLeft="5dp"
        android:layout_gravity="center_vertical"
        android:contentDescription=""/>

</LinearLayout>

In source code I just set different number and visibility (GONE/VISIBLE) of imageview (clicking on different buttons).

as result:

  1. image is not visible (button1 was clicked)

enter image description here

2.image and some long number are vivible (button2 was clicked)

enter image description here

3.image and other little shorter number are visible (button3)

enter image description here

You can compare how it looks like. Text becomes visible but image is on the previous place. Why? Why image is not moved to left.

By the way. When screen is rotated - image becomes visible on correct place.

Upvotes: 0

Views: 140

Answers (3)

Piyush
Piyush

Reputation: 18923

This will be solved by using Weight.

Here your UI is horizontally so you need to change in your xml file. Like,

<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:gravity="center_horizontal"
android:orientation="horizontal" xmlns:android="http://schemas.android.com/apk/res/android">

<TextView
    android:layout_width="0dp"
    android:layout_height="match_parent"
    android:layout_weight="1"
    android:paddingRight="@dimen/total_sales_page_summary_text_distance"
    android:text="test2"
    android:textSize="@dimen/total_sales_page_info_font_size" />

<TextView
    android:id="@+id/year_on_year"
    android:layout_width="0dp"
    android:layout_height="match_parent"
    android:layout_weight="1"
    android:textColor="@color/total_sales_info_text_color"
    android:textSize="@dimen/total_sales_page_info_font_size" />

<ImageView
    android:id="@+id/tradeGreen"
    android:layout_width="0dp"
    android:layout_height="match_parent"
    android:layout_weight="1"
    android:layout_marginLeft="5dp"
    android:layout_gravity="center_vertical"
    android:contentDescription=""/>

</LinearLayout>

Upvotes: 0

Atul O Holic
Atul O Holic

Reputation: 6792

As Deepchand rightly said, add that Image as a drawable to the TextView directly. This will take care of the Image position and will remove an extra ImageView from the layout.

So to your TextView add this,

<TextView
    android:id="@+id/year_on_year"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:textColor="@color/total_sales_info_text_color"
    android:drawableRight="your image" //this will add an image to its right
    android:drawablePadding="5dp" // you can also add padding as per you need
    android:textSize="@dimen/total_sales_page_info_font_size" />

Hope this works the way you want. :)

Upvotes: 0

Giridharan
Giridharan

Reputation: 4462

Try to use weight.. it will align based on screen

<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center_horizontal"
    android:gravity="center_horizontal"
    android:orientation="horizontal" xmlns:android="http://schemas.android.com/apk/res/android">

    <TextView
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:paddingRight="@dimen/total_sales_page_summary_text_distance"
        android:text="test2"
        android:textSize="@dimen/total_sales_page_info_font_size" />

    <TextView
        android:id="@+id/year_on_year"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:textColor="@color/total_sales_info_text_color"
        android:textSize="@dimen/total_sales_page_info_font_size" />

    <ImageView
        android:id="@+id/tradeGreen"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:layout_marginLeft="5dp"
        android:layout_gravity="center_vertical"
        android:contentDescription=""/>

Upvotes: 1

Related Questions