【每日学点鸿蒙知识】placement设置top、组件携带自定义参数、主动隐藏输入框、Web设置字体、对话框设置全屏宽

1、popup组件placement设置top没有生效?

可以用offset属性将popup往下边偏移一下 来规避

2、组件携带自定义参数的接口是哪个?

参考链接:https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/ts-universal-attributes-custom-property-V5#customproperty

customProperty

复制代码
customProperty(name: string, value: Optional<Object>)

设置组件的自定义属性。自定义组件不支持设置自定义属性。
卡片能力: 从API version 12开始,该接口支持在ArkTS卡片中使用。

3、HarmonyOS 如何主动隐藏输入弹框?

可以给外层容器添加个点击事件,在点击事件中调用controller.stopEditing()方法移除输入框焦点即可隐藏键盘

复制代码
@Entry
@Component
struct TextInputExample {
  controller: TextInputController = new TextInputController();

  build() {
    Column() {
      TextInput({ controller: this.controller }) }
    .width('100%') .height('100%')
    .onClick(()=>{ this.controller.stopEditing();
    })
  }
}
4、HarmonyOS webview字体大小设置?

使用defaultFontSize设置网页的默认字体大小,参考文档:https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/ts-basic-components-web-V5#ZH-CN_TOPIC_0000001930757269__defaultfontsize9

5、HarmonyOS promptAction.openCustomDialog 弹窗如何宽度设置全屏宽?

目前promptAction.openCustomDialog 设置width('100%'), 系统会默认所在窗口宽度 - 左右 16vp

width参考链接:https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/js-apis-promptaction-V5#ZH-CN_TOPIC_0000001884757698__customdialogoptions11<br>

demo:

复制代码
import promptAction from '@ohos.promptAction';
import display from '@ohos.display'

@Entry
@Component
struct Index {
  @State message: string = 'Hello World';

  build() {
    Button('点我').onClick(() => {
      DialogUtils.show(this)
    })
  }
}

@Component
export struct TestComponent {
  build() {
    Row() {
      Text('弹窗内组件1弹窗内组件2弹窗内组件3弹窗内组件4弹窗内组件5弹窗内组件')
        .height(200)
        .textAlign(TextAlign.Center)
    }
  }
}

export class DialogUtils {
  public static createOption(builder: CustomBuilder) {
    const option: promptAction.CustomDialogOptions = {
      builder: builder,
      isModal: true,
      alignment: DialogAlignment.Bottom,
      cornerRadius: 0,
      backgroundColor: Color.Red,
      width: "110%",
      autoCancel: false,
    }
    return option
  }

  public static show(context: Object,) {
    promptAction.openCustomDialog(DialogUtils.createOption(buildComp.bind(context)))
  }
}

@Builder
function buildComp() {
  TestComponent()
}
相关推荐
京东云开发者31 分钟前
全球首个!京东全栈开源JoyAI-VL-Interaction,让大模型从“一问一答”走向“边看边说”
前端
京东云开发者31 分钟前
正式上线!京东云AI智能渗透测试服务
前端
AprChell35 分钟前
低代码设计器和低代码设计引擎架构综述
前端·vue.js·低代码
Hilaku41 分钟前
Node.js 还能再战十年?给你一个不换引擎的理由
前端·javascript·程序员
颜进强1 小时前
AI性能参数-截断、延迟与流式输出
前端·后端·ai编程
spmcor1 小时前
React 架构师之路:Next.js 全栈革命(第八篇)
前端·react.js
英勇无比的消炎药1 小时前
TinyRobot 源码深度分析:OpenTiny 的 AI 对话组件库
前端·vue.js·github
假如让我当三天老蒯1 小时前
React基础、进阶(学习用)
前端·react.js·面试
风骏时光牛马1 小时前
HTML十大经典实战代码案例合集
前端
weedsfly1 小时前
前端必知必会:从 IIFE 到 ESM,模块化到底在解决什么?
前端·javascript