HarmonyOS NEXT

ArkTS 中，@State 是数据源头，变化会自动重渲染 UI；@Link 让父子双向同步，父传参用 $count，子不能赋初值，类型须一致，支持对象和数组；@Prop 父到子单向传值，子拿副本，父改子变、子改父不变，仅支持简单类型，不支持对象和数组。选法：数据归谁用 @State；子要改父数据用 @Link，只读展示用 @Prop；对象或数组必须用 @Link。可记为：@State 原件，@Link 钥匙，@Prop 复印件。

文章通过两段示例代码对比绝对定位 position 与相对定位 offset 的用法。position 示例在粉色 Column 中放置四个 80×80 的红色文本块，坐标分别为 (0,0)、(80,80)、(160,160)、(240,240)，呈现沿对角线错位排布。offset 示例同样设置四个红色文本块，前三个 x 偏移分别为 0、80、160，y 均为 0，第四个未设置偏移，用于展示相对偏移效果。外层容器宽 100%、高 360。读者可据此了解两种定位属性的参数写法、定位方式及布局表现。

该内容以表格对比子组件垂直排列与水平排列两种方式。垂直排列时，主轴方向向下，交叉轴方向向右，默认对齐为顶部居中；水平排列时，主轴方向向右，交叉轴方向向下，默认对齐为左居中。主轴对齐方向通过同一示意图集中展示，交叉轴对齐则分别配图说明两种排列下的对齐效果。由此可明确：排列方向会直接改变主轴与交叉轴的方向定位，并影响默认对齐基准；理解这些对应关系，有助于快速判断和设置子组件在容器中的布局位置。

该文解析了基于HarmonyOS ArkUI 3.0与TypeScript开发的用户登录页面。页面采用声明式UI与分层组件架构，通过@Entry、@Component、@State等装饰器实现状态驱动的界面更新。核心功能包括手机号非空及格式校验（正则表达式）、实时错误反馈、防重复提交的登录流程，并展示输入框封装、按钮加载态切换、条件渲染成功视图等关键实现。文章还详解了以#1FA485为主色的视觉规范、响应式布局策略及性能优化思路，如最小化状态管理、减少嵌套层级。整体架构清晰，是学习ArkUI声明式开发、表单验证与移动端界面设计的实用范例。

本文解析基于 HarmonyOS ArkUI 开发的注册页面 textinput1.ets，展示声明式 UI 与响应式状态管理的最佳实践。页面采用分层组件结构，使用 @State 管理账号、密码、邮箱及提交状态，通过条件渲染切换注册表单与成功视图。关键技术包括：TextInput 的 onChange 双向绑定、按钮加载状态与防重复提交、setTimeout 模拟网络请求、$r() 资源引用，以及统一绿色主题与百分比布局的响应式设计。文章还涵盖性能优化要点，如最小化状态变量、减少嵌套和条件渲染。该范例架构清晰，适合开发者学习用 ArkUI 快速构建高质量移动端表单界面。

文章介绍自定义文本样式中文本溢出处理方案，强调需配合 `maxLines` 使用。`TextOverflow.None` 不做溢出处理，文本撑破容器，适用于不限制行数场景；`Clip` 直接截断超出文本，无省略标记，适合空间紧张的列表项；`Ellipsis` 在末尾显示省略号，用于标题等提示未完全展示；`MARQUEE` 以滚动跑马灯循环显示，适合单行通知栏。正文通过热搜列表完整代码展示各模式实际应用，帮助开发者按需选择溢出策略，实现单行截断、滚动展示等效果。

本文介绍HarmonyOS ArkUI中Text文本组件的核心用法。创建文本可直接使用`Text('你好')`，也可通过Resources资源引用`string.json`中的字符串。Text支持添加Span子组件，通过嵌套语法实现更精细的样式控制，Span仅能作为Text和RichEditor的子组件。文本装饰可用`decoration`设置下划线及颜色，例如`TextDecorationType.Underline`搭配`Color.Green`。`textCase`可控制文本内容大小写，支持LowerCase和UpperCase两种模式。`onclick`为单击事件，可响应用户点击操作。读者可据此灵活构建带样式与交互的文本界面。

objectFit 的 ImageFit 提供了六种图片适配模式。contain 保持宽高比，图片完整显示于容器内，可能有留白；cover 保持比例并填满容器，多余部分裁剪，适合头像、Banner；auto 根据图片横竖方向自动选择 contain 或 cover；fill 完全拉伸填满容器，会变形失真；scaleDown 类似 contain 但只缩小不放大，避免小图模糊；none 保持原始尺寸居中，超出裁剪或留白。选择时需根据是否允许裁剪、是否需防变形、是否保留原始像素等需求确定，帮助开发者让图片在不同容器中达到预期展示效果。

本文介绍HarmonyOS中Image组件的使用方法：可加载存档图和多媒体像素图两类资源，数据源支持本地、网络、resource、媒体库及base64；通过属性可设置尺寸与边距，并支持在float.json中统一配置。文章还演示了事件调用，并提供一个仿社区帖子页面的完整代码案例，涵盖作者信息、图文网格、点赞互动、评论列表及底部输入栏，展示Image在实际布局中的典型应用，帮助开发者快速掌握图片加载与页面搭建技巧。

本文介绍HarmonyOS中Scroll滚动组件的用法。Scroll默认在内容超出屏幕时垂直方向滚动，并出现滚动条；如需水平滚动，可通过`scrollable(ScrollDirection.Horizontal)`修改延伸方向。文章给出综合练习示例，展示在Scroll内构建Row并排列多个子项实现横向滚动。此外还补充了两个常用属性：`scrollBar(BarState.On)`可使滚动条常驻显示，`edgeEffect(EdgeEffect.Spring)`为滚动添加边缘回弹效果。内容聚焦组件基础配置，便于开发者快速实现滚动布局。