How do I hide the navigation bar in the editor for android studio?

Question

How do I make the bottom navigation bar disappear in the visual XML editor in Android Studio? I already have the AppTheme set to NoActionBar. The navigation bar is very annoying because my phone does not have one so when I place something on the very bottom of my app in the visual editor (https://i.sstatic.net/pxP84.png), This happens when I run the app on my phone: https://i.sstatic.net/rXxsw.jpg . Someone please help me. I cannot continue my development until this issue is fixed.

I have looked at both of these and they were no help to me. How to hide navigation bar permanently in android activity? How to emulate immersive mode in layout editor

Here is the screenshot of the Navigation bar which I want removed: https://i.sstatic.net/0QRRx.jpg

Here is my XML Code for activity_main:

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.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"
    android:background="#474747"
    tools:context=".MainActivity">

    <EditText
        android:id="@+id/typeMessage"
        android:layout_width="354dp"
        android:layout_height="61dp"
        android:layout_marginTop="504dp"
        android:background="#595858"
        android:ems="10"
        android:hint="Type..."
        android:inputType="text"
        android:padding="10dp"
        android:textColorHint="#969494"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <ImageView
        android:id="@+id/imageView2"
        android:layout_width="60dp"
        android:layout_height="59dp"
        android:layout_marginEnd="8dp"
        android:layout_marginRight="8dp"
        android:layout_marginTop="504dp"
        app:layout_constraintEnd_toEndOf="@+id/typeMessage"
        app:layout_constraintTop_toTopOf="parent"
        app:srcCompat="@android:drawable/ic_menu_send" />

    <EditText
        android:id="@+id/messageOutput"
        android:layout_width="354dp"
        android:layout_height="480dp"
        android:background="#595858"
        android:ems="10"
        android:inputType="textMultiLine"
        app:layout_constraintBottom_toTopOf="@+id/typeMessage"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>

Here is my code for MainActivity.kt:

import android.support.v7.app.AppCompatActivity
import android.os.Bundle

class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
    }
}

Thank you for your help!

Answer 1

It may be too late, but in case you haven't figured it out yet, I think I may have found a solution for you:

Put this in your onCreate()

getWindow().getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_HIDE_NAVIGATION);

Then add this:

@Override
public void onWindowFocusChanged(boolean hasFocus) {
super.onWindowFocusChanged(hasFocus);
if (hasFocus) {
    getWindow().getDecorView().setSystemUiVisibility(
            View.SYSTEM_UI_FLAG_LAYOUT_STABLE
                    | View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION
                    | View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
                    | View.SYSTEM_UI_FLAG_HIDE_NAVIGATION
                    | View.SYSTEM_UI_FLAG_FULLSCREEN
                    | View.SYSTEM_UI_FLAG_IMMERSIVE_STICKY);
}
}

Here's the documentation: https://developer.android.com/training/system-ui/navigation