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

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

3天内不再提示

HarmonyOS应用开发—marquee组件的使用

鸿蒙时代 来源:鸿蒙时代 作者:鸿蒙时代 2022-04-18 10:22 次阅读
poYBAGJcyo6AJWv7AABP3G6ofVE320.png


1.创建项目

pYYBAGJcyqiAVGbTAAAqKHfMY7U034.png

2.示例代码
hml


{{marqueeCustomData}}
StartStop

css

.container {
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    background-color: #ffffff;
}
.customMarquee {
    width: 100%;
    height: 80px;
    padding: 10px;
    margin: 20px;
    border: 4px solid #ff8888;
    border-radius: 20px;
    font-size: 40px;
    color: #ff8888;
    font-weight: bolder;
    font-family: serif;
    background-color: #ffdddd;
}
.content {
    flex-direction: row;
}
.controlButton {
    flex-grow: 1;
    background-color: #F2F2F2;
    text-color: #0D81F2;
}

js

export default {
    data: {
        scrollAmount: 10,
        loop: 3,
        marqueeDir: 'left',
        marqueeCustomData: '节假日大酬宾,盛大开幕',
    },
    onStartClick (evt) {
        this.$element('customMarquee').start();
    },
    onStopClick (evt) {
        this.$element('customMarquee').stop();
    }
}

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

    关注

    0

    文章

    52

    浏览量

    9138
  • HarmonyOS
    +关注

    关注

    79

    文章

    1696

    浏览量

    29152
收藏 人收藏

    评论

    相关推荐

    鸿蒙OS开发实例:【工具类封装-emitter组件间通信】

    `MyEmitterUtil` 是一个针对 HarmonyOS 的事件驱动编程封装类,主要用于组件间的通信和数据传递。
    的头像 发表于 03-27 22:13 13次阅读

    HarmonyOS开发技术全面分析

    难度和成本。这能够让开发者聚焦上层业务逻辑,更加便捷、高效地开发应用。 ⚫ 对设备开发者而言, HarmonyOS 采用了组件化的设计方案,
    发表于 02-21 16:31

    鸿蒙开发-ArkUI 组件基础

    1 组件介绍 组件(Component)是界面搭建与显示的最小单位,HarmonyOS ArkUI声明式开发范式为开发者提供了丰富多样的UI
    发表于 01-17 19:31

    HarmonyOS鸿蒙原生应用开发设计- 服务组件

    HarmonyOS设计文档中,为大家提供了一些已经设计好的原生服务组件库,开发者可以根据需要直接引用。 开发者直接使用官方提供的服务组件库样
    发表于 10-24 16:12

    HarmonyOS鸿蒙原生应用开发设计- HarmonyOS Sans 字体

    HarmonyOS设计文档中,为大家提供了独特的字体,开发者可以根据需要直接引用。 开发者直接使用官方提供的字体内容,既可以符合HarmonyOS原生应用的
    发表于 10-23 16:12

    HarmonyOS/OpenHarmony原生应用-ArkTS万能卡片组件Stack

    堆叠容器,子组件按照顺序依次入栈,后一个子组件覆盖前一个子组件。该组件从API Version 7开始支持。可以包含子组件。 一、接口 St
    发表于 10-09 14:29

    HarmonyOS 应用开发 Web 组件基本属性应用和事件

    一、Web组件概述 Web组件用于在应用程序中显示Web页面内容,为开发者提供页面加载、页面交互、页面调试等能力。 ● 页面加载:Web组件提供基础的前端页面加载的能力,包括加载网络页
    发表于 09-15 15:28

    HarmonyOS/OpenHarmony应用开发-ArkTSAPI组件总体分类与说明(下)

    将数据展示为环形图表。 LoadingProgress 用于显示加载动效的组件Marquee 跑马灯组件,用于滚动展示一段单行文本,仅当文本内容宽度超过跑马灯组件宽度时滚动。 Pr
    发表于 08-17 09:56

    HarmonyOS NEXT新能力,一站式高效开发HarmonyOS应用

    更复杂应用开发。首先HarmonyOS支持大型应用模块化开发,并且支持通过轻量化应用组件,减少运行资源占用。同时,通过ArkUI跨平台框架的能力,可以实现一次
    发表于 08-14 15:08

    HarmonyOS NEXT新能力,一站式高效开发HarmonyOS应用

    2023年8月6日华为开发者大会2023(HDC.Together)圆满收官,伴随着HarmonyOS 4的发布,华为向开发者发布了汇聚所有最新开发能力的
    的头像 发表于 08-11 12:10 539次阅读

    HarmonyOS NEXT新能力,一站式高效开发HarmonyOS应用

    2023年8月4日的华为开发者大会2023(HDC.Together)拉开帷幕,伴随着HarmonyOS 4的发布,华为向开发者发布了汇聚所有最新开发能力的
    的头像 发表于 08-09 17:16 735次阅读

    【直播预告】HarmonyOS极客松赋能直播第四期:HarmonyOS开发经验分享

    Release新版发布 HarmonyOS Connect认证测试 原文标题:【直播预告】HarmonyOS极客松赋能直播第四期:HarmonyOS开发经验分享 文章出处:【微信公众
    的头像 发表于 07-03 09:05 317次阅读
    【直播预告】<b class='flag-5'>HarmonyOS</b>极客松赋能直播第四期:<b class='flag-5'>HarmonyOS</b><b class='flag-5'>开发</b>经验分享

    HarmonyOS开发:舒尔特方格游戏

    为丰富 HarmonyOS 对云端开发的支持、实现 HarmonyOS 生态端云联动,DevEco Studio 推出了云开发功能,开发者在
    的头像 发表于 06-19 15:05 461次阅读
    <b class='flag-5'>HarmonyOS</b>云<b class='flag-5'>开发</b>:舒尔特方格游戏

    HarmonyOS优选主力应用开发语言-ArkTS概述

    ArkTS是HarmonyOS优选的主力应用开发语言。ArkTS围绕应用开发在TypeScript(简称TS)生态基础上做了进一步扩展,继承了TS的所有特性,是TS的超集。因此,在学习ArkTS语言
    发表于 06-09 10:52

    HarmonyOS/OpenHarmony应用开发-ArkTS语言基本语法说明

    的封装和复用UI描述。 @Extend/@Style:扩展内置组件和封装属性样式,更灵活地组合内置组件。 stateStyles:多态样式,可以依据组件的内部状态的不同,设置不同样式。*附件:
    发表于 06-01 10:25