【每日学点鸿蒙知识】gbk2313传到native、NAPI打印日志问题、table表格控件、Web 触发新窗口卡住、修饰列表
1、HarmonyOS NAPI调用中,如果从ArkTS传入编码为gbk2313的字符串到Native层,该调用哪个方法?
如果需要从ArkTS传递编码为gbk2313的字符串到Native层,可以使用napi_get_value_string_utf8方法。这个方法允许 获取ArkTS侧传入的字符串到char数组的长度。
2、HarmonyOS NAPI日志不能打印,OH_LOG_INFO和printf都不行?
请参考下面代码
宏定义,可以自己替换
#define LOGI(format, args) OH_LOG_Print(LOG_APP, LOG_INFO, 0, "logI", format, args);
//调用宏 需要在打印参数前加public 数字用d 字符串用s
LOGI("调用宏======%{public}d==================",123);
3、HarmonyOS 有table表格控件吗?
目前没有表格组件,暂时只能使用web组件引入一个本地的html,在html中绘制一个表格。demo如下:
import web_webview from '@ohos.web.webview'
@Entry
@Component
struct TableHtml {
controller: web_webview.WebviewController = new web_webview.WebviewController();
build() {
Column() {
Button("点击此处,加载HTML富文本").onClick(() => {
this.controller.loadData(`<html> <head> <style> .table-font-size{ font-size:20px; } </style> </head> <body bgcolor=\"white\"> <table width="1000" border="5" height="1000"> <tr class="table-font-size"> <th>Month</th> <th>Month</th> </tr> <tr class="table-font-size"> <th>Month</th> <th>Month</th> </tr> <tr class="table-font-size"> <th>Month</th> <th>Month</th> </tr> <tr class="table-font-size"> <th>Month</th> <th>Month</th> </tr> </table> </body></html>`, "text/html", "UTF-8");
}) // 通过$rawfile加载本地资源文件。
Web({ src: 'www', controller: this.controller }).javaScriptAccess(true).domStorageAccess(true).fileAccess(true)
// .defaultFontSize(this.fontSize)
}
}
}
4、HarmonyOS Web 触发新窗口时卡住?
import webview from '@ohos.web.webview'
import router from '@ohos.router'
@Entry
@Component
struct WebDemo {
controller = new webview.WebviewController
getUrl(): string {
const params = router.getParams() as Record<string, string>
return params?.url ?? 'https://www.huawei.com/appview/question/56402307?appview=1'
}
build() {
Column() {
Web({
src: this.getUrl(),
controller: this.controller,
})
.height('100%')
.width('100%')
.multiWindowAccess(true)
.onWindowNew((e) => {
console.log('onWindowNew', e.targetUrl)
router.pushUrl({
url: 'pages/WebDemo',
params: {
url: e.targetUrl,
},
})
//关键代码
//将新窗口对应WebviewController返回给Web内核。
//如果不需要打开新窗口请调用event.handler.setWebController接口设置成null。
//若不调用event.handler.setWebController接口,会造成render进程阻塞。
e.handler.setWebController(null)
})
}
}
}
5、HarmonyOS 关于@State或@Link 修饰Array的应用?
现有一个数据Bean类型如下:
export class TagBean {
title: string = ""
id: string = ""
is_choose: boolean = false
}
用@State或@Link修饰该Bean的Array数组,如:@Link tagBeans: TagBean[]
目前发现一个问题,在List()中的ForEach(this.tagBeans)内写Text(),背景设置为:.backgroundColor($r(item.is_choose ? “颜色A” : “颜色B”))
在点击事件中使tagBeans[index].is\_choose=true
,无法实时更新UI状态
但如果使用额外的string对象去记录点击id,判断(this.chooseIds.indexOf(item.id) >= 0),就可以实现实时更新UI
@ObjectLink和@Observed类装饰器用于在涉及嵌套对象或数组的场景中进行双向数据同步:https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/arkts-observed-and-objectlink-V5
demo参考如下
import util from '@ohos.util';
@Observed
class TagBean {
key: string = util.generateRandomUUID(true);
name: string;
is_Choose: boolean;
constructor(name: string, is_choose: boolean) {
this.name = name;
this.is_Choose = is_choose;
}
}
@Component
struct ViewListItem {
@ObjectLink tagBean: TagBean;
build() {
ListItem() {
Text(this.tagBean.name)
.width('100%')
.height(100)
.fontSize(16)
.textAlign(TextAlign.Center)
.borderRadius(10)
.backgroundColor(this.tagBean.is_Choose ? Color.White : Color.Red)
}.onClick(() => {
this.tagBean.is_Choose = !this.tagBean.is_Choose
})
}
}
@Entry
@Component
struct ObservedDemo {
@State tagBeans: Array<TagBean> = [
new TagBean('小红1', false),
new TagBean('小红2', false),
new TagBean('小红3', false),
new TagBean('小红4', false),
new TagBean('小红5', false),
new TagBean('小红6', false),
new TagBean('小红7', false),
new TagBean('小红8', false),
new TagBean('小红9', false),
]
build() {
Column() {
List({ space: 20, initialIndex: 0 }) {
ForEach(this.tagBeans, (item: TagBean) => {
ViewListItem({ tagBean: item })
}, (item: TagBean) => item.key)
}
.listDirection(Axis.Vertical)
.friction(0.6)
.divider({
strokeWidth: 2,
color: 0xFFFFFF,
startMargin: 20,
endMargin: 20
})
.edgeEffect(EdgeEffect.Spring)
.width('90%')
}
.backgroundColor(Color.Black)
.width('100%')
.height('100%')
}
}