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

    文章

    64

    浏览量

    9992
  • HarmonyOS
    +关注

    关注

    80

    文章

    2157

    浏览量

    36287
收藏 人收藏
加入交流群
微信小助手二维码

扫码添加小助手

加入工程师交流群

    评论

    相关推荐
    热点推荐

    钉钉正式开源HarmonyOS图片编辑组件

    近日,由钉钉团队自主研发的“HarmonyOS图片编辑组件”正式上线OpenHarmony三方库中心仓并开源。作为一款填补鸿蒙社区图像处理领域空白的重量级组件,该方案基于HarmonyOS
    的头像 发表于 01-05 09:58 670次阅读

    QCon·上海站HarmonyOS开发者技术分论坛:共探鸿蒙开发新机遇

    当前,AI 技术重构开发逻辑、多设备协同成为技术主流,鸿蒙开发能力正迎来从“能用好用”到“实用便捷”的关键跃迁。10月24日,2025年QCon全球软件开发大会上海站HarmonyOS
    的头像 发表于 10-24 15:59 977次阅读
    QCon·上海站<b class='flag-5'>HarmonyOS</b><b class='flag-5'>开发</b>者技术分论坛:共探鸿蒙<b class='flag-5'>开发</b>新机遇

    HarmonyOS 5】鸿蒙中进度条的使用详解

    HarmonyOS 5】鸿蒙中进度条的使用详解 ##鸿蒙开发能力 ##HarmonyOS SDK应用服务##鸿蒙金融类应用 (金融理财# 一、HarmonyOS中Progress进度
    的头像 发表于 07-11 18:26 1277次阅读
    【<b class='flag-5'>HarmonyOS</b> 5】鸿蒙中进度条的使用详解

    HarmonyOS 5】鸿蒙页面和组件生命周期函数

    HarmonyOS 5】鸿蒙页面和组件生命周期函数 ##鸿蒙开发能力 ##HarmonyOS SDK应用服务##鸿蒙金融类应用 (金融理财# 一、生命周期阶段: 创建阶段 build
    的头像 发表于 07-11 18:24 1184次阅读

    HarmonyOS 5】鸿蒙mPaaS详解

    HarmonyOS 5】鸿蒙mPaaS详解 ##鸿蒙开发能力 ##HarmonyOS SDK应用服务##鸿蒙金融类应用 (金融理财# 一、mPaaS是什么? mPaaS 是 Mobile
    的头像 发表于 07-11 18:23 1012次阅读
    【<b class='flag-5'>HarmonyOS</b> 5】鸿蒙mPaaS详解

    HarmonyOS 5】金融应用开发鸿蒙组件实践

    HarmonyOS 5】金融应用开发鸿蒙组件实践 ##鸿蒙开发能力 ##HarmonyOS SDK应用服务##鸿蒙金融类应用 (金融理财#
    的头像 发表于 07-11 18:20 1128次阅读
    【<b class='flag-5'>HarmonyOS</b> 5】金融应用<b class='flag-5'>开发</b>鸿蒙<b class='flag-5'>组件</b>实践

    HarmonyOS 5 入门系列 】鸿蒙HarmonyOS示例项目讲解

    HarmonyOS 5 入门系列 】鸿蒙HarmonyOS示例项目讲解 ##鸿蒙开发能力 ##HarmonyOS SDK应用服务##鸿蒙金融类应用 (金融理财# 一、前言:移动
    的头像 发表于 07-07 11:57 1190次阅读
    【 <b class='flag-5'>HarmonyOS</b> 5 入门系列 】鸿蒙<b class='flag-5'>HarmonyOS</b>示例项目讲解

    如何监听组件再次显示的事件?

    ​ ##HarmonyOS 应用开发## 我们知道,对于组件的生命周期,有aboutToAppear和aboutToDisAppear,即监听这个组件被挂载和卸载的事件,和被@Entr
    发表于 06-30 18:02

    LoadingProgress组件的使用##HarmonyOS应用开发##

    ​  在应用开发的过程中,经常有需要表示“加载中”或者“请等待”的这么一个状态提示,我原来的做法是会通过找一张gif图片来表示这一状态,但是如果使用gif图片的话,会有以下几个问题 1. 在不同页面
    的头像 发表于 06-30 17:26 631次阅读

    HarmonyOS入门指南

    1、文档与教程 HarmonyOS开发文档-应用开发导读 OpenHarmony--应用开发导读 仓颉编程语言官网 华为开发者博客 华为
    的头像 发表于 06-27 00:11 918次阅读

    华为正式启动HarmonyOS 6开发者Beta

    在2025年华为开发者大会(HDC)上,华为正式启动HarmonyOS 6开发者Beta,并全面展示一年多以来与合作伙伴共建鸿蒙生态的创新成果。
    的头像 发表于 06-24 15:42 999次阅读

    HarmonyOS 代码工坊的指尖开发,让 APP 开发所见即所得

    沙盘被直接搬入了移动设备本身。眼尖的开发者应该已经发现,最近华为应用市场“应用尝鲜”专区里,上架了一款名为“HarmonyOS 代码工坊”的新应用,下载量持续攀升。 开发者只需要下载“Harm
    的头像 发表于 06-24 12:08 936次阅读
    <b class='flag-5'>HarmonyOS</b> 代码工坊的指尖<b class='flag-5'>开发</b>,让 APP <b class='flag-5'>开发</b>所见即所得

    HarmonyOS基础组件:Button三种类型的使用

    简介 HarmonyOS在明年将正式不再兼容Android原生功能,这意味着对于客户端的小伙伴不得不开始学习HarmonyOS开发语言。本篇文章主要介绍鸿蒙中的Button使用。 Harmon
    的头像 发表于 06-09 15:48 2707次阅读
    <b class='flag-5'>HarmonyOS</b>基础<b class='flag-5'>组件</b>:Button三种类型的使用

    HarmonyOS实战:组件化项目搭建

    ?本文将详细讲解HarmonyOs组件化项目搭建的全过程,带领大家实现一个组件化项目。 项目创建 首先创建一个项目工程,点击开发工具DevEco-Stdio的****File 选项,选
    的头像 发表于 06-09 14:58 786次阅读
    <b class='flag-5'>HarmonyOS</b>实战:<b class='flag-5'>组件</b>化项目搭建

    京东开源Taro on HarmonyOS C-API版本

    近日,京东正式开源了Taro on HarmonyOS C-API 版本,为鸿蒙应用跨端开发提供高性能框架。这次版本的发布,带来了更丰富的样式适配、更高效的渲染性能、更全面的组件支持,让开发
    的头像 发表于 06-09 09:19 1244次阅读
    京东开源Taro on <b class='flag-5'>HarmonyOS</b> C-API版本