提交 528d5966 编写于 作者: 杜庆泉's avatar 杜庆泉

增加Hello UTS component示例界面和插件

上级 26d3a795
......@@ -35,6 +35,14 @@
}
},
{
"path" : "pages/component/component",
"style" :
{
"navigationBarTitleText": "",
"enablePullDownRefresh": false
}
},
{
"path" : "pages/SDKIntegration/SDKIntegration",
"style" :
......
......@@ -5,7 +5,6 @@
<uni-collapse accordion>
<uni-collapse-item title="延迟任务" :border="false">
<uni-list>
<uni-list-item @tap="testTimer" title="开启延迟任务" :clickable="true">
</uni-list-item>
......@@ -33,6 +32,15 @@
</uni-list-item>
</uni-list>
</uni-collapse-item>
<uni-collapse-item title="组件开发示例" :border="false">
<uni-list>
<uni-list-item @tap="testHelloUTSComponent" title="Hello UTS Component" :clickable="true" link />
</uni-list>
</uni-collapse-item>
<uni-collapse-item title="android平台示例" :border="false">
<uni-list>
......@@ -162,6 +170,11 @@
url: '/pages/lifecycle/lifecycle'
})
},
testHelloUTSComponent: function() {
uni.navigateTo({
url: '/pages/component/component'
})
},
testSyntax: function() {
uni.navigateTo({
url: '/pages/SyntaxCase/index'
......
<template>
<div>
<text>UTS view组件</text>
<uts-hello-view buttonText="点击按钮内容" style="width:375px;height: 375px;background-color: aqua;"></uts-hello-view>
<!-- <text>UTS 布局组件</text>
<uts-hello-container buttonText="点击按钮内容" style="width:375px;height: 375px;background-color: bisque;">
<text solt="header">头部信息</text>
<text solt="footer">底部信息</text>
</uts-hello-container> -->
</div>
</template>
<script>
</script>
<style>
</style>
\ No newline at end of file
{
"id": "uts-hello-component",
"displayName": "uts-hello-component",
"version": "1.0.0",
"description": "uts-hello-component",
"keywords": [
"uts-hello-component"
],
"repository": "",
"engines": {
"HBuilderX": "^3.6.8"
},
"dcloudext": {
"type": "uts",
"sale": {
"regular": {
"price": "0.00"
},
"sourcecode": {
"price": "0.00"
}
},
"contact": {
"qq": ""
},
"declaration": {
"ads": "",
"data": "",
"permissions": ""
},
"npmurl": ""
},
"uni_modules": {
"dependencies": [],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "u",
"aliyun": "u"
},
"client": {
"Vue": {
"vue2": "u",
"vue3": "u"
},
"App": {
"app-android": "u",
"app-ios": "u"
},
"H5-mobile": {
"Safari": "u",
"Android Browser": "u",
"微信浏览器(Android)": "u",
"QQ浏览器(Android)": "u"
},
"H5-pc": {
"Chrome": "u",
"IE": "u",
"Edge": "u",
"Firefox": "u",
"Safari": "u"
},
"小程序": {
"微信": "u",
"阿里": "u",
"百度": "u",
"字节跳动": "u",
"QQ": "u",
"钉钉": "u",
"快手": "u",
"飞书": "u",
"京东": "u"
},
"快应用": {
"华为": "u",
"联盟": "u"
}
}
}
}
}
\ No newline at end of file
# uts-hello-component
### 开发文档
[UTS 语法](https://uniapp.dcloud.net.cn/tutorial/syntax-uts.html)
[UTS 原生插件](https://uniapp.dcloud.net.cn/plugin/uts-plugin.html)
[Hello UTS](https://gitcode.net/dcloud/hello-uts/-/tree/dev)
\ No newline at end of file
<template>
<view class="defaultStyles">
<solt name="header"></solt>
<solt name="footer"></solt>
</view>
</template>
<script lang="uts">
import TextUtils from 'android.text.TextUtils'
import Button from 'android.widget.Button'
import LinearLayout from 'android.widget.LinearLayout'
import Color from 'android.graphics.Color'
import View from 'android.view.View'
//原生提供以下属性或方法的实现
export default {
name: "uts-hello-container",
/**
* 当播放到末尾时触发 ended 事件(自然播放结束会触发回调,循环播放结束及手动停止动画不会触发)
*/
emits: ['buttonClick'],
props: {
"buttonText": {
type: String,
default: "点击触发"
}
},
data() {
return {
}
},
watch: {
"buttonText": {
handler(newButtonText: string) {
if(this.$el != null){
let button = this.$el!.findViewWithTag("centerButton") as Button
if (!TextUtils.isEmpty(newButtonText)) {
button.setText(newButtonText)
}
}
},
immediate: false //创建时是否通过此方法更新属性,默认值为false
},
},
expose: ['publicMethod'],
methods: {
/**
* 对外公开的组件方法
*/
doSth(paramA: string) {
// 这是组件的自定义方法
console.log("paramA")
},
/**
* 内部使用的组件方法
*/
privateMethod() {
}
},
created() { //创建组件,替换created
},
NVBeforeLoad() { //组件将要创建,对应前端beforeMount
//可选实现,这里可以提前做一些操作
},
NVLoad(): LinearLayout { //创建原生View,必须定义返回值类型(Android需要明确知道View类型,需特殊校验)
//必须实现
let contentLayout = new LinearLayout($androidContext)
return contentLayout
},
NVLoaded() { //原生View已创建
//可选实现,这里可以做后续操作
},
NVLayouted() { //原生View布局完成
//可选实现,这里可以做布局后续操作
},
NVBeforeUnload() { //原生View将释放
//可选实现,这里可以做释放View之前的操作
},
NVUnloaded() { //原生View已释放
//可选实现,这里可以做释放View之后的操作
},
unmounted() { //组件销毁
//可选实现
}
}
</script>
<style>
/* 定义默认样式值, 组件使用者没有配置时使用 */
.defaultStyles {
width: 750rpx;
height: 240rpx;
background-color: gainsboro;
}
</style>
<template>
<view class="defaultStyles">
</view>
</template>
<script lang="uts">
import TextUtils from 'android.text.TextUtils'
import Button from 'android.widget.Button'
import LinearLayout from 'android.widget.LinearLayout'
import Color from 'android.graphics.Color'
import View from 'android.view.View'
class ButtonClickListsner extends View.OnClickListener {
constructor() {}
override onClick(v ? : View) {
console.log(v)
}
}
//原生提供以下属性或方法的实现
export default {
/**
* 组件名称,也就是开发者使用的标签
*/
name: "uts-hello-view",
/**
* 组件涉及的事件声明,只有声明过的事件,才能被正常发送
*/
emits: ['buttonClick'],
/**
* 属性声明,组件的使用者会传递这些属性值到组件
*/
props: {
/**
* 字符串类型 属性:buttonText 需要设置默认值
*/
"buttonText": {
type: String,
default: "点击触发"
}
},
/**
* 组件内部变量声明
*/
data() {
return {}
},
/**
* 属性变化监听器实现
*/
watch: {
"buttonText": {
/**
* 这里监听属性变化,并进行组件内部更新
*/
handler(newButtonText: string) {
if (this.$el != null) {
let button = this.$el!.findViewWithTag("centerButton") as Button
if (!TextUtils.isEmpty(newButtonText)) {
button.setText(newButtonText)
}
}
},
immediate: false //创建时是否通过此方法更新属性,默认值为false
},
},
/**
* 规则:如果没有配置expose,则methods中的方法均对外暴露,如果配置了expose,则以expose的配置为准向外暴露
* ['publicMethod'] 含义为:只有 `publicMethod` 在实例上可用
*/
expose: ['doSth'],
methods: {
/**
* 对外公开的组件方法
*/
doSth(paramA: string) {
// 这是组件的自定义方法
console.log("paramA")
},
/**
* 内部使用的组件方法
*/
privateMethod() {
}
},
/**
* 组件被创建,组件第一个生命周期,
* 在内存中被占用的时候被调用,开发者可以在这里执行一些需要提前执行的初始化逻辑
* [可选实现]
*/
created() {
},
/**
* 对应平台的view载体即将被创建,对应前端beforeMount
* [可选实现]
*/
NVBeforeLoad() {
},
/**
* 创建原生View,必须定义返回值类型
* 开发者需要重点实现这个函数,声明原生组件被创建出来的过程,以及最终生成的原生组件类型
* (Android需要明确知道View类型,需特殊校验)
* todo 补充IOS平台限制
* [必须实现]
*/
NVLoad(): LinearLayout {
//必须实现
let contentLayout = new LinearLayout($androidContext)
let button = new Button($androidContext)
button.setText("点击触发");
button.setTag("centerButton");
contentLayout.addView(button, LinearLayout.LayoutParams(500, 500));
button.setOnClickListener(new ButtonClickListsner())
return contentLayout
},
/**
* 原生View已创建
* [可选实现]
*/
NVLoaded() {
},
/**
* 原生View布局完成
* [可选实现]
*/
NVLayouted() {
},
/**
* 原生View将释放
* [可选实现]
*/
NVBeforeUnload() {},
/**
* 原生View已释放,这里可以做释放View之后的操作
* [可选实现]
*/
NVUnloaded() {
},
/**
* 组件销毁
* [可选实现]
*/
unmounted() {}
// /**
// * 自定组件布局尺寸
// * [可选实现]
// */
// doMeasure(size: UTSSize): UTSSize {
// size.width = 120.0.toFloat()
// size.height = 800.0.toFloat()
// return size
// }
}
</script>
<style>
/* 定义默认样式值, 组件使用者没有配置时使用 */
.defaultStyles {
width: 750rpx;
height: 240rpx;
background-color: blue;
}
</style>
......@@ -76,17 +76,14 @@ class UIRunnable extends Runnable {
appWidgetId: Int
) {
let widgetText = "当前股票价格为:0.0元"
setTimeout(function(){
// 模拟请求网络,这里需要替换成真正的网络请求
Thread.sleep(1000)
widgetText = "当前股票价格为:13.25元"
let widgetText = "当前股票价格为:13.25元"
let uiRunnable = new UIRunnable(context,appWidgetManager,appWidgetId,widgetText)
// 更新UI
UTSAndroid.getUniActivity()!.runOnUiThread(uiRunnable)
},500);
}
\ No newline at end of file
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册