【每日学点HarmonyOS Next知识】ets匿名类、获取控件坐标、Web显示iframe标签、软键盘导致上移、改变Text的背景色

114 阅读3分钟

1、HarmonyOS ets不支持匿名类吗?

不支持,需要显式标注对象字面量的类型,可以参考以下文档:developer.huawei.com/consumer/cn…

需要显式标注对象字面量的类型 **规则:**arkts-no-untyped-obj-literals 级别:错误

在ArkTS中,需要显式标注对象字面量的类型,否则,将发生编译时错误。在某些场景下,编译器可以根据上下文推断出字面量的类型。 在以下上下文中不支持使用字面量初始化类和接口:

  • 初始化具有any、Object或object类型的任何对象
  • 初始化带有方法的类或接口
  • 初始化包含自定义含参数的构造函数的类
  • 初始化带readonly字段的类

建议使用嵌套类实现(类内部嵌套匿名类)。因为使用匿名类创建的对象类型未知,这与ArkTS不支持structural typing和对象字面量的类型冲突,可以参考以下方案

export interface IVoiceRecordListener<T> {
  onSuccess:(t: T)=> void
  onFailed:(code: string, reason: string)=> void
}

let voiceRecordListenerInstance: IVoiceRecordListener<void> = {
  onSuccess: () => {
    console.log('success')
  },
  onFailed: () => {
    console.log('failed')
  }
}

2、HarmonyOS 获取控件坐标?

业务开发中往往需要在某个控件渲染完之后根据当前控件的位置canvas绘制相应图形,请问需要怎么获取坐标呢?

componentUtils.getRectangleById 可以获取根据组件ID获取组件实例对象, 通过组件实例对象将获取的坐标位置和大小同步返回参考文档:developer.huawei.com/consumer/cn…

componentUtils.getRectangleById getRectangleById(id: string): ComponentInfo

根据组件ID获取组件实例对象, 通过组件实例对象将获取的坐标位置和大小同步返回给开发者。

3、HarmonyOS 使用webview加载H5页面时,页面内容包含iframe标签,无法正常显示?

包含这样一段标签 :<iframe src='[https://media.w3.org/2010/05/...](https://link.segmentfault.com/?enc=VG0pIZ2DYxAsfv21K5dq2w%3D%3D.MAmkKu9OfP%2FA6wTIM30bxp8UOf4jEyAeTTF8hjO5CAms%2FiZHPg3m7d2nv5hvqKwl)' ><iframe>

参考下面代码:

// xxx.ets
import web_webview from '@ohos.web.webview';

@Entry
@Component
struct WebComponent {
  controller: web_webview.WebviewController = new web_webview.WebviewController();

  build() {
    Column() {
      Web({ src: $rawfile("index.html"), controller: this.controller })
        .fileAccess(true)
        .domStorageAccess(true)
    }
  }
}

<!-- index.html -->
<!DOCTYPE html>
<html>
<body>
<p>Hello World</p>
<div>这底下是一个iframe</div>
<iframe src='https://media.w3.org/2010/05/sintel/trailer.mp4'></iframe>
</body>
</html>

4、HarmonyOS textInput组件获取焦点,软键盘弹出,整个界面会整体上移问题?

textInput组件获取焦点,软键盘弹出,整个界面会整体上移问题

设置压缩模式即可,参考文档链接:developer.huawei.com/consumer/cn… 安全区域是指页面的显示区域,默认不与系统设置的非安全区域比如状态栏、导航栏区域重叠,默认情况下开发者开发的界面都被布局在安全区域内。提供属性方法允许开发者设置组件绘制内容突破安全区域的限制,通过expandSafeArea属性支持组件不改变布局情况下扩展其绘制区域至安全区外,通过设置setKeyboardAvoidMode来配置虚拟键盘弹出时页面的避让模式。页面中有标题栏等文字不希望和非安全区重叠时,建议对组件设置expandSafeArea属性达到沉浸式效果,也可以直接通过窗口接口setWindowLayoutFullScreen设置沉浸式。

5、HarmonyOS 2个TextInput控件,当TextInput输入都有值时,改变Text的背景色?

参考代码:

@Entry
@Component
struct TextInputDemo {
  @State message: string = 'Hello World';
  @State text1: string = ''
  @State text2: string = ''
  @State changeColoor : boolean=false
  controller: TextInputController = new TextInputController()

  build() {
    Column(){
      Text(this.message)
        .id('HelloWorld')
        .fontSize(50)
        .fontWeight(FontWeight.Bold)
        .alignRules({
          center: { anchor: '__container__', align: VerticalAlign.Center },
          middle: { anchor: '__container__', align: HorizontalAlign.Center }
        })
        .backgroundColor(this.changeColoor ? Color.Red: '')
      TextInput({ text: this.text1, placeholder: 'input your word1...', controller: this.controller })
        .width('95%')
        .height(40)
        .margin(20)
        .onChange((value: string)=>{
          this.text1 = value
          if(this.text2 && this.text1){
            this.changeColoor = true
          }else{
            this.changeColoor = false
          }

        })
      TextInput({ text: this.text2, placeholder: 'input your word2...', controller: this.controller })
        .width('95%')
        .height(40)
        .margin(20)
        .onChange((value: string)=>{
          this.text2 = value
          if(this.text1 && this.text2){
            this.changeColoor = true
          }else {
            this.changeColoor = false
          }
        })
    }
    .height('100%')
    .width('100%')
  }
}