Problem: When use Modal in react-native, the status bar is not included if you make a full-screen mask like a translucent background. I found the below method is able to make the status-bar to be included in.

forgive my poor English, I'm practicing.

what I do is to replace the default Modal implementation on Android as below.

1.  make directory like below , and copy code from

code in file 'ModifiedReactModalHostManager' and 'ModifiedReactModalHostView' is completely copied from

'react-native/com/facebook/react/views/modal/ReactModalHostManager' and

'react-native/com/facebook/react/views/modal/ReactModalHostView'. And replace all 'ReactModalHostView' words with 'ModifiedReactModalHostView' in both files.

2. use a self-defined MainReactPackage instead of the default react-native MainReactPackage.

public class MyMainReactPackage extends MainReactPackage {

    @Override
public List<ViewManager> createViewManagers(ReactApplicationContext reactContext) {
List<ViewManager> list = super.createViewManagers(reactContext);
for (int i = 0; i < list.size(); i++) {
if (list.get(i) instanceof ReactModalHostManager) {
list.remove(i);
list.add(new ModifiedReactModalHostManager());
break;
}
}
return list;
}
}

in your ReactApplication class , replace MainReactPackage.

@Override
protected List<ReactPackage> getPackages() {
return Arrays.<ReactPackage>asList(
new MyMainReactPackage() // previously is MainReactPackage()
);
}

as above, replace the ReactModalHostManager with ModifiedReactModalHostManager. Now every Modal in react-native code will use the implementation of ModifiedReactModalHostView rather than the default ReactModalHostView.

3. include the status bar of Modal in ModifiedReactModalHostView.

replace function `private void updateProperties` with code below.

private void updateProperties() {
Assertions.assertNotNull(mDialog, "mDialog must exist when we call updateProperties");
Window window = mDialog.getWindow(); mDialog.getWindow().setFlags(
WindowManager.LayoutParams.FLAG_LAYOUT_NO_LIMITS,
WindowManager.LayoutParams.FLAG_LAYOUT_NO_LIMITS
);
Activity currentActivity = getCurrentActivity();
if (currentActivity != null) {
FrameLayout content = window.getDecorView().findViewById(android.R.id.content);
LinearLayout.LayoutParams layoutParams = (LinearLayout.LayoutParams) content.getLayoutParams();
View preContentView = currentActivity.getWindow().findViewById(android.R.id.content);
if (preContentView != null) {
layoutParams.height = currentActivity.getWindow().findViewById(android.R.id.content).getHeight();
}
content.setLayoutParams(layoutParams);
} if (mTransparent) {
mDialog.getWindow().clearFlags(WindowManager.LayoutParams.FLAG_DIM_BEHIND);
} else {
mDialog.getWindow().setDimAmount(0.5f);
mDialog.getWindow().setFlags(
WindowManager.LayoutParams.FLAG_DIM_BEHIND,
WindowManager.LayoutParams.FLAG_DIM_BEHIND);
}
}

Then it is OK to build application and test your Modal.

Note that this method is related to your react-native's version, when your rn's version changes, you should also make change to the ModifiedModal to make sure it is suitable.

练英语,练英语的,兄弟们别笑,也是方便遇到这个问题的国际友人们嘛。。。

the status bar issue of react-native Modal on Android ( RN v0.57.0)的更多相关文章

  1. React Native App设置&Android版发布

    React Native系列 <逻辑性最强的React Native环境搭建与调试> <ReactNative开发工具有这一篇足矣> <解决React Native un ...

  2. React Native移植原生Android

    (一)前言 之前已经写过了有关React Native移植原生Android项目的文章,不过因为RN版本更新的原因吧,跟着以前的文章可能会出现一些问题,对于初学者来讲还是会有很多疑难的困惑的,而且官方 ...

  3. 将React Native集成至Android原生应用

    将React Native集成至Android原生应用 Android Studio 2.1 Preview 4生成的空项目 react-native 环境 0.22.2 初次编译后apk有1.1M, ...

  4. React Native hot reloading & Android & iOS

    React Native hot reloading & Android & iOS https://facebook.github.io/react-native/docs/debu ...

  5. React Native 4 for Android源码分析 一《JNI智能指针之介绍篇》

    文/ Tamic: http://blog.csdn.net/sk719887916/article/details/53455441 原文:http://blog.csdn.net/eewolf/a ...

  6. 关于React Native项目在android上UI性能调试实践

    我们尽最大的努力来争取使UI组件的性能如丝般顺滑,但有的时候这根本不可能做到.要知道,Android有超过一万种不同型号的手机,而在框架底层进行软件渲染的时候是统一处理的,这意味着你没办法像iOS那样 ...

  7. React Native工程修改Android包名

    默认初始化的React Native工程,生成Android工程的时候,包名默认是React Native工程的名字,跟一般Android工程com.company.xxx不一样. 这时候就需要手动修 ...

  8. React Native升级方法——升级到最新版本0.59

    React Native最近有大动作,于2019年3月12日发布新版本0.59.主要有两点值得升级:支持React Hooks:升级了JavaScriptCore,使Android性能有大幅提升.据用 ...

  9. 【React Native开发】React Native移植原生Android项目(4)

    ),React Native技术交流4群(458982758),请不要反复加群!欢迎各位大牛,React Native技术爱好者加入交流!同一时候博客左側欢迎微信扫描关注订阅号,移动技术干货,精彩文章 ...

随机推荐

  1. 关于Opengl投影矩阵

    读 http://www.songho.ca/opengl/gl_projectionmatrix.html 0.投影矩阵的功能: 将眼睛空间中的坐标点 [图A的视椎体]     映射到     一个 ...

  2. Python随笔--正则表达式匹配IP

  3. Python标准库01正则表达式

    在学习网络爬虫的过程中,需要抓取网页的评论数,涉及到正则表达式,便顺便看了看.正则表达式是文字处理中常用的工具. 1正则表达式的常用字符串 .       任何单个字符 [] 字符集对单个字符给出取值 ...

  4. python 全栈开发笔记 3

    正则表达式 正则表达式(RE)是一种小型的,高度专业化的,它镶嵌在python中,并通过re模块实现,正则表达式编译成一系列的字节码,然后由用c编写的匹配引擎执行. #正则表达式 import re ...

  5. Possibly two send backs are happening for the same request

    错误 wso2 WARN {org.apache.synapse.transport.passthru.SourceHandler} -  Illegal incoming connection st ...

  6. Spring 基础知识(一)基本概念 DI、IOC、AOP

    DI(依赖注入) 和IOC(控制反转)都是一种设计思想,要理解他们,让我们从coding中的一些痛点入手. 依赖注入 Dependency Injection : 如果A类要使用B类的一个方法,首先必 ...

  7. spring中基于JDK和CGLIB代理在项目的应用

    一.环境与问题 环境 spring boot的版本是1.2.1.RELEASE.JDK版本是1.7 问题 ​ A服务 PeopleService 调用B服务 HelloService ,其中B服务的方 ...

  8. jmeter之headers中的Content-Type.

    jmeter在发送http post请求时,会把body  里的数据格式给携带上(最好携带上),一般在信息头里增加.另因一篇文章.感觉写的非常好.https://imququ.com/post/fou ...

  9. HTML+css基础认识

    标签:<div><span                                                                              ...

  10. cocos图片的选择以及压缩

    我们在使用cocos在windows平台下,运行速度很快很流畅,很强大,可是当我们打包成apk文件,在手机上运行的时候,流畅度很可能降低,甚至还有间歇性内存彪高. 游戏内存优化我们一般可以从这么3个方 ...