鸿蒙用 BuilderParam 实现同一个布局不同内容组件

面通过一个案例展示@BuilderParam的具体用法,例如,现需要实现一个通用的卡片组件,如下图所示

image.png

卡片中显示的内容不固定,例如

image.png

具体实现代码如下:

@Entry
@Component
struct BuildParamDemo {

  build() {

    Column(){

      Card() {
        imageBuilder()
      }

      Divider()
        .margin(10)

      Card() {
        textBuilder()
      }

    }

  }

}

@Builder function textBuilder() {
  Column({ space: 10 }) {
    Text('鸿蒙操作系统')
      .fontSize(25)
      .fontWeight(FontWeight.Bold)
    Text('华为鸿蒙HarmonyOS系统是面向万物互联的全场景分布式操作系统,支持手机、平板、智能穿戴、智慧屏等多种终端设备运行,提供应用开发、设备开发的一站式服务的平台。')
  }
}


@Builder function imageBuilder() {
  Column({ space: 10 }) {
    Image($r('app.media.img_harmony'))
      .width(300)
      .height(150)
    Text('鸿蒙操作系统')
  }
}


@Component
struct Card {
  @BuilderParam content: () => void; //@BuilderParam属性

  build() {
    Column() {
      this.content(); //占位符
    }.width('90%')
    .padding(10)
    .borderRadius(10)
    .shadow({ radius: 20 })
  }
}复制

结果图:

cke_6477.png

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/711175.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

C++:STL容器-->set

使用set容器时需要导入头文件&#xff1a;#include <set> set和multiset区别&#xff1a; set不允许容器中有重复的元素 multiset允许容器中有重复的元素 1. 构造函数 set<T> st; set s(const &st); void printSet(set<int>& s) {for (set<int>…

CC2500和CC1101移植说明

主要通过如何移植、移植注意、关于芯片配置、如何生成导出配置四大步骤来说明CC2500和CC1101移植 首先通过下图1这个宏进行选择 如何移植 要移植的部分在 CC2500_hal.c 和 CC2500_hal.h中, 搜索 "//移植" 就可以定位到 库 所需的依赖, 需要根据 您的环境实现这些…

【机器学习】LightGBM: 优化机器学习的高效梯度提升决策树

&#x1f308;个人主页: 鑫宝Code &#x1f525;热门专栏: 闲话杂谈&#xff5c; 炫酷HTML | JavaScript基础 ​&#x1f4ab;个人格言: "如无必要&#xff0c;勿增实体" 文章目录 LightGBM: 优化机器学习的高效梯度提升决策树引言一、LightGBM概览二、核心技术…

VSCode格式化插件-prettier

VSCode格式化插件 1.安装插件&#xff1a;prettier 2.设置默认格式化工具 设置中&#xff0c;搜索 “Default Formatter”。 在编辑器设置中&#xff0c;将默认格式化工具设为 Prettier。 3.启用格式化选项&#xff1a; 在设置中搜索 “Format On Save”&#xff0c;并勾选…

【机器学习】机器学习与物流科技在智能配送中的融合应用与性能优化新探索

文章目录 引言机器学习与物流科技的基本概念机器学习概述监督学习无监督学习强化学习 物流科技概述路径优化车辆调度需求预测 机器学习与物流科技的融合应用实时物流数据分析数据预处理特征工程 路径优化与优化模型训练模型评估 车辆调度与优化深度学习应用 需求预测与优化强化…

从 Solana 课程顺利毕业获得高潜岗位,他的 Web3 开发探险之旅

在 TinTinLand 的学习&#xff0c;给了我入门 Web3 行业的 Entry Ticket&#xff0c;我认为这张 Ticket 是非常宝贵和重要的。 Alex&#xff0c;一位从某家知名研究所毅然辞职&#xff0c;踏入Web3世界的年轻开发者&#xff0c;凭借在 TinTinLand 推出的「Solana 黑客松先锋训练…

leetcode(力扣)第15题-三数之和---使用c语言双指针法,二级指针的应用

题目&#xff1a; 15. 三数之和 - 力扣&#xff08;LeetCode&#xff09; 编写过程的问题&#xff1a; 记住线索 1、对数组使用快排排序&#xff1b;2、固定 a 对 b、c 使用双指针&#xff1b;3、注意去重问题。函数返回值的类型。{1&#xff0c;2&#xff0c;-3}。结果作为…

Unity动态添加聊天文本

1.创建一个滚动视图 2.调整滚动视图的位置并删掉这个 3.创建一个输入框和一个按钮 这里插一句一定要给content添加这个组件并设置单元格大小 4创建一个脚本并编写下面代码 using System.Collections; using System.Collections.Generic; using TMPro; using Unity.VisualScrip…

云原生系列之Docker常用命令

