跳到主要内容

uniapp

横屏配置

pages.json中配置 pageOrientation: "auto"

"globalStyle": {
"pageOrientation": "auto"
}

此时已经可以全局切换横竖屏了,再分别给横竖屏各写一套样式

方式一、css 控制

/* <view class="landscape">666</view> */

/* 竖屏 */
@media screen and (orientation: portrait) {
.landscape {
color: #f00;
}
}

/* 横屏 */
@media screen and (orientation: landscape) {
.landscape {
color: #00f;
}
}

方式二、js 控制

在 data 里定义isLandScape: false表示是否横屏,默认为竖屏

// <view :class="{'landscape': isLandScape}">666</view>
// .landscape { color: #00f; }

onResize() {
uni.getSystemInfo({
success: (res) => {
if (res.windowWidth > res.windowHeight) {
// 横屏
this.isLandScape = true
} else {
// 竖屏
this.isLandScape = false
}
}
})
}

还有一种是使用uni.onWindowResize(),但是在onLoad()onShow()中,在切换时都会触发两次

onLoad() {
uni.onWindowResize((res) => {
if (res.size.windowWidth > res.size.windowHeight) {
this.isLandScape = true
} else {
this.isLandScape = false
}
})
}

App 离线打包

官方文档:https://nativesupport.dcloud.net.cn/AppDocs/usesdk/android

生成离线资源

打开 HBuilderX 选择 发行 => 原生 App-本地打包 => 生成本地打包 App 资源,打包后的资源在unpackage/resources路径下

开发环境

android studio 配置

放置打包资源

打开项目后找到 assets/apps目录,下一级目录名称是__UNI__2A4F113,这个是 uniapp 应用标识,可以在 HBuilderX 的 manifes.json 中找到,也可以在打包资源的 manifes.json 里找到。 该目录下面还有一个 www 目录,这里面就是放本地打包资源的。使用时将 www 目录下的文件全部删除,将自己的打包资源放进去。

assets/data/dcloud_control.xml里也要修改应用标识

<hbuilder>
<apps>
<app appid="__UNI__2A4F113" appver=""/>
</apps>
</hbuilder>

设置应用名称

路径app/src/main/res/values/strings.xml

<resources>
<string name="app_name">应用名称</string>
</resources>

设置应用图标

路径app/src/main/res/,新建一个文件夹drawable-hdpi,里面放 logo 图片

配置 build.gradle

apply plugin: 'com.android.application'

android {
compileSdkVersion 29
buildToolsVersion '28.0.3'
defaultConfig {
applicationId "uni.UNI2A4F113"
minSdkVersion 21
targetSdkVersion 28
versionCode 101
versionName "1.7.85"
multiDexEnabled true
ndk {
abiFilters 'armeabi-v7a', 'arm64-v8a'
}
manifestPlaceholders = [
"apk.applicationId" : "uni.UNI2A4F113",
"GETUI_APPID" : "unipush的appid",
"plus.unipush.appid" : "unipush的appid",
"plus.unipush.appkey" : "unipuish的appkey",
"plus.unipush.appsecret": "unipush的secrety"
]
compileOptions {
sourceCompatibility JavaVersion.VERSION_1_8
targetCompatibility JavaVersion.VERSION_1_8
}
}
signingConfigs {
config {
keyAlias '__uni__2a4f113'
keyPassword 'J02ojI7r'
storeFile file('key.keystore')
storePassword 'J02ojI7r'
v1SigningEnabled true
v2SigningEnabled true
}
}
buildTypes {
debug {
signingConfig signingConfigs.config
minifyEnabled false
proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
}
release {
signingConfig signingConfigs.config
minifyEnabled false
proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
}
}
lintOptions {
checkReleaseBuilds false
abortOnError false
}
aaptOptions {
additionalParameters '--auto-add-overlay'
ignoreAssetsPattern "!.svn:!.git:.*:!CVS:!thumbs.db:!picasa.ini:!*.scc:*~"
}
}
repositories {
flatDir {
dirs 'libs'
}
}
dependencies {
implementation fileTree(include: ['*.jar'], dir: 'libs')
implementation fileTree(include: ['*.aar'], dir: 'libs')
implementation 'androidx.appcompat:appcompat:1.0.0'
implementation 'androidx.legacy:legacy-support-v4:1.0.0'
implementation 'androidx.recyclerview:recyclerview:1.0.0'
implementation 'com.facebook.fresco:fresco:2.5.0'
implementation "com.facebook.fresco:animated-gif:2.5.0"
implementation 'com.github.bumptech.glide:glide:4.9.0'
implementation 'com.alibaba:fastjson:1.1.46.android'
}
  1. 配置应用标识applicationId,这里还是同上的应用标识

  2. 配置应用版本名称和版本号,这里要和 HBuilderX 的 manifes.json 中的版本号一致

  3. 配置 cpu 类型 ndk, abiFilters 'armeabi-v7a', 'arm64-v8a',去掉 x86, 参考文档

  4. 配置签名证书

    signingConfigs {
config {
keyAlias '__uni__2a4f113'
keyPassword '你的密码'
storeFile file('key.keystore')
storePassword '你的密码'
v1SigningEnabled true
v2SigningEnabled true
}
}

keyAlias 别名、keyPassword 密码

storeFile file('key.keystore')表示证书地址,在创建证书时会有一个 keystore 后缀的文件或者 jks 后缀的文件,将它放在和 build.gra 同级的目录

配置 AndroidManifest.xml

  1. 在文件开头配置 package 名称,改为应用标识
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
package="uni.UNI2A4F113"></manifest>
  1. 配置 android 权限

类似<uses-permission android:name="android.permission.CAMERA" />这种权限配置,可以在 HBuilderX 的 manifes.json 中的 App 权限配置找到

  1. 模块配置

文档地址

地图、消息推送等相关模块都可配置,按照文档引入工程需要的 jar/aar 文件,并在 application 节点下配置相关代码

  1. 添加 provider 信息
<provider
android:name="io.dcloud.common.util.DCloud_FileProvider"
android:authorities="uni.UNI2A4F113.dc.fileprovider"
android:exported="false"
android:grantUriPermissions="true"
>
<meta-data android:name="android.support.FILE_PROVIDER_PATHS" android:resource="@xml/dcloud_file_provider" />
</provider>

注意当前应用的包名uni.UNI2A4F113

  1. 配置 Appkey
<meta-data android:name="dcloud_appkey" android:value="你申请的key" />

打包

配置完成后,点击打包图标,等待打包,然后会生成一个 apk 文件,安装到手机里即可