Plus SDK

对标html5plus，持续更新...

平台兼容性

Android	iOS	web	鸿蒙 Next	小程序
√	√	√	x	x

Api

事件名	参数	说明
setGray	gray	全局置灰，实现哀悼模式
hideKeyboard	-	隐藏键盘
openURL	UxOpenURLOptions	打开链接
makePhoneCall	UxMakePhoneCallOptions	拨打电话
vibrate	UxVibrateOptions	震动
shareWithSystem	UxShareWithSystemOptions	系统分享
createNotificationProgress	UxCreateNotificationProgressOptions	创建显示进度的通知栏消息
cancelNotificationProgress	-	取消显示进度的通知栏消息
finishNotificationProgress	UxFinishNotificationProgressOptions	完成显示进度的通知栏消息
setRequestPermissionTips	UTSJSONObject	设置权限提示说明
requestPermissions	UxRequestPermissionsOptions	申请权限
openAppAuthorizeSetting	UxOpenAppAuthorizeSettingOptions	打开app权限设置

示例代码

scripthtmlstyle

<script setup>
import * as plus from "@/uni_modules/ux-plus"

let title = ''

onLoad((e: OnLoadOptions) => {
    title = e['title'] ?? ''
})

function setGray(gray: number) {
    plus.setGray(gray)
}

function openURL() {
    let brand = uni.getSystemInfoSync().deviceBrand
    let pkgName = 'com.tencent.mm'
    let market = ''

    // #ifndef APP-IOS
    if (brand == 'huawei') {
        market = `market://details?id=${pkgName}`
    } else if (brand == 'xiaomi') {
        market = `mimarket://details?id=${pkgName}`
    } else if (brand == 'oppo') {
        market = `oppomarket://details?packagename=${pkgName}`
    } else if (brand == 'vivo') {
        market = `vivomarket://details?id=${pkgName}`
    } else if (brand == 'samsung') {
        market = `samsungapps://ProductDetail/${pkgName}`
    }
    // #endif

    // #ifdef APP-IOS
    market = `itms-apps://itunes.apple.com/app?id=${pkgName}`
    // #endif

    plus.openURL({
        url: market
    } as plus.UxOpenURLOptions)
}

function makePhoneCall() {
    plus.makePhoneCall({
        phoneNumber: '18666888866'
    } as plus.UxMakePhoneCallOptions)
}

function vibrate1() {
    plus.vibrate({
        type: 'light'
    } as plus.UxVibrateOptions)
}

function vibrate2() {
    plus.vibrate({
        type: 'medium'
    } as plus.UxVibrateOptions)
}

function vibrate3() {
    plus.vibrate({
        type: 'heavy'
    } as plus.UxVibrateOptions)
}

function shareText() {
    plus.shareWithSystem({
        type: 'text',
        title: 'UxFrame低代码高性能UI框架',
        summary: 'UxFrame是基于UNI-APP-X开发的低代码高性能原生UI框架',
        href: 'https://www.uxframe.cn',
        imageUrl: '/static/logo.png'
    } as plus.UxShareWithSystemOptions)
}

function shareImage() {
    plus.shareWithSystem({
        type: 'image',
        imageUrl: '/static/logo.png'
    } as plus.UxShareWithSystemOptions)
}

function shareFile() {
    plus.shareWithSystem({
        type: 'file',
        href: '/static/demo.pdf'
    } as plus.UxShareWithSystemOptions)
}

