0
  • 聊天消息
  • 系统消息
  • 评论与回复
登录后你可以
  • 下载海量资料
  • 学习在线课程
  • 观看技术视频
  • 写文章/发帖/加入社区
会员中心
创作中心

完善资料让更多小伙伴认识你,还能领取20积分哦,立即完善>

3天内不再提示

鸿蒙语言基础类库:system.mediaquery 媒体查询

jf_46214456 来源:jf_46214456 作者:jf_46214456 2024-07-17 16:50 次阅读

媒体查询

说明:
开发前请熟悉鸿蒙开发指导文档 :[gitee.com/li-shizhen-skin/harmony-os/blob/master/README.md]

  • 从API Version 7 开始,该接口不再维护,推荐使用新接口[@ohos.mediaquery]。
  • 本模块首批接口从API version 3开始支持。后续版本的新增接口,采用上角标单独标记接口的起始版本。

导入模块

import mediaquery from '@system.mediaquery';

mediaquery.matchMedia

matchMedia(condition: string): MediaQueryList

根据媒体查询条件,创建MediaQueryList对象。

系统能力: SystemCapability.ArkUI.ArkUI.Full

参数

参数名类型必填说明
conditionstring用于查询的条件。

返回值:

参数类型说明
MediaQueryList表示创建MediaQueryList对象的属性,详情见下表 MediaQueryList说明。

示例:

export default {    
  matchMedia() {        
    var mMediaQueryList = mediaquery.matchMedia('(max-width: 466)');    
  },
}

MediaQueryEvent

定义MediaQuery事件。

系统能力: SystemCapability.ArkUI.ArkUI.Full

名称参数类型必填说明
matchesboolean匹配结果。

MediaQueryList

定义MediaQuery列表信息

属性

系统能力: 以下各项对应的系统能力均为SystemCapability.ArkUI.ArkUI.Full

名称参数类型必填说明
mediastring序列化媒体查询条件,该参数为只读。
matchesboolean匹配结果。

onchange

onchange?: (matches: boolean) => void

matches状态变化时的执行函数。

系统能力: SystemCapability.ArkUI.ArkUI.Full

参数:

参数名类型必填说明
matchesbooleanmatches状态变化时值。

MediaQueryList.addListener

addListener(callback: (event: MediaQueryEvent) => void): void

给MediaQueryList添加回调函数,回调函数应在onShow生命周期之前添加,即需要在onInit或onReady生命周期里添加。

系统能力: SystemCapability.ArkUI.ArkUI.Full

参数:

参数名类型必填说明
callback(event: MediaQueryEvent) => void匹配条件发生变化的响应函数。

示例:

mMediaQueryList.addListener(maxWidthMatch);

MediaQueryList.removeListener

removeListener(callback: (event: MediaQueryEvent) => void): void

移除MediaQueryList中的回调函数。

系统能力: SystemCapability.ArkUI.ArkUI.Full

参数:

QQ截图20240715201704.png

参数名HarmonyOSOpenHarmony鸿蒙文档籽料:mau123789是v直接拿类型必填说明
callback(event: MediaQueryEvent) => void)匹配条件发生变化的响应函数。

示例:

mMediaQueryList.removeListener(maxWidthMatch);

审核编辑 黄宇

声明:本文内容及配图由入驻作者撰写或者入驻合作网站授权转载。文章观点仅代表作者本人,不代表电子发烧友网立场。文章及其配图仅供工程师学习之用,如有内容侵权或者其他违规问题,请联系本站处理。 举报投诉
  • 鸿蒙
    +关注

    关注

    56

    文章

    2264

    浏览量

    42451
