写点什么

【每日学点 HarmonyOS Next 知识】tabs 切换卡顿、输入框焦点、打开全新 web、输入框密码类型、非法变量值

作者:轻口味
  • 2025-03-10
    北京
  • 本文字数:2317 字

    阅读完需:约 8 分钟

【每日学点HarmonyOS Next知识】tabs切换卡顿、输入框焦点、打开全新web、输入框密码类型、非法变量值

1、HarmonyOS Tabs 控件切换卡顿?

Tabs 控件切换时的动画效果有一种卡顿的感觉,请问这个卡顿效果是否有修复的方案?


根因在于 tab 的滑动切换是在完全切换结束后才会 onchange 触发,所以才会导致看起来滑动后才切换 tabbar。


建议参考如下的示例代码实现切换逻辑:https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/ts-container-tabs-V5#ZH-CN_TOPIC_0000001847050116__%E7%A4%BA%E4%BE%8B9

2、HarmonyOS 自定义键盘输入框焦点问题?

调用 controller.stopEditing()输入框失去焦点并且收起了键盘,但是跳转到其他页面返回到当前页面时,输入框自动获取焦点并且弹出了键盘,怎么样才能不自动获取焦点和弹出键盘?


可以加下关键性代码,类似于下面按钮上加下 .id(‘333’) 键,然后 focusControl.requestFocus(‘333’) 转移焦点测试下,代码示例可参考:


import router from '@ohos.router';@Entry@Componentstruct KeyboadPage2 {
controller: TextInputController = new TextInputController() @State inputValue: string = "" @State InputBGColor: string = '#90EE90' build() { Column({ space: 10 }) { TextInput({ controller: this.controller, }) .id('111') .backgroundColor(this.InputBGColor) .margin(10) .border({ width: 1 }) .height('48vp') .onFocus(() => { this.InputBGColor = '#FF0000' }) .onBlur(() => { this.InputBGColor = '#90EE90' }) Button('收起键盘') .onClick(() => { setTimeout(() => { this.controller.stopEditing() }, 0) }).id('333') Button('push') .onClick(() => { focusControl.requestFocus('333') router.pushUrl({ url: 'pages/Keyboad/KeyboadPage3', }) }) } .height('100%') .width('100%') }}
复制代码

3、HarmonyOS 如何实现给定一个 url,打开一个全新的 webview 页面?

可以参考 demo


// xxx.etsimport web_webview from '@ohos.web.webview';import business_error from '@ohos.base';
@Entry@Componentstruct WebComponent { controller: web_webview.WebviewController = new web_webview.WebviewController();
build() { Column() { Button('loadUrl') .onClick(() => { try { // 点击按钮时,通过loadUrl,跳转到local1.html this.controller.loadUrl($rawfile("local1.html")); } catch (error) { let e: business_error.BusinessError = error as business_error.BusinessError; console.error(`ErrorCode: ${e.code}, Message: ${e.message}`); } }) // 组件创建时,通过$rawfile加载本地文件local.html Web({ src: $rawfile("local.html"), controller: this.controller }) } }}
复制代码

4、HarmonyOS TextInput 密码类型?

在 TextInput 设置 InputType.Password 密码类型下,是否有 api 能让开发者控制密码是否可见,不是 PasswordIcon 这种形式,passwordIcon 目前只能设置图标,不支持设置大小


可以自定义设置控制密码是否可见的图标,参考如下 demo:


@Entry@Componentstruct TextInputExample {  @State text: string = ''  @State password: string = '';  @State positionInfo: CaretOffset = { index: 0, x: 0, y: 0 }  controller: TextInputController = new TextInputController()  @State isShowPassword:boolean = false;
build() { Column() { TextInput({ text: this.text, placeholder: 'input your word...', controller: this.controller }) .placeholderColor(Color.Grey) .placeholderFont({ size: 14, weight: 400 }) .caretColor(Color.Blue) .width('95%') .height(40) .margin(20) .fontSize(14) .fontColor(Color.Black) .inputFilter('[a-z]', (e) => { console.log(JSON.stringify(e)) }) .onChange((value: string) => { this.text = value }) // 密码输入框 Row(){ // if(this.isClick === true){ TextInput({text: $$this.password, placeholder: 'input your password...' }) .width('95%') .height(40) .margin(8) .type(this.isShowPassword ? InputType.Normal : InputType.Password) .maxLength(9) .showPasswordIcon(false) Image(this.isShowPassword ? $r('app.media.ic_personal_normal'): $r('app.media.ic_personal_focus')) .width('25vp') .height('25vp') .margin({right:'80vp',bottom:'50%'}) .position({x:'85%',y:15}) .onClick(()=>{ this.isShowPassword = !this.isShowPassword }) } .width('100%')
}.width('100%') }}
复制代码

5、HarmonyOS Illegal variable value error with decorated variable 'data'?

修改手机状态栏背景为黑色,字体为白色,该怎么处理?


export class GlobalContext {  private constructor() { }  private static instance: GlobalContext;  private _objects = new Map<string, Object>();
复制代码


发布于: 刚刚阅读数: 4
用户头像

轻口味

关注

🏆2021年InfoQ写作平台-签约作者 🏆 2017-10-17 加入

Android、音视频、AI相关领域从业者。 欢迎加我微信wodekouwei拉您进InfoQ音视频沟通群 邮箱:qingkouwei@gmail.com

评论

发布
暂无评论
【每日学点HarmonyOS Next知识】tabs切换卡顿、输入框焦点、打开全新web、输入框密码类型、非法变量值_HarmonyOS_轻口味_InfoQ写作社区