&#x1f339;作者主页&#xff1a;青花锁 &#x1f339;简介&#xff1a;Java领域优质创作者&#x1f3c6;、Java微服务架构公号作者&#x1f604; &#x1f339;简历模板、学习资料、面试题库、技术互助 &#x1f339;文末获取联系方式 &#x1f4dd; 系列文章目录 云原生之…

宠物空气净化器避坑指南:希喂、霍尼韦尔、安德迈谁是性价比之王

作为一个拥有两只布偶的猫奴&#xff0c;家中猫浮毛无处不在&#xff0c;稍有松懈&#xff0c;出门衣物上便沾满猫毛&#xff0c;影响形象。不仅如此&#xff0c;空气中还飘浮着猫咪们的浮毛和异味。难以清理。经过我不懈的努力&#xff0c;我终于找到了解决这一问题的神器——…

救命!挖到宝了,这本计算机书真的巨巨好看

一本适合大学生使用的计算机科学和编程学习指南&#xff0c;它通过丰富的内容和多样的学习形式&#xff0c;帮助学生建立坚实的计算机科学基础&#xff0c;并激发他们对计算机科学的兴趣。 这本书涵盖了多种类型的练习题&#xff0c;旨在帮助读者巩固理论知识并提高实际编程技能…

前端菜鸡流水账日记 -- pnpm的学习

哈咯哇大家&#xff0c;我又来了&#xff0c;最近稍微悠闲一些&#xff0c;所以就趁着这个机会学习一些新的知识&#xff0c;今天就是碰巧遇到了pnm&#xff0c;这个可以看作是npm的升级版本&#xff0c;比npm要快&#xff0c;用起来也更得劲更迅速 官网地址&#xff1a;https…

React入门教程:构建你的第一个React应用

在当今快速发展的Web开发领域&#xff0c;前端技术日新月异&#xff0c;而React作为一款强大的JavaScript库&#xff0c;已经成为众多开发者的首选。React以其组件化、高效的性能和灵活的数据处理机制闻名于世&#xff0c;被广泛用于构建动态且复杂的用户界面。在本教程中&…

Oracle数据库连接并访问Microsoft SQL Server数据库

Oracle数据库连接并访问Microsoft SQL Server数据库 说明&#xff1a;  1.实际开发中&#xff0c;Oracle数据库与SQLServer数据库之间可能需要相互进行访问&#xff0c;方便业务数据抽取&#xff0c;编写视图及表等操作。  2.SQLServer访问Oracle数据库配置相对较为简单&…

制作自己的 @OnClick、@OnLongClick(告别 setOnClickListener,使用注解、反射和动态代理)

前言 前面我们说过 ButterKnife 这个库&#xff0c;这个库实现不仅实现了 View 的绑定&#xff0c;而且还提供了大量的注解如 BindView、OnClick、OnLongClick 等来简化开发过程中事件绑定。而这些功能的实现是通过 APT 也就是注解处理器&#xff0c;在编译期间生成 Java 代码…

实用软件下载:XMind 2024最新安装包及详细安装教程

​XMind不仅是一款易用且功能强大的思维导图软件&#xff0c;也是一个开源项目。XMind以构建一个社区向全球提供领先的跨平台思维导图和头脑风暴软件为目标&#xff0c;以帮助用户提升效率。XMind公司是XMind开源项目的主要代码贡献者&#xff0c;与此同时&#xff0c;我们欢迎…

回答网友的一个Delphi问题

网友想在grid 中 加一个水印&#xff0c;俺就给他写了个例子。先靠效果&#xff1a; 这个例子 包含下面几步&#xff1a; 1、创建背景 dg_bmp:Tbitmap.Create; w: Image1.Picture.Bitmap.width; h: Image1.Picture.Bitmap.height; dg_bmp.width: w*2; dg_bmp.height: …

ArrayList集合+综合案例

数组与集合的区别 ArrayList 概述 是java编写好的一个类,用于表示一个容器,使用的时候,需要注意指定容器中元素的数据类型;(如果不指定,语法不报错,但是取值的时候不方便)注意事项 使用的时候,写ArrayList<元素的数据类型>的数据类型的时候,带着泛型;使用ArrayList集合…

Kafka性能优化策略综述:提升吞吐量与可靠性

Kafka性能优化策略综述&#xff1a;提升吞吐量与可靠性 优化 Kafka 的性能可以从多个方面入手&#xff0c;包括配置调优、架构设计和硬件资源优化。下面详细介绍一些常用的优化策略&#xff1a; 1. 分区设计 增加分区数量&#xff1a;更多的分区意味着更高的并行处理能力&a…

1089 狼人杀-简单版

solution 有两个狼人&#xff0c;其中一个狼人说谎&#xff0c;找到符合该条件的方案。若有多种则输出序号最小的方案&#xff0c;若无方案则输出No Solution。 枚举所以狼人的可能性&#xff0c;找到符合的方案输出并结束。 #include<iostream> using namespace std; …