function setRequestPermissionTips() {
    let permissons = [{
        permission: 'location', // 可能有多个权限包装在一起，统一这个说明
        // permission: 'android.permission.CAMERA', // 单个权限说明
        content: "<h4 style=\"font-size:40px;\">获取位置权限说明</h4><font color=#cccccc>我们需要您的位置信息来提供更好的服务</font>"
    },{
        permission: 'push',
        content: "<h4 style=\"font-size:40px;\">系统通知权限说明</h4><font color=#cccccc>我们需要推送通知来发送重要更新和提醒</font>"
    },{
        permission: 'camera',
        content: "<h4 style=\"font-size:40px;\">拍照/拍摄/存储空间权限说明</h4><font color=#cccccc>我们需要访问您的摄像机来拍摄照片/视频</font>"
    },{
        permission: 'photo',
        content: "<h4 style=\"font-size:40px;\">获取照片/视频/存储空间权限说明</h4><font color=#cccccc>我们需要访问您的相册来保存或选择照片</font>"
    },{
        permission: 'microphone',
        content: "<h4 style=\"font-size:40px;\">获取麦克风权限说明</h4><font color=#cccccc>我们需要访问您的麦克风来录音</font>"
    },{
        permission: 'bluetooth',
        content: "<h4 style=\"font-size:40px;\">获取蓝牙权限说明</h4><font color=#cccccc>我们需要您的同意来使用蓝牙来提供更好的服务</font>"
    },{
        permission: 'calendar',
        content: "<h4 style=\"font-size:40px;\">获取日历权限说明</h4><font color=#cccccc>我们需要访问您的日历来提供更好的服务</font>"
    },{
        permission: 'contact',
        content: "<h4 style=\"font-size:40px;\">获取通讯录权限说明</h4><font color=#cccccc>我们需要您的同意来访问联系人来提供更好的服务</font>"
    },{
        permission: 'sms',
        content: "<h4 style=\"font-size:40px;\">获取短信权限说明</h4><font color=#cccccc>我们需要访问短信来提供更好的服务</font>"
    },{
        permission: 'phone',
        content: "<h4 style=\"font-size:40px;\">拨打/管理电话权限说明</h4><font color=#cccccc>我们需要访问电话来提供更好的服务</font>"
    },{
        permission: 'phone_state',
        content: "<h4 style=\"font-size:40px;\">获取设备信息权限说明</h4><font color=#cccccc>我们需要获取设备信息来提供更好的服务</font>"
    }] as plus.UxRequestPermissionTipsOptions[]

    plus.setRequestPermissionTips(permissons)
}

function requestPermissions() {
    plus.requestPermissions({
        name: 'camera', // 内部封装权限包，可能包含多个权限
        // permissions: permissons.map((e): string => e.permission), // 更细致的权限列表
        complete: (allRight: boolean, permissions : string[], doNotAskAgain: boolean) => {
            console.log(allRight, permissions);
            uni.showToast({
                title: allRight ? '已授权' : '已拒绝'
            })
        }
    } as plus.UxRequestPermissionsOptions)
}

function openAppAuthorizeSetting() {
    plus.openAppAuthorizeSetting('settings')
}

</script>

<script setup>
import * as plus from "@/uni_modules/ux-plus"

let title = ''

onLoad((e: OnLoadOptions) => {
    title = e['title'] ?? ''
})

function setGray(gray: number) {
    plus.setGray(gray)
}

function openURL() {
    let brand = uni.getSystemInfoSync().deviceBrand
    let pkgName = 'com.tencent.mm'
    let market = ''

    // #ifndef APP-IOS
    if (brand == 'huawei') {
        market = `market://details?id=${pkgName}`
    } else if (brand == 'xiaomi') {
        market = `mimarket://details?id=${pkgName}`
    } else if (brand == 'oppo') {
        market = `oppomarket://details?packagename=${pkgName}`
    } else if (brand == 'vivo') {
        market = `vivomarket://details?id=${pkgName}`
    } else if (brand == 'samsung') {
        market = `samsungapps://ProductDetail/${pkgName}`
    }
    // #endif

    // #ifdef APP-IOS
    market = `itms-apps://itunes.apple.com/app?id=${pkgName}`
    // #endif

    plus.openURL({
        url: market
    } as plus.UxOpenURLOptions)
}

function makePhoneCall() {
    plus.makePhoneCall({
        phoneNumber: '18666888866'
    } as plus.UxMakePhoneCallOptions)
}

function vibrate1() {
    plus.vibrate({
        type: 'light'
    } as plus.UxVibrateOptions)
}

function vibrate2() {
    plus.vibrate({
        type: 'medium'
    } as plus.UxVibrateOptions)
}

function vibrate3() {
    plus.vibrate({
        type: 'heavy'
    } as plus.UxVibrateOptions)
}

function shareText() {
    plus.shareWithSystem({
        type: 'text',
        title: 'UxFrame低代码高性能UI框架',
        summary: 'UxFrame是基于UNI-APP-X开发的低代码高性能原生UI框架',
        href: 'https://www.uxframe.cn',
        imageUrl: '/static/logo.png'
    } as plus.UxShareWithSystemOptions)
}

function shareImage() {
    plus.shareWithSystem({
        type: 'image',
        imageUrl: '/static/logo.png'
    } as plus.UxShareWithSystemOptions)
}

function shareFile() {
    plus.shareWithSystem({
        type: 'file',
        href: '/static/demo.pdf'
    } as plus.UxShareWithSystemOptions)
}

