button disappears after screen rotation

Question

I have a simple app that has a Button and a TextView, when I try screen rotation, the TextView stays same while the Button disappears as below.

The Button comes back when I rotate the screen again.

I couldn't find a solution, is this a possible bug?

1- Why does this happening, I guess it's about onCreate() state, but why does TextView stays while the Button disappears?

2- How to solve this issue

3- I'm using Bundle to save the number, is it related to this problem?

I'm using the latest version of Android Studio. Here is my code

MainActivity.java

package com.example.kalicidegiskenler;

import androidx.annotation.NonNull;
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity {

    TextView t1;
    Button b1;
    int say;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        t1 = (TextView) findViewById(R.id.text1);
        b1 = (Button) findViewById(R.id.button);

        if (savedInstanceState != null){

            say = savedInstanceState.getInt("sayac");
            t1.setText(String.valueOf(say));
        }
        else {
            say = 0;
        }
        
        b1.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                say ++;
                t1.setText(String.valueOf(say));
            }
        });

    }

    @Override
    protected void onSaveInstanceState(@NonNull Bundle outState) {
        super.onSaveInstanceState(outState);

        outState.putInt("sayac", say);
    }
}

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

    <TextView
        android:id="@+id/text1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello World!"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintHorizontal_bias="0.498"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.12" />

    <Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="159dp"
        android:layout_marginLeft="159dp"
        android:layout_marginBottom="513dp"
        android:text="Button"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

Answer 1

It is because the button is drawn out of screen; somewhere above the toolbar.

With app:layout_constraintBottom_toBottomOf used in combination with a padding of 513dp, the button falls out of the screen width (or landscape height) of 320 dp.

If you align it directly under the text, it will be always visible:

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

    <TextView
        android:id="@+id/text1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello World!"

        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintVertical_bias="0.12" />

    <Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"

        app:layout_constraintTop_toBottomOf="@+id/text1"        
        android:layout_marginTop="16dp"

        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        android:text="Button" />

</androidx.constraintlayout.widget.ConstraintLayout>

Pro-tip: Google advises to use multiples of 8dp for paddings, margins and sizes. This scales well on different screen sizes and it is aesthetically pleasing if views fall in a grid.