003、ArkTS开发实践

news2024/11/25 13:15:38

之——尝试

杂谈

        学习声明式UI语法:


正文

1.声明式UI

1.1 声明式描述

        想要什么样子就直接描述:

1.2 状态驱动视图更新


2.自定义组件

        对页面内容进行合理抽象,组合基础组件,封装成自定义组件。 

        自定义子组件,为后续使用做准备: 

        开始页面:

         配置build函数:

         整个组件的组成:

 

        合理抽象组件: 


3.配置属性与布局

        样式调整,使用.运算符来进行属性设置:

         布局调整,使用容器组件进行多个组件的布局调整,将组件按照需要排列的顺序放置:

        比如说行排列容器:

        代码实现: 

        .运算符进行属性优化:

         可变文字实现,然后用struct封装整个组件:

        组合标题和代办组件,列布局容器:

         将之前封装的组件用起来:


4.改变组件状态

        提供交互功能,变化组件实现状态交互,通过state修饰完成变量,实现状态与视图UI的绑定:

         代码与效果:

        需要build变量来支持if else,为对应row配置动作与状态变量的绑定实现交互:


 5.渲染列表数据

        ForEach语句,传入数据源:

         用每个元素生成todoitem组件,todoitem组件里面定义了每个row的功能:

         效果:

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Leetcode211. 添加与搜索单词 - 数据结构设计

Every day a Leetcode 题目来源:211. 添加与搜索单词 - 数据结构设计 解法1:字典树 字典树(前缀树)是一种树形数据结构,用于高效地存储和检索字符串数据集中的键。前缀树可以用 O(∣S∣) 的时间复杂度完成如下操作…

【Vue】记事本

上一篇&#xff1a;Vue的指令 https://blog.csdn.net/m0_67930426/article/details/134599378?spm1001.2014.3001.5501 本篇所需指令&#xff1a; v- for v-model v-on v-show 目录 删除功能 添加功能 统计功能 清空功能 v-show 删除功能 <!DOCTYPE html> …

原生DOM事件、react16、17和Vue合成事件

目录 原生DOM事件 注册/绑定事件 DOM事件级别 DOM0&#xff1a;onclick传统注册&#xff1a; 唯一&#xff08;同元素的(不)同事件会覆盖&#xff09; 没有捕获和冒泡的&#xff0c;只有简单的事件绑定 DOM2&#xff1a;addEventListener监听注册&#xff1a;可添加多个…

编译原理词法分析器

算法描述 对于给出的源代码&#xff0c;我们按行将其读入&#xff0c;对于每一行单独进行词法分析。 过滤行前后空格对字符串进行词语的分割 有空格则把空格前的字符归为一个词比较上一个字符和当前字符是否需要进行分割 检查词语是否合法词语合法则按 [待测代码中的单词符号…

idea spring initializr创建项目报错

闲来无事就想搞个项目练练手&#xff0c;没想到直接给我卡在项目创建上了&#xff0c;一个个问题最终迎刃而解。 1.上来就给我报了个maven的错 未解析的插件: ‘org.apache.maven.plugins:maven-resources-plugin:3.3.1’ 不慌&#xff0c;应该是maven的路径有问题&#xff0c…

Ardupilot开源飞控之VTOL之旅:配件规格

Ardupilot开源飞控之VTOL之旅&#xff1a;配件规格 1. 源由2. 飞控板 Aocoda-RC H743Dual3. PDB分电板 Aocoda-RC PDB30604. GPS BN8805. 摄像头 RunCam 1200TVL6. 模拟图传 JHEMCU RuiBet Tran-3016W 5.8GHZ 1.6W7. 打印件7.1 飞控/GPS座子7.2 VTX/天线座子7.3 接收机天线座 8…

视频批量剪辑秘籍:批量AI智剪技巧,提升剪辑效率

在视频制作过程中&#xff0c;剪辑是一项重要的工作。然而&#xff0c;对于许多创作者来说&#xff0c;逐个剪辑视频会耗费大量的时间和精力。为了提高效率&#xff0c;批量剪辑成为了必要的手段。在进行批量剪辑之前&#xff0c;首先要明确自己的需求和素材。了解要剪辑的视频…

理解国外大佬用Web做出来跨窗口渲染动画效果

今天刷抖音看见国外一个大佬用Web做出来一个可以跨多浏览器窗口实时互动的渲染动画效果,觉得非常新奇,我就去看了一下源码,作者还写了一个非常好的例子帮助理解,我自己也仿写了作者的例子加深理解 **GitHub预览地址**麻烦帮忙点亮星星谢谢哈哈哈~ 整体思路是监听visibilityStat…

Windows系统下更新后自带的画图软件出现马赛克bug