function setRequestPermissionTips() {
    let permissons = [{
        permission: 'location', // 可能有多个权限包装在一起，统一这个说明
        // permission: 'android.permission.CAMERA', // 单个权限说明
        content: "<h4 style=\"font-size:40px;\">获取位置权限说明</h4><font color=#cccccc>我们需要您的位置信息来提供更好的服务</font>"
    },{
        permission: 'push',
        content: "<h4 style=\"font-size:40px;\">系统通知权限说明</h4><font color=#cccccc>我们需要推送通知来发送重要更新和提醒</font>"
    },{
        permission: 'camera',
        content: "<h4 style=\"font-size:40px;\">拍照/拍摄/存储空间权限说明</h4><font color=#cccccc>我们需要访问您的摄像机来拍摄照片/视频</font>"
    },{
        permission: 'photo',
        content: "<h4 style=\"font-size:40px;\">获取照片/视频/存储空间权限说明</h4><font color=#cccccc>我们需要访问您的相册来保存或选择照片</font>"
    },{
        permission: 'microphone',
        content: "<h4 style=\"font-size:40px;\">获取麦克风权限说明</h4><font color=#cccccc>我们需要访问您的麦克风来录音</font>"
    },{
        permission: 'bluetooth',
        content: "<h4 style=\"font-size:40px;\">获取蓝牙权限说明</h4><font color=#cccccc>我们需要您的同意来使用蓝牙来提供更好的服务</font>"
    },{
        permission: 'calendar',
        content: "<h4 style=\"font-size:40px;\">获取日历权限说明</h4><font color=#cccccc>我们需要访问您的日历来提供更好的服务</font>"
    },{
        permission: 'contact',
        content: "<h4 style=\"font-size:40px;\">获取通讯录权限说明</h4><font color=#cccccc>我们需要您的同意来访问联系人来提供更好的服务</font>"
    },{
        permission: 'sms',
        content: "<h4 style=\"font-size:40px;\">获取短信权限说明</h4><font color=#cccccc>我们需要访问短信来提供更好的服务</font>"
    },{
        permission: 'phone',
        content: "<h4 style=\"font-size:40px;\">拨打/管理电话权限说明</h4><font color=#cccccc>我们需要访问电话来提供更好的服务</font>"
    },{
        permission: 'phone_state',
        content: "<h4 style=\"font-size:40px;\">获取设备信息权限说明</h4><font color=#cccccc>我们需要获取设备信息来提供更好的服务</font>"
    }] as plus.UxRequestPermissionTipsOptions[]

    plus.setRequestPermissionTips(permissons)
}

function requestPermissions() {
    plus.requestPermissions({
        name: 'camera', // 内部封装权限包，可能包含多个权限
        // permissions: permissons.map((e): string => e.permission), // 更细致的权限列表
        complete: (allRight: boolean, permissions : string[], doNotAskAgain: boolean) => {
            console.log(allRight, permissions);
            uni.showToast({
                title: allRight ? '已授权' : '已拒绝'
            })
        }
    } as plus.UxRequestPermissionsOptions)
}

function openAppAuthorizeSetting() {
    plus.openAppAuthorizeSetting('settings')
}

</script>

html

<template>
    <ux-page>
        <ux-navbar :title="title" :border="false"></ux-navbar>

        <ux-scroll>
            <ux-card direction="column" icon="flag-filled" title="Plus SDK" :bold="true">
                <ux-text text="对标html5plus，持续更新..."></ux-text>
                <ux-row :flex="true" align="top" :mt="5" style="width: 100%;">
                    <ux-text text="详细文档："></ux-text>
                    <ux-text style="flex: 1" name="Plus SDK" text="https://www.uxframe.cn/plugin/plus.html" path="/pages/webview/webview" mode="link"</ux-text>
                </ux-row>
            </ux-card>

            <ux-card direction="column" icon="arrowright" title="置灰" :bold="true">
                <ux-col>
                    <ux-button text="置灰" @click="setGray(1)"></ux-button>
                    <ux-button text="还原" :mt="10" @click="setGray(0)"></ux-button>
                </ux-col>
            </ux-card>

            <ux-card direction="column" icon="arrowright" title="打开链接" :bold="true">
                <ux-col>
                    <ux-button text="跳转应用市场" @click="openURL()"></ux-button>
                </ux-col>
            </ux-card>

            <ux-card direction="column" icon="arrowright" title="拨打电话" :bold="true">
                <ux-col>
                    <ux-button text="18888888888" @click="makePhoneCall()"></ux-button>
                </ux-col>
            </ux-card>

            <ux-card direction="column" icon="arrowright" title="震动" :bold="true">
                <ux-col>
                    <ux-button text="轻震动" @click="vibrate1()"></ux-button>
                    <ux-button text="震动" :mt="10" @click="vibrate2()"></ux-button>
                    <ux-button text="重震动" :mt="10" @click="vibrate3()"></ux-button>
                </ux-col>
            </ux-card>

            <!-- #ifdef APP -->
            <ux-card direction="column" icon="arrowright" title="系统分享" :bold="true">
                <ux-col>
                    <ux-button text="图文" @click="shareText()"></ux-button>
                    <ux-button text="图片" :mt="10" @click="shareImage()"></ux-button>
                    <!-- #ifdef APP-IOS -->
                    <ux-button text="文件" :mt="10" @click="shareFile()"></ux-button>
                    <!-- #endif -->
                </ux-col>
            </ux-card>
            <!-- #endif -->

            <!-- #ifdef APP -->
            <ux-card direction="column" icon="arrowright" title="申请权限" :bold="true">
                <ux-col>
                    <ux-button text="设置权限申请提示说明" @click="setRequestPermissionTips()"></ux-button>
                    <ux-button text="申请权限" :mt="10" @click="requestPermissions()"></ux-button>
                    <ux-button text="打开app权限设置" :mt="10" @click="openAppAuthorizeSetting()"></ux-button>
                </ux-col>
            </ux-card>
            <!-- #endif -->

            <ux-placeholder :height="200">
                <ux-row justify="center" align="center" style="height: 100%;">
                    <ux-text prefix-icon="soapbubble-filled" text="真的没有了~"></ux-text>
                </ux-row>
            </ux-placeholder>
        </ux-scroll>

    </ux-page>
