鸿蒙开发者社区

1.效果演示自适应布局响应式布局2.前言本篇文章结合本人项目代码，讲解一次开发，多端部署应用。目前通过自适应布局和响应式布局，已经完成效果很好的多端部署。通过一套代码，最终编译出来的同一个应用就可以按不同的显示效果分别运行在手机、平板、折叠屏等设备上，这对开发者来说真是既高效又便捷。3.自适应布局自适应布局是指应用能够根据设备的屏幕尺寸和分辨率自动调整界面元素的大小和位置，确保界面在不同设备上都能保...

1.演示效果2.引言本篇要介绍的是一个用于管理用户在不同地点驻留时间的一个强大的时间选择组件，以便用户能够方便地设置和调整驻留时间。现有的Slider组件虽然功能强大，但在我们的项目中无法直接满足同时选择小时和分钟的需求。因此，我们决定自定义一个基于Slider组件的时间滑动条，以提供更精确和灵活的时间选择功能，并且还实现了响应式布局来调整组件的大小，然后就可以使用这个自定义组件进行使用，如半模态弹窗，可以见...

1.效果演示日期选择组件实现时间选择组件实现2.引言在项目开发中遇到需要时间或日期的组件，于是查阅文档，发现了DatePickerDialogTimePickerDialog两个选择器弹窗，然而在实际的使用过程中发现他们不是太好使用，且只能是弹窗的形式。于是再次查阅文档发现TimePicker和DatePicker选择组件于是在此基础上再次自定义样式，实现符合自己需求的选择器样式。本文将深入探讨如何自定义基于TimePicker和DatePicker的组件，以满足不同...

1.效果展示2.概述在开发应用中，深色模式逐渐成为用户界面设计的重要组成部分。如果不在开发时，主动配置颜色资源来设置深色模式，这样在系统切换深色模式后，再次打开咱们的应用就会很丑。深色模式的实现方式，包括跟随系统变化和不跟随系统变化的两种场景。下面我就来介绍一下这两部分3.跟随系统变化3.1不设置深色模式应用默认是跟随系统的颜色变化的，如果不想跟随系统颜色变化，不设置深色模式，避免系统深色模式给app的影...

1.效果演示弹性布局演示scroll嵌套弹性布局演示2.引言灵活的布局方式是提升用户体验的关键因素之一。尤其是当应用需要处理动态内容时，能够自适应内容长度的布局显得尤为重要。本文档旨在详细讲解如何在openHarmony中使用Scroll组件结合Flex弹性布局来实现无固定高度的内容展示，并且使得每个Flex子元素的宽度能够自适应。3.Flex布局基础Flex布局（FlexibleBoxLayout）是一种用于一维布局的CSS布局模式。它使得容器内的子元素可...

引言在日常的开发中，遇到需要更改用户名的UI设计，然而却遇到一些麻烦，比如用户名过长输入框不够怎么办，怎么去掉光标并保存输入等，在文档中查询还是很慢的，所以就对之前的困难做一个总结，本文将探讨如何使其宽度自适应、如何通过点击屏幕保存用户输入，以及如何去掉光标等技术细节。输入框的基础设置在ArkUI中，TextInput组件是用于接收用户输入的基本组件。下面我们将详细介绍如何设置这个组件的各种属性，以实现一个功...

引言在现代的移动应用中，登录和注册必不可少，而鸿蒙又是现在的发展趋势，然而在网上却很难找到，一个完整的ArkUI实现的登录注册案例，并且是实现了功能的。本文将介绍一个使用ArkUI框架实现的简单而高效的登录和注册界面案例，并详细解析其代码绘制界面的过程以及功能实现的细节，通过过这个案例，读者可以了解到如何在ArkUI中使用HTTP请求和Axios库与后端服务器进行交互，以及如何管理组件状态以实现动态界面更新。该案例不...

前言在现代移动应用开发中，用户体验设计至关重要。TextInput组件作为用户输入信息的重要工具，其外观和功能的设计直接影响到用户与应用的交互体验。本文将探讨如何在ArkUI框架下，为TextInput组件的输入框右侧设置自定义样式，例如添加一个图片图标。通过这种方式，开发者可以增强输入框的直观性和功能性，提升整体应用的美观性和用户体验。而笔者在开发过程中也曾遇到这个疑问，下面通过示例来给大家详细解释。Textinput组件...

前言OpenHarmony的FormKit卡片开发服务主要用于提供一种轻量级、可定制的功能组件，使得开发者可以为用户提供便捷的服务入口。卡片通常可以展示在桌面或其他指定区域，用户可以通过点击卡片直接访问应用的主要功能或获取信息，无需打开整个应用，从而提高用户体验和操作效率。FormKit（卡片开发服务）提供一种界面展示形式，可以将应用的重要信息或操作前置到服务卡片（以下简称“卡片”），以达到服务直达、减少跳转层级的体验...

前言模态转场是新的界面覆盖在旧的界面上，旧的界面不消失的一种转场方式。半模态转场是一种特殊的页面切换效果，用于在当前页面上显示一部分内容，而不会完全覆盖底下的页面。这种转场方式通常用于提供额外的信息或操作选项，而不需要用户离开当前页面。介绍通过bindSheet属性为组件绑定半模态页面，在组件插入时可通过设置自定义或默认的内置高度确定半模态大小，属性设置如下。javascriptbindSheet(isShow:Optional,builder:...

介绍启动页作为应用程序首次出现的页面，通常用于展示应用的启动画面，提供用户体验的平滑过渡，同时可以提供安插广告，或者美化应用的作用等。启动页面更改在项目的module.json5文件中找到"abilities"1.找到名叫Entryability.ts的文件，找到windowStage.loadContent()这个方法，圈出来的就是默认启动页面2.默认启动页需要在mainpages.json这个文件中配置过才行如图所示在Entryability中找到windowStage.loadContent，将页面替...

Toggle组件解释Toggle组件是一个交互式UI组件，用于切换两种状态之间的选择或开关。它通常用于表示开关按钮，例如在设置中启用或禁用某些选项。在Toggle组件中，用户可以点击按钮来切换状态，或者使用键盘或其他输入设备上的快捷键。通常，Toggle组件会在用户点击或切换状态时触发一个事件，以便应用程序可以响应此更改。Toggle组件通常包含以下属性：type：表示当前Toggle组件类型。isOn：表示当前Toggle组件选中的状态。onCha...