Фрагмент не скроет

У меня есть панель навигации, которая должна быть скрыта при нажатии кнопки, но ничего не происходит.

import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.widget.Button;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity {
private TextView mavisTxt;
private Button testBtn;
private Fragment navigationBar;


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

}

private void initVariables() {
    navigationBar = new HeaderNav();
    mavisTxt = (TextView)findViewById(R.id.mavisTxt);
    testBtn = (Button)findViewById(R.id.testBtn);


    testBtn.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View view) {
                FragmentManager fm = getSupportFragmentManager();
                fm.beginTransaction()
                        .hide(navigationBar)
                        .commit();
                mavisTxt.setText("navbar is hidden");
        }
    });

}
}

Вот файл java для фрагмента

public class HeaderNav extends Fragment {
    private static Button homeBtn, optionsBtn, connectionBtn, micBtn, aboutBtn;
    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container,@Nullable Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.navbar, container, false);

        homeBtn = (Button)view.findViewById(R.id.homeBtn);
        optionsBtn = (Button)view.findViewById(R.id.optionsBtn);
        connectionBtn = (Button)view.findViewById(R.id.micBtn);
        micBtn = (Button)view.findViewById(R.id.homeBtn);
        aboutBtn = (Button)view.findViewById(R.id.aboutBtn);

        return view;
    }
}

и тег фрагмента в main_activity xml:

<fragment
        android:id = "@+id/navigationBar"
        android:name = "com.example.egi.mavisme.HeaderNav"
        android:layout_width = "fill_parent"
        android:layout_height = "60dp"
        app:layout_constraintEnd_toEndOf = "parent"
        app:layout_constraintHorizontal_bias = "1.0"
        app:layout_constraintStart_toStartOf = "parent"
        app:layout_constraintTop_toTopOf = "parent"
        tools:layout = "@layout/navbar" />

Что я делаю неправильно? ни одно из решений здесь, в SO, не работает для меня. Кто-нибудь Помогите мне.

Обновлено:

Я отредактировал свой код, и теперь он скрывается. У меня есть еще одна проблема при добавлении пользовательской анимации, я получаю

java.lang.NullPointerException: Attempt to invoke virtual method 'void android.view.ViewGroup.startViewTransition(android.view.View)' on a null object reference

Вот мой код сейчас:

public class MainActivity extends AppCompatActivity {
    private TextView mavisTxt;
    private Button testBtn;
    private HeaderNav navigationBar;

    private FragmentManager fm;
    private FragmentTransaction ft;


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

    }

    private void initVariables() {
        fm = getSupportFragmentManager();
        ft = fm.beginTransaction();
        navigationBar = (HeaderNav)fm.findFragmentById(R.id.navigationBar);

        mavisTxt = (TextView)findViewById(R.id.mavisTxt);
        testBtn = (Button)findViewById(R.id.testBtn);


        testBtn.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                    ft.setCustomAnimations(android.R.animator.fade_in, android.R.animator.fade_out);
                    ft.hide(navigationBar)
                    .commit();
                    if (navigationBar.isHidden()) {mavisTxt.setText("navbar is hidden");}
            }
        });

    }
}