第一步 首先Android 必须是Q 就是10.0才能支持暗黑模式
第二步 设置Android webView暗黑模式 WebViewFeature必须引入这个包
implementation 'androidx.webkit:webkit:1.3.0'
if (WebViewFeature.isFeatureSupported(WebViewFeature.FORCE_DARK)) {
if(DarkModeUtils.isDarkMode(BaseApplication.getInstace().getApplication())){
WebSettingsCompat.setForceDark(webSettings, WebSettingsCompat.FORCE_DARK_ON);
}else{
WebSettingsCompat.setForceDark(webSettings, WebSettingsCompat.FORCE_DARK_OFF);
}
}
DarkModeUtils这个就是自己定义的切换暗黑模式保存的状态呢? 我也贴下代码
public class DarkModeUtils {
public static final String KEY_CURRENT_MODEL = "night_mode_state_sp";
private static int getNightModel(Context context) {
SharedPreferences sp = context.getSharedPreferences(KEY_CURRENT_MODEL, Context.MODE_PRIVATE);
return sp.getInt(KEY_CURRENT_MODEL, AppCompatDelegate.MODE_NIGHT_FOLLOW_SYSTEM);
}
public static void setNightModel(Context context, int nightMode) {
SharedPreferences sp = context.getSharedPreferences(KEY_CURRENT_MODEL, Context.MODE_PRIVATE);
sp.edit().putInt(KEY_CURRENT_MODEL, nightMode).apply();
}
/**
* ths method should be called in Application onCreate method
*
* @param application application
*/
public static void init(Application application) {
int nightMode = getNightModel(application);
AppCompatDelegate.setDefaultNightMode(nightMode);
}
/**
* 应用夜间模式
*/
public static void applyNightMode(Context context) {
AppCompatDelegate.setDefaultNightMode(AppCompatDelegate.MODE_NIGHT_YES);
setNightModel(context, AppCompatDelegate.MODE_NIGHT_YES);
}
/**
* 应用日间模式
*/
public static void applyDayMode(Context context) {
AppCompatDelegate.setDefaultNightMode(AppCompatDelegate.MODE_NIGHT_NO);
setNightModel(context, AppCompatDelegate.MODE_NIGHT_NO);
}
/**
* 跟随系统主题时需要动态切换
*/
public static void applySystemMode(Context context) {
AppCompatDelegate.setDefaultNightMode(AppCompatDelegate.MODE_NIGHT_FOLLOW_SYSTEM);
setNightModel(context, AppCompatDelegate.MODE_NIGHT_FOLLOW_SYSTEM);
}
/**
* 判断App当前是否处于暗黑模式状态
*
* @param context 上下文
* @return 返回
*/
public static boolean isDarkMode(Context context) {
int nightMode = getNightModel(context);
if (nightMode == AppCompatDelegate.MODE_NIGHT_FOLLOW_SYSTEM) {
int applicationUiMode = context.getResources().getConfiguration().uiMode;
int systemMode = applicationUiMode & Configuration.UI_MODE_NIGHT_MASK;
return systemMode == Configuration.UI_MODE_NIGHT_YES;
} else {
return nightMode == AppCompatDelegate.MODE_NIGHT_YES;
}
}
然后还要设置 webView背景
webview.setBackgroundColor(ContextCompat.getColor(this,R.color.white));
颜色必须要有两份 一个是默认的颜色 另一个是night模式的 如下图
?night在res文件下创建一个 values-night->colors.xml 就可以了
如果不知道H5同事那边配置的是不是对的? 我们可以在本地的assets的文件下创建一个html 测试下 没问题 在等H5同事那边是配好,下边看下html的代码 其实也很简单
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title>页面适应黑暗模式</title>
</head>
<style type="text/css">
.back {background: white; color: #555;text-align: center}
@media (prefers-color-scheme: dark) {
.back {background: #333; color: white;}
.models {border:solid 1px #00ff00}
}
@media (prefers-color-scheme: light) {
.back {background: white; color: #555;}
.models {border:solid 1px #2b85e4}
}
</style>
<body class="back">
<div class="models"><h1>测试文字</h1></div>
</body>
</html>
然后在加载本地的html
webview.loadUrl("file:///android_asset/test.html");//测试黑暗模式
看下效果?
?效果看起来完美?
后边我会在更新下 app适配暗黑模式? 希望能帮到各位 少走弯路
|