android - 在 React Native 中隐藏 Android 导航栏

Question

如何隐藏 Android Navigation Bar在 React Native 中？

我指的是屏幕底部带有软件后退按钮和主页按钮的栏，而不是页面顶部随导航器组件一起提供的组件。

This page on android.com解释了如何为原生开发者做这件事。有人可以解释如何通过 React Native 应用程序完成此操作吗？谢谢。

Answer 1

如果您希望永久实现此目的，则必须在应用创建时以及它重新获得焦点时隐藏导航栏。

为此，在您的 MainActivity.java 中添加:

...
import android.os.Bundle;
import android.view.View;

public class MainActivity extends ReactActivity {

    ...

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        hideNavigationBar();
    }

    @Override
    public void onWindowFocusChanged(boolean hasFocus) {
        super.onWindowFocusChanged(hasFocus);
        if (hasFocus) {
            hideNavigationBar();
        }
    }

    private void hideNavigationBar() {
        getWindow().getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_HIDE_NAVIGATION);
    }
}

您可能希望使其“沉浸式”，以便用户仍然可以通过从屏幕底部拉动来访问导航栏。 为此，添加 View.SYSTEM_UI_FLAG_IMMERSIVE_STICKY 标志:

...
import android.os.Bundle;
import android.view.View;

public class MainActivity extends ReactActivity {

    ...

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        hideNavigationBar();
    }

    @Override
    public void onWindowFocusChanged(boolean hasFocus) {
        super.onWindowFocusChanged(hasFocus);
        if (hasFocus) {
            hideNavigationBar();
        }
    }

    private void hideNavigationBar() {
        getWindow().getDecorView().setSystemUiVisibility(
            View.SYSTEM_UI_FLAG_HIDE_NAVIGATION
            | View.SYSTEM_UI_FLAG_IMMERSIVE_STICKY);

    }
}

您可以在 android documentation 上找到更多选项.