</template>

<template>
    <ux-page>
        <ux-navbar :title="title" :border="false"></ux-navbar>

        <ux-scroll>
            <ux-card direction="column" icon="flag-filled" title="Plus SDK" :bold="true">
                <ux-text text="对标html5plus，持续更新..."></ux-text>
                <ux-row :flex="true" align="top" :mt="5" style="width: 100%;">
                    <ux-text text="详细文档："></ux-text>
                    <ux-text style="flex: 1" name="Plus SDK" text="https://www.uxframe.cn/plugin/plus.html" path="/pages/webview/webview" mode="link"</ux-text>
                </ux-row>
            </ux-card>

            <ux-card direction="column" icon="arrowright" title="置灰" :bold="true">
                <ux-col>
                    <ux-button text="置灰" @click="setGray(1)"></ux-button>
                    <ux-button text="还原" :mt="10" @click="setGray(0)"></ux-button>
                </ux-col>
            </ux-card>

            <ux-card direction="column" icon="arrowright" title="打开链接" :bold="true">
                <ux-col>
                    <ux-button text="跳转应用市场" @click="openURL()"></ux-button>
                </ux-col>
            </ux-card>

            <ux-card direction="column" icon="arrowright" title="拨打电话" :bold="true">
                <ux-col>
                    <ux-button text="18888888888" @click="makePhoneCall()"></ux-button>
                </ux-col>
            </ux-card>

            <ux-card direction="column" icon="arrowright" title="震动" :bold="true">
                <ux-col>
                    <ux-button text="轻震动" @click="vibrate1()"></ux-button>
                    <ux-button text="震动" :mt="10" @click="vibrate2()"></ux-button>
                    <ux-button text="重震动" :mt="10" @click="vibrate3()"></ux-button>
                </ux-col>
            </ux-card>

            <!-- #ifdef APP -->
            <ux-card direction="column" icon="arrowright" title="系统分享" :bold="true">
                <ux-col>
                    <ux-button text="图文" @click="shareText()"></ux-button>
                    <ux-button text="图片" :mt="10" @click="shareImage()"></ux-button>
                    <!-- #ifdef APP-IOS -->
                    <ux-button text="文件" :mt="10" @click="shareFile()"></ux-button>
                    <!-- #endif -->
                </ux-col>
            </ux-card>
            <!-- #endif -->

            <!-- #ifdef APP -->
            <ux-card direction="column" icon="arrowright" title="申请权限" :bold="true">
                <ux-col>
                    <ux-button text="设置权限申请提示说明" @click="setRequestPermissionTips()"></ux-button>
                    <ux-button text="申请权限" :mt="10" @click="requestPermissions()"></ux-button>
                    <ux-button text="打开app权限设置" :mt="10" @click="openAppAuthorizeSetting()"></ux-button>
                </ux-col>
            </ux-card>
            <!-- #endif -->

            <ux-placeholder :height="200">
                <ux-row justify="center" align="center" style="height: 100%;">
                    <ux-text prefix-icon="soapbubble-filled" text="真的没有了~"></ux-text>
                </ux-row>
            </ux-placeholder>
        </ux-scroll>

    </ux-page>
</template>

css

<style lang="scss">
	
</style>

<style lang="scss">
	
</style>

Plus SDK ​

平台兼容性 ​

Api ​

示例代码 ​

Plus SDK

平台兼容性

Api

示例代码