收藏 人收藏

    评论

    相关推荐

    鸿蒙开发-ArkUI框架实战【日历应用 】

    屏切换来修改应用的样式。 首先导入媒体查询模块 import mediaquery from \'@ohos.mediaquery\' 然后通过matchMediaSync接口设置媒体查询
    发表于 01-17 21:37

    鸿蒙原生应用开发-ArkTS语言基础概述

    ArkTS语言基础是HarmonyOS系统上为应用开发者提供的常用基础能力,主要包含能力如下图所示。 1.提供异步并发和多线程并发的能力。 支持Promise和async/await等标准
    发表于 03-05 15:42

    SQL语言实现数据记录的查询

    绝大部分DBMS都支持SQL语言,LabVIEW数据工具包实现的实质也是基于SQL语言,它为不熟悉SQL语言的用户把SQL语言封装了起来,
    发表于 07-01 21:25

    HarmonyOS应用开发-eTS-媒体查询

    .matchMediaSyncmatchMediaSync(condition: string): MediaQueryListener设置媒体查询查询条件,并返回对应的监听句柄。示例代码import mediaquery f
    发表于 05-27 14:58

    HarmonyOS语言基础开发指南上线啦!

    语言基础提供哪些功能?多线程并发如何实现?TaskPool(任务池)和Worker在实现和使用场景上有何不同? 针对开发者关注的并发等语言基础
    的头像 发表于 10-18 16:20 407次阅读
    HarmonyOS<b class='flag-5'>语言</b>基础<b class='flag-5'>类</b><b class='flag-5'>库</b>开发指南上线啦!

    鸿蒙开发UI界面——@ohos.mediaquery (媒体查询)

    (condition: string): MediaQueryListener 设置媒体查询查询条件,并返回对应的监听句柄。 系统能力: SystemCapability.ArkUI.ArkUI.Full 参数
    的头像 发表于 02-22 16:46 587次阅读

    鸿蒙OpenHarmony大合集:【语言基础

    本示例集合语言基础的各个子模块,展示了各个模块的基础功能
    的头像 发表于 04-29 16:38 384次阅读
    <b class='flag-5'>鸿蒙</b>OpenHarmony大合集:【<b class='flag-5'>语言</b>基础<b class='flag-5'>类</b><b class='flag-5'>库</b>】

    鸿蒙开发接口UI界面:【@ohos.mediaquery (媒体查询)】

    后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
    的头像 发表于 05-27 21:50 148次阅读
    <b class='flag-5'>鸿蒙</b>开发接口UI界面:【@ohos.<b class='flag-5'>mediaquery</b> (<b class='flag-5'>媒体查询</b>)】

    鸿蒙语言基础system.bluetooth 蓝牙

    开始搜寻附近的低功耗蓝牙外围设备。此操作比较耗费系统资源,请在搜索并连接到设备后调用[bluetooth.stopBLEScan]方法停止搜索。
    的头像 发表于 07-15 17:28 241次阅读
    <b class='flag-5'>鸿蒙语言</b>基础<b class='flag-5'>类</b><b class='flag-5'>库</b>:<b class='flag-5'>system</b>.bluetooth 蓝牙

    鸿蒙语言基础system.brightness 屏幕亮度

    获得设备当前的屏幕亮度值。
    的头像 发表于 07-15 17:56 620次阅读
    <b class='flag-5'>鸿蒙语言</b>基础<b class='flag-5'>类</b><b class='flag-5'>库</b>:<b class='flag-5'>system</b>.brightness 屏幕亮度

    鸿蒙语言基础system.configuration 应用配置

    获取应用当前的语言和地区。默认与系统的语言和地区同步。
    的头像 发表于 07-16 09:34 178次阅读

    鸿蒙语言基础system.device 设备信息

    在首页的onShow生命周期之前不建议调用device.getInfo接口。
    的头像 发表于 07-16 09:17 216次阅读

    鸿蒙语言基础system.file 文件存储

    将指定文件移动到其他指定位置。
    的头像 发表于 07-17 10:41 222次阅读
    <b class='flag-5'>鸿蒙语言</b>基础<b class='flag-5'>类</b><b class='flag-5'>库</b>:<b class='flag-5'>system</b>.file  文件存储

    鸿蒙语言基础system.network 网络状态

    获取当前设备的网络类型。
    的头像 发表于 07-18 09:37 140次阅读

    鸿蒙语言基础system.notification 通知消息

    以下各项对应的系统能力均为SystemCapability.Notification.Notification
    的头像 发表于 07-18 09:23 175次阅读