当前位置: 首页 > news >正文

HarmonyOS开发商城首页实现

目录

一:功能概述

二:代码实现

三:效果图


一:功能概述

这一节我们主要在鸿蒙OS系统中实现的一个底部导航功能,并在首页底部使用TabSwitch组件进行导航切换。同时,首页采用Search组件实现商品搜索框,Scroll和Swiper组件实现图片轮播功能,以展示推荐内容或图片。

1:主要功能组件

Tabs:容器组件,用于包裹多个TabContent。
TabContent:内容页组件,每个TabContent对应底部导航栏中的一个选项卡。
TabBar:导航页签栏,通过自定义TabBuilder函数组件实现,以增强页面的可读性和可用性。

Swiper:容器组件,用于包裹多个子组件,并支持轮播显示。
Text/Image:作为Swiper的子组件,用于展示轮播内容。

Search:容器组件,用于处理搜索框,点击搜索事件等。

二:代码实现

1:底部导航

@Entry
@Component
struct Index {

  @State currentIndex: number = 0;   //表示索引页
  private tabsController: TabsController = new TabsController();


  @Builder TabSw

相关文章:

HarmonyOS开发商城首页实现

目录 一:功能概述 二:代码实现 三:效果图 一:功能概述 这一节我们主要在鸿蒙OS系统中实现的一个底部导航功能,并在首页底部使用TabSwitch组件进行导航切换。同时,首页采用Search组件实现商品搜索框,Scroll和Swiper组件实现图片轮播功能,以展示推荐内容或图片。 1:…...

QtQuick Text-文本样式

属性 Text项目的style属性可以设置文本的样式。 支持的文本样式有: Text.Normal(默认)Text.OutlineText.RaisedText.Sunken 示例 import QtQuickRow{spacing: 10padding: 10Text {font.pointSize: 40text: "Normal"}Text {font…...

人工智能未来展望

深入剖析人工智能:现状、挑战与未来展望 在当今这个日新月异的科技时代,人工智能(AI)无疑是最为耀眼的明星之一。它以其独特的魅力,正引领着一场前所未有的技术革命,深刻地改变着人类社会的方方面面。本文…...

Pymol开源版安装 新版 3.0 / 3.1 Windows安装Pymol开源版

PyMOL 简介 PyMOL 是一个开源的分子可视化系统,被广泛应用于结构生物学中。它允许用户可视化分子结构,并创建高质量的蛋白质、核酸和其他大分子的3D图像。多年来,PyMOL不断发展,新版本引入了更多的功能和改进。 PyMOL 3.0 / 3.1…...

记录一次环境的安装

目录 新添加的代码 代码解释 为啥ubuntu用debian软件源 为啥修改sources.list.d S权限意思 php缺少和数据库连接的模块 使用root登陆数据库1698错误 字段解释 auth_socket解释 使用root登陆数据库方法 详细解释 首先在安装的时候,有一个dockerfile文件&a…...

浏览器用户文件夹详解 - WebData(八)

1.WebData简介 1.1 什么是WebData文件? WebData文件是Chromium浏览器中用于存储用户表单数据、自动填充信息和支付信息的一个重要文件。每当用户在浏览器中填写表单或保存支付信息时,这些数据都会被记录在WebData文件中。通过这些记录,浏览…...

ijkplayer 自定义协议播放加密内容 Android

想对播放的音视频进行加密,防止资源被盗用,该怎么办呢? 这篇文章从自定义协议的角度来提供一中实现思路。在 ijkplayer 的基础上,通过实现自定义协议对文件进行解密。边解边播,以此为基础,还可以实现在线资…...

【kill】Centos/Linux 如何杀死那该死的进程?

简介 系统版本:Centos7.6 kill 命令发送指定的信号到指定的进程或者进程组。如果该信号没有指定,则发送SIGTERM信号(15),即终止信号。如果SIGTERM信号(15)无法终止,可使用SIGKILL&am…...

Cadence23学习笔记(十七)

吴老师的网站里面有很多cadence的开源项目,可以用来学习: 全志 H3 SOC 官方参考设计 DD3 16bitX2 原理图及PCB – 吴川斌的博客 (mr-wu.cn) cadence设置显示实时的走线长度: 在allegro进行布线时可以实时显示当先布线的实际长度有助于pcb的…...

WinFrom调用webapi接口方法及其应用实例

1.WinFrom调用webapi接口方法 最近项目要在winfrom项目中调用webAPI&#xff0c;故在网上查找资料&#xff0c;找到了一个WinFrom调用webapi接口的通用方法&#xff0c;关键代码&#xff1a; #region WinFrom调用webapi接口通用方法private async Task<string> InvokeWe…...

智能巡检企业级域名 SSL 证书

一、概述 SSL 证书是一种数字证书&#xff0c;用于在用户和服务器之间建立加密链接&#xff0c;确保数据传输的安全性&#xff0c;防止数据在传输过程中被截获或篡改。SSL 证书不仅保护了数据传输过程中的隐私和完整性&#xff0c;还可以帮助验证网站的身份&#xff0c;防止钓…...

海思35XX系列(三)sensor(传感器)

刚开始接触这个概念的时候感觉比较模糊&#xff0c;简单记录一下吧 Sensor&#xff08;传感器&#xff09;是一种可以感知外部环境并将感知到的信息转化为可用的电信号或其他形式的工具。传感器广泛应用于电子设备、工业自动化、汽车、医疗器械等领域&#xff0c;用于测量、监…...

dfs(续做)

1.混境之地5 #include<bits/stdc.h> using namespace std; typedef long long ll; const int dx[4] {0,1,0,-1}; const int dy[4] {1,0,-1,0}; int n,m,k,a,b,c,d,sign0; int h[1010][1010],visit[1010][1010]; void dfs(int x,int y,bool used) {if(xc&&yd){si…...

OpenStack;异构算力网络架构;算力服务与交易技术;服务编排与调度技术

目录 OpenStack 一、OpenStack概述 二、OpenStack的主要组件及功能 三、OpenStack的架构 四、OpenStack的应用场景 异构算力网络架构 算力服务与交易技术 服务编排与调度技术 OpenStack 是一个开源的云计算管理平台项目,由NASA(美国国家航空航天局)和Rackspace合作…...

PLC-Recorder对于数据采集时间戳偏差的修正功能

目录 一、修正原理 二、使用步骤 1、初始状态&#xff0c;计算修正系数 2、启动和使用 3、修正系数的手动修改 三、修正前后的效果对比 1、修正前的时间偏差曲线 2、修正后的效果曲线 四、注意事项 1、控制器可能的时钟波动 2、平移参数评估 3、参数保存 五、关于…...

自定义监控

代码说明&#xff1a; 导入必要的库 import time import psutil import GPUtil from prometheus_client import start_http_server, Summary, Counter, Gaugepsutil&#xff1a;用于获取系统的CPU、内存、磁盘和网络信息。GPUtil&#xff1a;用于获取GPU信息。prometheus_cli…...

关于使用php的mpdf插件遇到的一些问题

一.插件版本 "mpdf/mpdf": "^8.0", 二.报错&#xff1a;Undefined index: list_style_type 这个是插件无法识别 li 标签导致&#xff0c;生成pdf是加入下面代码 <style> li { list-style-type: none; list-style-image: none; list-style-positi…...

电脑截图,颜色变淡的问题解决

解决 Windows 11 在 HDR 模式下截图 Edge 浏览器界面时画面过曝的问题-腾讯云开发者社区-腾讯云 (tencent.com) 主要是浏览器用错了东西&#xff0c;调一下就好&#xff0c;详情看链接 联想拯救者y9000p为例&#xff0c;选择sRGB&#xff0c;就好啦&#xff0c;拜拜喽&#x…...

uniApp跳转外链

创建一个新的页面&#xff0c;在该页面中使用web-view组件加载外部URL&#xff1a;pages/web-view/web-view <template><view><uni-list><uni-list-itemtitle"打开外部链接"click"openExternalLink"></uni-list-item></…...

科技云报道:大模型引领技术浪潮,AI安全治理面临“大考”

科技云报道原创。 从文生文到文生图&#xff0c;再到文生视频&#xff0c;近年来&#xff0c;以ChatGPT、Sora等为代表的大模型引领了全球人工智能技术与产业的新一轮浪潮。2024年更是被业内称为大模型应用爆发元年。 年初&#xff0c;Sora横空出世验证了Scalling Law在视频生…...

Cadence Allegro新手必看:5个让你事半功倍的隐藏操作技巧(含快捷键)

Cadence Allegro新手必看&#xff1a;5个让你事半功倍的隐藏操作技巧&#xff08;含快捷键&#xff09; 刚接触Cadence Allegro的工程师们&#xff0c;是否经常被繁琐的操作流程困扰&#xff1f;在高速PCB设计领域&#xff0c;掌握几个关键技巧往往能让效率翻倍。不同于官方手册…...

热处理设备如何影响紧固件可靠性?6月上海紧固件展解析

2026上海紧固件专业展&#xff08;Fastener Expo Shanghai 2026&#xff09;将于2026年6月24日至26日在国家会展中心&#xff08;上海&#xff09;举行。作为紧固件行业具有国际影响力的重要平台之一&#xff0c;本届展会将重点呈现制造工艺与装备升级对产品质量的深远影响。其…...

重磅!AI应用架构师揭秘AI驱动虚拟世界构建底层架构

重磅&#xff01;AI应用架构师揭秘AI驱动虚拟世界构建底层架构 引入与连接&#xff1a;当虚拟世界有了"生命" 想象这样一个场景&#xff1a;2030年的某个清晨&#xff0c;你戴上轻便的AR眼镜&#xff0c;走进"数字都市"——一个与现实世界无缝融合的虚拟…...

告别Anchor和NMS:用PyTorch从零开始手搓DETR,理解Transformer如何颠覆目标检测

从零实现DETR&#xff1a;用Transformer重构目标检测范式 当YOLO和Faster R-CNN仍在目标检测领域占据主导地位时&#xff0c;Facebook Research在2020年提出的DETR(DEtection TRansformer)带来了一场范式革命。这个将Transformer引入计算机视觉的架构&#xff0c;彻底摒弃了沿用…...

掌握CREO转URDF全攻略:从理论到实践的机器人模型转换技术

掌握CREO转URDF全攻略&#xff1a;从理论到实践的机器人模型转换技术 【免费下载链接】creo2urdf Generate URDF models from CREO mechanisms 项目地址: https://gitcode.com/gh_mirrors/cr/creo2urdf 理论基础&#xff1a;为什么需要CREO到URDF的转换&#xff1f; 在…...

如何用MidScene.js轻松实现AI驱动的无代码自动化:新手完整指南

如何用MidScene.js轻松实现AI驱动的无代码自动化&#xff1a;新手完整指南 【免费下载链接】midscene Let AI be your browser operator. 项目地址: https://gitcode.com/GitHub_Trending/mid/midscene 你是否厌倦了每天重复点击网页、填写表单的枯燥工作&#xff1f;想…...

春秋云境CVE-2013-2251

1.阅读靶场介绍 这里得到的有用信息是Apache Struts 2.启动靶场 如下所示 3.poc 尝试在路径后构造.action的url 这里我试出来的是 https://eci-2ze7xm2tms3a876w7wv3.cloudeci1.ichunqiu.com:8080/index.action 发现能正常使用 下一步启动天狐工具箱&#xff08;想要的请…...

LFM2.5-1.2B-Thinking-GGUF实操手册:从supervisorctl重启到log定位全流程

LFM2.5-1.2B-Thinking-GGUF实操手册&#xff1a;从supervisorctl重启到log定位全流程 1. 平台概述 LFM2.5-1.2B-Thinking-GGUF是Liquid AI推出的轻量级文本生成模型&#xff0c;专为低资源环境优化设计。这个镜像内置了GGUF模型文件和llama.cpp运行时&#xff0c;提供了一个简…...

Llama-3.2V-11B-cot惊艳案例:从历史照片推理服饰/建筑年代一致性

Llama-3.2V-11B-cot惊艳案例&#xff1a;从历史照片推理服饰/建筑年代一致性 1. 项目简介 Llama-3.2V-11B-cot是一款基于Meta Llama-3.2V-11B-cot多模态大模型开发的高性能视觉推理工具。它针对双卡4090环境进行了深度优化&#xff0c;特别适合需要进行复杂视觉推理的场景。工…...

Python-UIAutomation-for-Windows开发实践:从demo到实际项目的完整指南

Python-UIAutomation-for-Windows开发实践&#xff1a;从demo到实际项目的完整指南 【免费下载链接】Python-UIAutomation-for-Windows (Donot use 3.7.6,3.8.1):snake:Python 3 wrapper of Microsoft UIAutomation. Support UIAutomation for MFC, WindowsForm, WPF, Modern U…...