Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Prevent ImageView from pushing views offscreen

I have a linear layout which contains an imageview and another linear layout which is a bottom bar on the screen. I use the bottom bar elsewhere in my project and I dont think it is the problem.

The problem is that the imageview takes up the entire screen. The image itself doesn't, but the view does. I can't seem to figure this out. As you can see in my xml, I am not using fill_parent for the image view and I have tried every possible scaleType for the image.

Any suggestions? Also if it helps I am building to Android API 8

Edit: I have changed the xml below so that you can use exactly what I have written. (This is the image that I use in the image view: http://i.imgur.com/qN5aT.jpg)

<?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:orientation="vertical"
    android:background="#FFFFFF" >

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:scaleType="fitStart"
        android:src="@drawable/quote_sample_img" />

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:gravity="bottom"
        android:orientation="vertical" >

        <TextView
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:text="This is text" />
    </LinearLayout>

</LinearLayout>

http://i.imgur.com/m3msH.png (Sorry not enough reputation to post the actual picture)

like image 525
amc6 Avatar asked Mar 13 '12 02:03

amc6


Video Answer


2 Answers

Things seems to work if android:layout_weight="1.0" is added to the ImageView.

(I am unsure about what exactly is happening and in what order in the layout algorithm so can not explain why.)

<?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:orientation="vertical"
    android:background="#FFFFFF" >

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1.0"
        android:scaleType="fitStart"
        android:src="@drawable/quote_sample_img" />

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:gravity="bottom"
        android:orientation="vertical" >

        <TextView
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:text="This is text" />
    </LinearLayout>

</LinearLayout>
like image 116
HenrikS Avatar answered Oct 22 '22 19:10

HenrikS


It's the wrap_content in the image - the source file is probably too tall.

Use this in your ImageView to cause the image area to reset to the image's new size after scaling:

android:adjustViewBounds="true"

I'd also change the height of the ImageView so it fills the screen and forces your bar to always be on the bottom:

android:layout_height="0dip" // faster than match_parent for weight
android:layout_weight="1.0"
like image 40
radley Avatar answered Oct 22 '22 17:10

radley