一.bug的样子 在使用橡皮后&#xff0c;原来写的内容会变成马赛克。而我们希望它是纯白色的。 二.解决方法 第一步 第二步 第三步 三. 解决后的效果 用橡皮擦随便擦都不会出现马赛克了。 更新过后&#xff0c;想用win自带的画图软件会出现bug,希望微软大佬能够尽早解决bug。

QT基础开发笔记

用VS 写QT &#xff0c;设置exe图标的方法&#xff1a; 选定工程--》右键--》添加---》资源--》 QString 字符串用法总结说明 Qt QString 增、删、改、查、格式化等常用方法总结_qstring 格式化-CSDN博客 总结来说&#xff1a; QString 的 remove有两种用法&#xff0c;&am…

Zephyr:Direct Distillation of LM Alignment

Zephyr&#xff1a;Direct Distillation ofLM Alignment IntroductionMethod Introduction dSFT已经被可以提升模型的指令遵循能力的准确性&#xff0c;但是student model 不会超过 teacher model。 作者认为 dSFT虽然可以让模型更好的理解用户意图&#xff0c;但是无法与人类…

【笔记】小白学习电路维修

学习视频&#xff08;b站&#xff09;&#xff1a;从0开始学电路 从0开始学电路维修 p1 黄色长方体元件P2 故障率最高的元件p3带芯铜丝线圈是什么区分电感和变压器接入电路分析&#xff1a; p1 黄色长方体元件 安规电容&#xff1a;分为x y两种 位置&#xff1a;通常位于交…

[C++]指针与结构体

标题 一.指针1.指针的定义和使用2.指针所占的内存空间3.空指针与野指针4.const修饰指针5.指针和数组6.指针和函数 二.结构体1.结构体的定义与使用2.结构体数组3.结构体指针4.结构体的嵌套使用5.结构体做函数参数6.结构体中const使用场景7.案例练习 一.指针 作用: 可以通过指针…

Liunx系统使用超详细(一)

目录 一、Liunx系统的认识 二、Liunx和Windows区别 三、Liunx命令提示符介绍 四、Liunx目录结构 一、Liunx系统的认识 Linux系统是一种开源的、类Unix操作系统内核的实现&#xff0c;它基于Unix的设计原理和思想&#xff0c;并在全球范围内广泛应用。以下是对Linux系统的详…

Drools 7 JMX Mbean 及Metric 分析

Mbean mbean的打开很简单&#xff0c;使用jmx启动参数&#xff1a; -Dcom.sun.management.jmxremote.port9999 -Ddrools.mbeansenabled -Dcom.sun.management.jmxremote.authenticatefalse -Dcom.sun.management.jmxremote.sslfalse 但通过jconsole能直观看到的东西也很…

文本编辑 UTF-8 BOM 中的BOM释义

参考资料 UTF8のBOM無しとBOM付きの違いBOMなしUTF-8によってWindowsでもたらされる困惑文字コードをUTF-8 BOMなし(UTF-8N)でファイル保存をする方法 目录 一. 前提二. BOM三. CSV文件中的表现 一. 前提 在使用Windows自带的记事本编辑.csv文件的时候&#xff0c;准备保存为…

openpnp - 自动换刀设置 - 使用克隆功能降低风险

文章目录 openpnp - 自动换刀设置 - 使用克隆功能降低风险概述笔记需要注意的地方将一个做好的吸嘴作为这排其他吸嘴的模板END openpnp - 自动换刀设置 - 使用克隆功能降低风险 概述 自动换刀设置时, 很危险, 动不动就撞刀. 如履薄冰啊:( 看到openpnp在自动换刀时, 有个克隆功…

每日一练:“打家劫舍”(House Robber)问题 III

有想要了解打家劫舍初级问题的&#xff0c;可以点击下面链接查看&#xff01; 每日一练&#xff1a;“打家劫舍“&#xff08;House Robber&#xff09;问题 I   每日一练&#xff1a;“打家劫舍“&#xff08;House Robber&#xff09;问题 II 1. 问题 房屋形成一棵二叉树&…

时间序列预测 — LSTM实现单变量风电滚动预测(Keras)

目录 1 数据处理 1.1 数据集简介 1.2 数据集处理 2 模型训练与预测 2.1 模型训练 2.2 模型滚动预测 2.3 结果可视化 1 数据处理 1.1 数据集简介 实验数据集采用数据集5&#xff1a;风电机组运行数据集&#xff08;下载链接&#xff09;&#xff0c;包括风速、风向、温…

每日一题:LeetCode-LCR 143.子结构判断

每日一题系列&#xff08;day 05&#xff09; 前言&#xff1a; &#x1f308; &#x1f308; &#x1f308; &#x1f308; &#x1f308; &#x1f308; &#x1f308; &#x1f308; &#x1f308; &#x1f308; &#x1f308; &#x1f308; &#x1f308; &#x1f50e…