Android Studio space between my spinner and page title

Viewed 87

I recently started using Android Studio because I wanted to create an app for my Android device.
I chose the bottom navigation activity as a template and added a spinner. I put the spinner in the highest possible position under the page title, but when I launch the app from debugging on my Android 10 phone, there is a large white space between my spinner and my page title. But there isn't any in the preview.
I have a Xiaomi Redmi Note 8T Global if that matters.

My fragment 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=".ui.myfragment.MyFragment"
    tools:layout_editor_absoluteY="81dp">

    <Spinner
        android:id="@+id/myspinner"
        android:layout_width="391dp"
        android:layout_height="wrap_content"
        android:minHeight="48dp"
        android:spinnerMode="dropdown"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.0"
        tools:ignore="SpeakableTextPresentCheck" />


</androidx.constraintlayout.widget.ConstraintLayout>

Preview in the android studio

preview in android studio

what it looks like in the app

what it looks like in app

Thank's in advance

5 Answers

Try removing tools:layout_editor_absoluteY="81dp" from your constraintLayout. Absolute layout lets you specify exact locations (x/y coordinates) of its children.

Remove below lines from your code to solve the issue::

tools:layout_editor_absoluteY="81dp"

app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintVertical_bias="0.0"

Try this to solve the issue::

<?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"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:tools="http://schemas.android.com/tools">

    <androidx.appcompat.widget.AppCompatSpinner
        android:id="@+id/myspinner"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:minHeight="48dp"
        android:spinnerMode="dropdown"
        android:entries="@array/spinnnerItem"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

enter image description here

It generally works alike it is (without the messy preview settings):

<?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"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">

    <Spinner
        android:id="@+id/myspinner"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:minHeight="48dp"
        android:spinnerMode="dropdown"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.0" />

</androidx.constraintlayout.widget.ConstraintLayout>

While the actual difference is, that the Activity has a different theme than the XML preview. The one theme has an ActionBar - and the other one doesn't (some .NoActionBar theme). So you may want to apply the same theme in AndroidManifest.xml, which you use for the the XML preview.

I looked into my MainActivity.xml file and there was a line of Code: android:paddingTop="?attr/actionBarSize"> just remove it and no more white bar!

Credits to franvillacis, who made me look again into my MainActivity.xml

Related