Query in image size in android studio

问题

Hello. There is a ball image of 640X480.In the image, as you can see I have specified layout_width as 849px and layout_height as 680 px.I have taken a background colour of blue.As layout_width specified is much more than 640px(width size of image), then why the image's left side and right side is not surrounded with blue background.Image's top and bottom is surrounded with blue background.

XML Code:

    <?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <ImageView
        android:id="@+id/imageView3"
        android:layout_width="849px"
        android:layout_height="680px"
        android:background="#2196F3"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:srcCompat="@drawable/ball_640x480" />
</androidx.constraintlayout.widget.ConstraintLayout> 

What I cant understand is in the image,after setting wrap_content also why is still there white space below and above the image?

Below is the updated xml:

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <ImageView
        android:id="@+id/imageView3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:srcCompat="@drawable/ball_640x480" />
</androidx.constraintlayout.widget.ConstraintLayout>

回答1:

Your situation is given due to the fact that the image is not as big as the ImageView is. If you would like the image to completely fill the View you could use the property android:scaleType="centerCrop". You can follow along this visual guide on ImageView's different scale types and see how it behaves on different scale types.

If you would like to have a border along the ImageView I would not use the android:background property because your image is going to be drawn on top of the background and probably completely cover it.

My approach would be to have a parent view that is just a little bit bigger than the image view and that view hold the background property. You can easily do that with a FrameLayout and applying some android:layout_margin to the ImageView like the following example:

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">


    <FrameLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="#2196F3"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent">

        <ImageView
            android:id="@+id/imageView3"
            android:gravity="center"
            android:layout_margin="16dp"
            android:layout_width="849px"
            android:layout_height="680px"
            app:srcCompat="@drawable/ball_640x480" />
    </FrameLayout>

</androidx.constraintlayout.widget.ConstraintLayout> 

Screenshot related to the comments:

Code that works

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">


    <ImageView
            android:id="@+id/imageView3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:srcCompat="@drawable/ball_640x480"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"/>

</androidx.constraintlayout.widget.ConstraintLayout> 

来源：https://stackoverflow.com/questions/62378079/query-in-image-size-in-android-studio