cordova-android打包配置状态栏及http请求问题

本文详细介绍了如何在Android应用中实现状态栏的沉浸式效果和颜色修改,包括修改StatusBar.java文件以实现透明和字体颜色调整,并提供前端控制状态栏显示的方法。此外,还提到了基础打包配置,如解决HTTP请求错误和自定义UserAgent,以及前端根据环境切换API服务器地址的策略。
摘要由CSDN通过智能技术生成

一、状态栏沉浸式、及字体颜色、背景色修改
关于该效果实现一般分为前端页面js处理和打包配置处理,本文主要记录打包配置处理。
添加插件cordova-plugin-statusbar

cordova plugin add cordova-plugin-statusbar

1、打包配置处理,网上通常都说修改StatusBar.java文件,但请注意StatusBar.java文件有两个:
直接修改platforms/android/src/org/apache/cordova/statusbar/StatusBar.java

this.cordova.getActivity().runOnUiThread(new Runnable() {
            @Override
            public void run() {
                // // Clear flag FLAG_FORCE_NOT_FULLSCREEN which is set initially
                // // by the Cordova.
                // Window window = cordova.getActivity().getWindow();
                // window.clearFlags(WindowManager.LayoutParams.FLAG_FORCE_NOT_FULLSCREEN);

                // // Read 'StatusBarBackgroundColor' from config.xml, default is #000000.
                // setStatusBarBackgroundColor(preferences.getString("StatusBarBackgroundColor", "#000000"));

                // // Read 'StatusBarStyle' from config.xml, default is 'lightcontent'.
                // setStatusBarStyle(preferences.getString("StatusBarStyle", "lightcontent"));
				
				
				Window window = cordova.getActivity().getWindow();
				//添加代码start         
				window.addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);  //顶部状态栏
				window.addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION);  //底部导航栏
				window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
				window.setStatusBarColor(Color.TRANSPARENT);
				window.setNavigationBarColor(Color.TRANSPARENT);
				
				window.getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_LIGHT_STATUS_BAR);  //状态栏字体为黑色、不设为白色,根据顶部风格设置
				//添加代码end
				window.clearFlags(WindowManager.LayoutParams.FLAG_FORCE_NOT_FULLSCREEN);
				// setStatusBarStyle(preferences.getString("StatusBarStyle", "lightcontent"));
            }
        });

修改plugins/cordova-plugin-statusbar/src/android/StatusBar.java,其内容和同上,但要注意的是上面的文件是由该文件编译而来的,所以如果修改该文件的话,需要重新添加平台完成编译:

cordova platform remove android
cordova platform add android

2、调用接口,前端控制,不同页面状态栏效果不同(作者实际体验并不好,仅供参考!!!)
在实验之前请一定要安装全屏插件:

cordova plugin add cordova-plugin-fullscreen
cordova plugin add cordova-plugin-device

我只在main.js中执行成功过,在vue页面上代码没成功过,但是不报错😂

document.addEventListener('deviceready', function() {

  StatusBar.hide();

},alse)

这里列出大部分方法,有兴趣可以试一下:

StatusBar.overlaysWebView
StatusBar.styleDefault
StatusBar.styleLightContent
StatusBar.styleBlackTranslucent
StatusBar.styleBlackOpaque
StatusBar.backgroundColorByName
StatusBar.backgroundColorByHexString
StatusBar.hide
StatusBar.show

二、常用基础打包配置

1、打包出现net::ERR_CLEARTEXT_NOT_PERMITTED错误,原因是android9开始不允许http,允许https请求
解决办法,在platforms\android\app\src\main\AndroidManifest.xml的applicatioin节点加android:usesCleartextTraffic=“true” 属性

<manifest ...>
    <application
        ...
        android:usesCleartextTraffic="true"
        ...>
        ...
    </application>
   </manifest>

2、前端通过UserAgent来识别是否在android环境下,在MainActivity.java 中增加特殊的UserAgent来指定自己的app
platforms/android/app/src/main/java/‘appid路径’/MainActivity.java

package com.ntc.eidp.flat;

import android.os.Bundle;
import org.apache.cordova.*;
//新增
import android.webkit.WebSettings;
import android.webkit.WebView;
public class MainActivity extends CordovaActivity
{
    @Override
    public void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState);

        // enable Cordova apps to be started in the background
        Bundle extras = getIntent().getExtras();
        if (extras != null && extras.getBoolean("cdvStartInBackground", false)) {
            moveTaskToBack(true);
        }

        // Set by <content src="index.html" /> in config.xml
        loadUrl(launchUrl);
		
        setUserAgent();
    }
	// 新增
    private void setUserAgent() {
        WebView webView = (WebView) this.appView.getView();
        if (webView != null) {
            WebSettings webSettings = webView.getSettings();
            if (webSettings != null) {
                String userAgent = webSettings.getUserAgentString();
                if (userAgent == null) {
                    userAgent = "/自己的别名";
                } else {
                    userAgent += "/自己的别名";
                }
                webSettings.setUserAgentString(userAgent);
                
                webSettings.setUseWideViewPort(true);
                webSettings.setLoadWithOverviewMode(true);
            }
        }
    }
}

3、在前端有如下修改:
1) 在webpack配置发布后的服务地址,配置apiServerUrl

function isNTCAndroidClient() {
  if (/ntcandroidclient/.exec(navigator.userAgent)) {
    return true
  }
  else {
    return false
  }
}
function isAndroidBrowser() {
  if (/Android/.exec(navigator.userAgent)) {
    return true
  }
  else {
    return false
  }
}
const apiServerUrl = isNTCAndroidClient()?'http://xx.xxx.xx.xxx:10000':'';
...
export {
  ...
  apiServerUrl,
  ...
}

2) src\api下的服务接口,必须引用apiServerUrl,诸如:

import { apiServerUrl } from '@/config/env'
export const loginByUsername = (username, password, code, randomStr) => {
			  const grant_type = 'password'
			  return request({
				url: apiServerUrl + '/auth/oauth/token',
				headers: {
				  isToken: false,
				  'TENANT-ID': '1',
				  'Authorization': 'Basic ZnJhbWV3b3JrOmZyYW1ld29yaw=='
				},
				method: 'post',
				params: { username: '8ba5469aabccdb38d9422ff47826b778$' + username, password, randomStr, code, grant_type, scope }				
			  })
			}
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值