【鸿蒙开发】饿了么页面练习

0. 整体结构

整体划分3部分。店铺部分，购物车部分，金额统计部分。使用 Stack 把3部分堆叠

0.1 整体页面 Index.ets

修改 Index.ets ，使用堆叠布局，并居底部对齐

import { ElShop } from '../components/ElShop'
import { ElShoppingCart } from '../components/ElShoppingCart'
import { ElSubtotal } from '../components/ElSubtotal'@Entry
@Component
struct Index {build() {Column() {Stack({ alignContent: Alignment.Bottom }) {ElShop()ElShoppingCart()ElSubtotal()}}.width("100%").height("100%")}
}

0.2 创建 ElShop 组件

创建 ElShop 店铺部分组件

@Component
export struct ElShop {build() {Column() {}.width("100%").height("100%").backgroundColor(Color.Red)}
}

0.3 创建 ElShoppingCart 组件 

创建购物车部分组件

@Component
export struct ElShoppingCart {build() {Column() {}.width("100%").height(300).backgroundColor(Color.Green)}
}

0.4 创建 ElSubtotal 组件 

创建金额统计部分组件

@Component
export struct ElSubtotal {build() {Column() {}.width("100%").height(80).backgroundColor(Color.Blue)}
}

0.5 创建 model

创建 models 文件夹，创建 Product.ets 文件

export class Product {id: number = 0name: string = ""positive_reviews: string = ""food_label_list: string[] = []price: number = 0picture: string = ""description: string = ""tag: string = ""monthly_sales: number = 0
}export class SelectedProduct extends Product {count: number = 0
}export class Category {id: number = 0name: string = ""foods: Product[] = []
}

1. 店铺部分

1.1 修改 ElShop 组件

划分 header，tabbar，body 三部分

Column [ ElShopHeader，ElShopTabbar，ElShopBody ]

import { ElShopHeader } from './ElShopHeader'
import { ElShopTabbar } from './ElShopTabbar'
import { ElShopBody } from './ElShopBody'@Component
export struct ElShop {build() {Column() {ElShopHeader()ElShopTabbar()ElShopBody()}.width("100%").height("100%").backgroundColor(Color.White)}
}

1.2 创建 ElShopHeader 组件

Row [ 返回图标，（搜索图标，文字），消息图标，喜欢图标，加号图标 ]

@Component
export struct ElShopHeader {build() {Row() {Image($r("app.media.left")).width(20).height(20).fillColor("#191919")Row() {Image($r('app.media.search')).width(14).aspectRatio(1).fillColor('#555').margin({ right: 5 })Text('搜一搜').fontSize(12).fontColor('#555')}.width(150).height(30).backgroundColor('#eee').borderRadius(15).padding({ left: 5, right: 5 })Image($r('app.media.message')).width(20).fillColor("#191919")Image($r('app.media.favor')).width(20).fillColor("#191919")Image($r("app.media.add")).width(20).fillColor("#191919")}.width('100%').height(60).backgroundColor('#fbfbfb').padding(10).justifyContent(FlexAlign.SpaceAround)}
}

1.3 创建 ElShopTabbar 组件

Row [ 点餐，评价，商家 ]

每一个tab用 @Builder 函数创建

@Component
export struct ElShopTabbar {@BuilderTabItem(active: boolean, title: string, subtitle?: string) {Column() {Text() {Span(title)if (subtitle) {Span(' ' + subtitle).fontSize(10).fontColor(active ? '#000' : '#666')}}.layoutWeight(1).fontColor(active ? '#000' : '#666').fontWeight(active ? FontWeight.Bold : FontWeight.Normal)Column().width(20).height(3).borderRadius(5).backgroundColor(active ? '#02B6FD' : 'transparent')}.alignItems(HorizontalAlign.Center).padding({ left: 15, right: 15 })}build() {Row() {this.TabItem(true, '点餐')this.TabItem(false, '评价', '196')this.TabItem(false, '商家')}.width("100%").height(40).justifyContent(FlexAlign.Start).backgroundColor('#fbfbfb')}
}

1.4 创建 ElShopBody 组件

这里分为左边分类列表，右边商品列表

Row [ 分类列表，商品列表 ]

import { ElShopCategory } from './ElShopCategory'
import { ElShopProduct } from './ElShopProduct'@Component
export struct ElShopBody {build() {Row() {ElShopCategory()ElShopProduct()}.width('100%').layoutWeight(1).alignItems(VerticalAlign.Top)}
}

1.5 创建 ElShopCategory 组件

分类列表，每一项是分类文字

import { Category } from '../models/Product'@Component
export struct ElShopCategory {@State categoryList: Category[] = [{ id: 1, name: '必点招牌', foods: [] },{ id: 2, name: '超值套餐', foods: [] },{ id: 3, name: '杂粮主食', foods: [] },]@State categoryIndex: number = 0build() {Column() {ForEach(this.categoryList, (item: Category, index: number) => {Text(item.name).width('100%').height(40).textAlign(TextAlign.Center).fontSize(12).backgroundColor(this.categoryIndex === index ? '#fff' : 'transparent').onClick(() => {this.categoryIndex = index})})}.width(90).height('100%').backgroundColor('#eee')}
}

1.6 创建 ElShopProduct 组件

商品列表，每一项是商品项

import { ElProductItem } from './ElProductItem'@Component
export struct ElShopProduct {build() {List({ space: 20 }) {ForEach([1, 2, 3, 4, 5, 6, 7, 8, 9], () => {ListItem() {ElProductItem()}})}.layoutWeight(1).backgroundColor('#fff').padding({ left: 10, right: 10 })}
}

1.7 创建 ElProductItem 组件

商品的每一项

Row [ 图片，内容 ]

@Component
export struct ElProductItem {build() {Row() {Image('https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fsafe-img.xhscdn.com%2Fbw1%2F67ba10b0-b4a0-4dd7-b343-31830e01b616%3FimageView2%2F2%2Fw%2F1080%2Fformat%2Fjpg&refer=http%3A%2F%2Fsafe-img.xhscdn.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1711612969&t=b2102c0d151f8225ba531caadf26dd6f').width(60).aspectRatio(1).borderRadius(8)Column({ space: 5 }) {Text('猪脚+肉卷+鸡蛋').fontSize(14).textOverflow({overflow: TextOverflow.Ellipsis}).maxLines(1)Text('用料：猪脚，肉卷，鸡蛋').fontSize(12).fontColor('#999').textOverflow({overflow: TextOverflow.Ellipsis}).maxLines(1)Row() {Text() {Span('¥ ').fontColor('#FF4B33').fontSize(10)Span('38.65').fontColor('#FF4B33').fontWeight(FontWeight.Bold)}// 商品数量操作}.justifyContent(FlexAlign.SpaceBetween).width('100%')}.layoutWeight(1).alignItems(HorizontalAlign.Start).justifyContent(FlexAlign.SpaceBetween).padding({ left: 10, right: 10 }).height(60)}.alignItems(VerticalAlign.Top)}
}

2. 金额统计部分

2.1 修改 ElSubtotal 组件

Row [ 购物车图标，金额文字，结算按钮 ]

@Component
export struct ElSubtotal {build() {Row() {Badge({count: 1,position: BadgePosition.RightTop,style: { badgeSize: 20 }}) {Image($r("app.media.shopping_cart_icon"))}.width(50).height(50).margin({ right: 10 })Column() {Text() {Span('¥').fontSize(14)Span('0').fontSize(24)}Text('另需配送费约 ¥3.3').fontSize(12).fontColor('#999')}.layoutWeight(1).alignItems(HorizontalAlign.Start)Button('去结算').fontSize(18).backgroundColor('#02B6FD').padding({ left: 30, right: 30 })}.width('100%').height(80).padding(10).alignItems(VerticalAlign.Center).backgroundColor(Color.White).border({color: "#f5f5f5",width: {top: "1"}})}
}

3. 购物车部分

给购物车内容的外层嵌套一个透明的遮罩

外层遮罩 Column [ Colunm( 标题，已选商品列表 ) ]

3.1 修改 ElShoppingCart 组件

import { ElProductItem } from './ElProductItem'@Component
export struct ElShoppingCart {build() {Column() {Column() {Row() {Text('已选商品').fontSize(13).fontWeight(600)Row() {Image($r("app.media.delete")).height(14).fillColor('#999').margin({ right: 5 })Text('清空').fontSize(13).fontColor('#999')}}.width('100%').justifyContent(FlexAlign.SpaceBetween).padding(15)List({ space: 20 }) {ForEach([1, 2, 3, 4], () => {ListItem() {ElProductItem()}})}.divider({strokeWidth: 1,color: '#ddd'}).padding({ left: 15, right: 15, bottom: 100 })}.backgroundColor('#fff').borderRadius({topLeft: 16,topRight: 16})}.width('100%').height('100%').justifyContent(FlexAlign.End).backgroundColor('rgba(0,0,0,0.5)')}
}

3.2 修改购物车显示隐藏

当点击底部统计部分才显示购物车部分

修改 Index.ets ，添加 showShoppingCart 属性

@Entry
@Component
struct Index {@State showShoppingCart: boolean = falsebuild() {Column() {Stack({ alignContent: Alignment.Bottom }) {ElShop()if (this.showShoppingCart) {ElShoppingCart()}ElSubtotal({ showShoppingCart: $showShoppingCart })}}.width("100%").height("100%")}
}

修改 ElSubtotal 金额统计部分组件，接受 showShoppingCart 属性

@Link showShoppingCart: boolean

修改 ElSubtotal 组件，添加点击事件修改 showShoppingCart 值

.onClick(() => {this.showShoppingCart = !this.showShoppingCart
})

 

4. 渲染商品数据

4.1 安装 live-server

使用 npm 全局安装 live-server 包

npm i live-server -g

在 elshop.json 文件夹启动 live-server

live-server

4.2 安装 axios

在项目中安装 axios

ohpm install @ohos/axios

4.3 获取 elshop.json 数据

修改 Index.ets，获取json数据

@Entry
@Component
struct Index {@State showShoppingCart: boolean = false@Provide categoryList: Category[] = []@Provide categoryIndex: number = 0aboutToAppear() {this.getData()}async getData() {const res = await axios.get("http://127.0.0.1:8080/elshop.json")const category = res.data.category.map(item => {const foods = item.foods.map(food => {return { ...food, count: 0 }})return { ...item, foods }})this.categoryList = category}
}

4.4 修改 ElShopCategory 组件

修改从祖先组件获取分类数据

@Component
export struct ElShopCategory {@Consume categoryIndex: number@Consume categoryList: Category[]
}

 4.5 修改 ElShopProduct 组件

修改从祖先组件获取分类数据，循环分类下的商品，并把 product 传给 ElProductItem 组件

import { Category, SelectedProduct } from '../models/Product'
import { ElProductItem } from './ElProductItem'@Component
export struct ElShopProduct {@Consume categoryIndex: number@Consume categoryList: Category[]build() {List({ space: 20 }) {ForEach(this.categoryList[this.categoryIndex]?.foods ?? [], (product: SelectedProduct) => {ListItem() {ElProductItem({ product })}})}.layoutWeight(1).backgroundColor('#fff').padding({ left: 10, right: 10 })}
}

 4.6 修改 ElProductItem 组件

修改 ElProductItem 组件，接收 product 数据

import { SelectedProduct } from '../models/Product'@Component
export struct ElProductItem {product: SelectedProductbuild() {Row() {Image(this.product.picture).width(60).aspectRatio(1).borderRadius(8)Column({ space: 5 }) {Text(this.product.name).fontSize(14).textOverflow({overflow: TextOverflow.Ellipsis}).maxLines(1)Text(this.product.description).fontSize(12).fontColor('#999').textOverflow({overflow: TextOverflow.Ellipsis}).maxLines(1)Row() {Text() {Span('¥ ').fontColor('#FF4B33').fontSize(10)Span(this.product.price.toString()).fontColor('#FF4B33').fontWeight(FontWeight.Bold)}// 商品数量操作}.justifyContent(FlexAlign.SpaceBetween).width('100%')}.layoutWeight(1).alignItems(HorizontalAlign.Start).justifyContent(FlexAlign.SpaceBetween).padding({ left: 10, right: 10 }).height(60)}.alignItems(VerticalAlign.Top)}
}

5. 商品数量操作

5.1 创建 utils/productUtil.ets 文件

为了持久化保存已选择的商品，把选中的商品保存到 AppStorage 中

  • 声明保存到 AppStoreage 的 key
  • 添加已选的商品 addProduct
  • 删除已选的商品 removeProduct
  • 清空已选的商品 cleartAllProduct
import { Product, SelectedProduct } from '../models/Product'export const SHOPPING_CART_KEY = "SHOPPING_CART"// 添加商品
export const addProduct = (product: Product) => {const products = JSON.parse(AppStorage.Get<string>(SHOPPING_CART_KEY) || '[]') as SelectedProduct[]const selectedProduct = products.find(item => item.id === product.id)if (selectedProduct) {selectedProduct.count++} else {products.push({ ...product, count: 1 })}AppStorage.Set<string>(SHOPPING_CART_KEY, JSON.stringify(products))
}// 删除商品
export const removeProduct = (id: number) => {const products = JSON.parse(AppStorage.Get<string>(SHOPPING_CART_KEY) || '[]') as SelectedProduct[]const index = products.findIndex(item => item.id === id)const selectedProduct = products[index]if (selectedProduct && selectedProduct.count > 0) {selectedProduct.count--if (selectedProduct.count <= 0) {products.splice(index, 1)}}AppStorage.Set<string>(SHOPPING_CART_KEY, JSON.stringify(products))
}// 清空商品
export const clearAllProduct = () => {AppStorage.Set<string>(SHOPPING_CART_KEY, "[]")
}

5.2 修改 Index.ets 文件

在 Index.ets 页面初始化持久化的数据

import { SHOPPING_CART_KEY } from '../utils/productUtil'PersistentStorage.PersistProp(SHOPPING_CART_KEY,"[]")

添加持久化的json数据属性，并监听更新变化

  @StorageLink(SHOPPING_CART_KEY)@Watch("update")productListJson: string = "[]"@Provide selectedProductList: SelectedProduct[] = []update() {this.selectedProductList = JSON.parse(this.productListJson)}

5.3 修改 ElShoppingCart 组件

接收已选中商品数据 selectedProductList

export struct ElShoppingCart {@Consume selectedProductList: SelectedProduct[]
}

并修改列表渲染，把 product 传给 ElProductItem 组件

List({ space: 20 }) {ForEach(this.selectedProductList, (product: SelectedProduct) => {ListItem() {ElProductItem({ product })}})
}

 给清空按钮添加事件

.onClick(() => {clearAllProduct()
})

5.4 创建 ElProductCount 商品数量组件

import { SelectedProduct } from '../models/Product'@Component
export struct ElProductCount {product: SelectedProductbuild() {Row({ space: 8 }) {Image($r('app.media.minus_circle')).width(14).aspectRatio(1).fillColor("#02B6FD")Text('0').fontSize(14)Image($r('app.media.plus_circle')).width(14).aspectRatio(1).fillColor("#02B6FD")}}
}

5.5 修改 ElProductItem 组件

在金额旁边添加数量组件

ElProductCount({ product:this.product })

5.6 修改 ElProductCount 组件

  • 接收 product 数据
  • 接收 selectedProductList 数据
  • 获取该商品的数量
  • 给图标绑定添加商品，删除商品的事件
import { SelectedProduct } from '../models/Product'
import { addProduct, removeProduct } from '../utils/productUtil'@Component
export struct ElProductCount {@Consume selectedProductList: SelectedProduct[]product: SelectedProductgetCount() {const selectedProduct = this.selectedProductList.find(item => item.id === this.product.id)return selectedProduct?.count || 0}build() {Row({ space: 8 }) {Image($r('app.media.minus_circle')).width(14).aspectRatio(1).fillColor("#02B6FD").onClick(() => {removeProduct(this.product.id)})Text(`${this.getCount()}`).fontSize(14)Image($r('app.media.plus_circle')).width(14).aspectRatio(1).fillColor("#02B6FD").onClick(() => {addProduct(this.product)})}}
}

5.7 修改 ElSubtotal 组件

  • 接收已选中商品 selectedProductList
  • 添加商品总数据方法
  • 添加商品总金额方法
@Component
export struct ElSubtotal {@Link showShoppingCart: boolean@Consume selectedProductList: SelectedProduct[]getTotalCount() {return this.selectedProductList.reduce((count, item) => {return count + item.count}, 0)}getTotalPrice() {return this.selectedProductList.reduce((price, item) => {return price + (item.count * item.price * 100)}, 0) / 100}
}

6. 文件

elshop.json文件

https://download.csdn.net/download/d312697510/89141677

icon图标

https://download.csdn.net/download/d312697510/89141683

git仓库地址

https://github.com/webdq/ElShop

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

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

C#版Facefusion ，换脸器和增强器

C#版Facefusion ，换脸器和增强器

C#版Facefusion &#xff0c;换脸器和增强器 目录 说明 效果 项目 调用代码 说明 Facefusion是一款最新的开源AI视频/图片换脸项目。是原来ROOP的项目的延续。项目官方介绍只有一句话&#xff0c;下一代换脸器和增强器。 代码实现参考 https://github.com/facefusion/f…
阅读更多...
软件工程及开发模型

软件工程及开发模型

根据希赛相关视频课程汇总整理而成&#xff0c;个人笔记&#xff0c;仅供参考。 软件工程的基本要素包括方法、工具和&#xff08;过程&#xff09; 方法&#xff1a;完成软件开发的各项任务的技术方法&#xff1b; 工具&#xff1a;运用方法而提供的软件工程支撑环境&#xff…
阅读更多...
基于STM32的RFID智能门锁系统

基于STM32的RFID智能门锁系统

本文针对RFID技术&#xff0c;着重研究了基于单片机的智能门锁系统设计。首先&#xff0c;通过链接4*4按键模块与主控STM32&#xff0c;实现了多种模式&#xff0c;包括刷卡开锁、卡号权限管理、密码开锁、修改密码、显示实时时间等功能。其次&#xff0c;采用RC522模块与主控S…
阅读更多...
【学习笔记十四】EWM发货流程概述及相关配置

【学习笔记十四】EWM发货流程概述及相关配置

一、EWM发货流程与ERP集成配置 1.将凭证类型从 ERP 系统映射至 EWM ERP交货单凭证类型LF映射到EWM凭证类型OUTB 2.从 ERP 系统映射项目类型至 EWM ERP交货单凭证类型+ERP交货单项目类型TAN映射到EWM项目类型是ODLV 3.定义出库交货的参数文件 ①定义外向交货处理的凭证类型OUT…
阅读更多...
Mamba论文笔记

Mamba论文笔记

Mamba论文 结合序列建模任务通俗地解释什么是状态空间模型&#xff1f;创新点和贡献 为什么Mamba模型擅长捕获long range dependencies&#xff1f; 结合序列建模任务通俗地解释什么是状态空间模型&#xff1f; 状态空间模型&#xff08;State Space Model, SSM&#xff09;是…
阅读更多...
举个栗子！Tableau 技巧（270）：用 Lookup 函数创建多 KPI 文本表

举个栗子！Tableau 技巧（270）：用 Lookup 函数创建多 KPI 文本表

在 Tableau 中&#xff0c;文本表常用于呈现明细数据。但其实&#xff0c;数据粉如果想在同一视图中查看多个数据指标&#xff0c;也可以用到文本表。 如下示例&#xff0c;是不是很直观的就可以查看&#xff1a;不同区域随时间推移的数据指标情况呢&#xff1f; 如何在 Tablea…
阅读更多...
app证书在设置在哪

app证书在设置在哪

根据近日工业和信息化部发布的《工业和信息化部关于开展移动互联网应用程序备案工作的通知》&#xff0c;相信不少要进行IOS平台App备案的朋友遇到了一个问题&#xff0c;就是apple不提供云管理式证书的下载&#xff0c;也就无法获取公钥及证书SHA-1指纹。 已经上架的应用不想重…
阅读更多...
Langchain入门到实战-第二弹

Langchain入门到实战-第二弹

Langchain入门到实战 Langchain快速入门官网地址Langchain概述Langchain调用大模型更新计划 Langchain快速入门 官网地址 声明: 由于操作系统, 版本更新等原因, 文章所列内容不一定100%复现, 还要以官方信息为准 https://python.langchain.com/Langchain概述 LangChain是一个…
阅读更多...
LOCK、ACC、ON、START的含义及正确使用

LOCK、ACC、ON、START的含义及正确使用

背景 前段时间在开发一个远程锁车的需求时&#xff0c;讨论到了电源状态的场景。由于初次进入汽车电子行业&#xff0c;对很多基础概念不清晰。当时听主机厂商的同事介绍一遍后&#xff0c;并不是很理解。于是趁着空闲&#xff0c;给自己充充电&#xff0c;也希望能够帮到有需…
阅读更多...
php：实现压缩文件上传、解压、文件更名、压缩包删除功能

php：实现压缩文件上传、解压、文件更名、压缩包删除功能

效果图 1.上传文件 2.压缩包文件 3.itemno1文件 4.上传到系统路径\ItemNo 5.更名后的itemno1文件(命名&#xff1a;当天日期六位随机数) 代码 <form action"<?php echo htmlspecialchars($_SERVER[PHP_SELF], ENT_QUOTES, UTF-8); ?>" method"post…
阅读更多...
Udio——革命性的AI音乐生成软件

Udio——革命性的AI音乐生成软件

Udio是一款革命性的AI音乐生成软件&#xff0c;由前谷歌DeepMind的顶尖AI研究人员和工程师共同创立&#xff0c;得到著名风险投资公司a16z的支持。它旨在为音乐爱好者和专业人士提供一个全新的音乐创作和分享平台。用户可以通过文本提示来生成音乐&#xff0c;支持广泛的音乐风…
阅读更多...
react项目规范新手教程

react项目规范新手教程

简介 React是一种流行的JavaScript库&#xff0c;用于构建用户界面。搭建一个React项目并不难&#xff0c;但确保项目的结构和配置正确可以帮助你更有效地开发和维护应用程序。以下是搭建React项目的一些步骤&#xff1a; 项目规范&#xff1a;项目中有一些开发规范和代码风格…
阅读更多...
OpenAI现已普遍提供带有视觉应用程序接口的GPT-4 Turbo

OpenAI现已普遍提供带有视觉应用程序接口的GPT-4 Turbo

OpenAI宣布&#xff0c;其功能强大的GPT-4 Turbo with Vision模型现已通过公司的API全面推出&#xff0c;为企业和开发人员将高级语言和视觉功能集成到其应用程序中开辟了新的机会。 PS&#xff1a;使用Wildcard享受不受网络限制的API调用&#xff0c;详情查看教程 继去年 9 月…
阅读更多...
【论文速读】| CovRL：基于覆盖引导的强化学习对LLM基础变异进行JavaScript引擎模糊测试

【论文速读】| CovRL：基于覆盖引导的强化学习对LLM基础变异进行JavaScript引擎模糊测试

本次分享论文为&#xff1a;CovRL: Fuzzing JavaScript Engines with Coverage-Guided Reinforcement Learning for LLM-based Mutation 基本信息 原文作者&#xff1a;Jueon Eom, Seyeon Jeong, Taekyoung Kwon 作者单位&#xff1a;延世大学、苏瑞软科技公司 关键词&#…
阅读更多...
Windows中通过cmd查看以保存的WiFi密码

Windows中通过cmd查看以保存的WiFi密码

#要以管理员身份运行CMD# 指令命令&#xff1a; netsh wlan show profiles 然后会列出所有保存的wifi。 #再执行netsh wlan show profile name"你想查看的WiFi名称" keyclear并回车# 命令中keyclear代表以明文显示密码 关键内容即为密码。
阅读更多...
异地组网怎么安装？

异地组网怎么安装？

异地组网安装是指在不同地域的多个设备之间建立网络连接&#xff0c;以便实现数据传输和协同工作的过程。在如今的数字化时代&#xff0c;异地组网安装已经成为了许多企业和组织所必需的一项技术。 天联的使用场景 在异地组网安装中&#xff0c;天联是一种常用的工具。它具有以…
阅读更多...
LiveNVR监控流媒体Onvif/RTSP功能-概览负载统计展示取流中、播放中、录像中点击柱状图快速定位相关会话

LiveNVR监控流媒体Onvif/RTSP功能-概览负载统计展示取流中、播放中、录像中点击柱状图快速定位相关会话

LiveNVR概览负载统计展示取流中、播放中、录像中点击柱状图快速定位相关会话 1、负载信息说明2、快速定位会话3、RTSP/HLS/FLV/RTMP拉流Onvif流媒体服务 1、负载信息说明 实时展示取流中、播放中、录像中等使用数目 取流中&#xff1a;当前拉流到平台的实时通道数目播放中&am…
阅读更多...
IPA第九届明星盛典 全球人气总冠军 梁悦源 循梦而来 荣耀加冕

IPA第九届明星盛典 全球人气总冠军 梁悦源 循梦而来 荣耀加冕

2024年1月 30 日-2月1日&#xff0c;魔都上海迎来了龙年第一场“少儿形体行业美育春晚”!由 IPA模特委员会主办的第九届少儿模特明星盛典全球总决赛圆满收官!近 2000 名少儿模特选手从五湖四海而来&#xff0c;决战寒假这场高水准&#xff0c;高人气&#xff0c;高荣誉的时尚竞…
阅读更多...
语音智能客服机器人有什么优势？ai机器人部署

语音智能客服机器人有什么优势？ai机器人部署

人工智能技术的进步&#xff0c;在不断的革新我们的工作和生活&#xff0c;同时&#xff0c;拥有人工智能技术的语音智能客服机器人在销售行业的工作熟悉程度也越来越好&#xff0c;那语音智能客服机器人有什么优势&#xff1f;我们一起来看看。 1、ASR语音文本转换 客户可通过…
阅读更多...
flutter material中的Icon组件的IconData 查阅

flutter material中的Icon组件的IconData 查阅

查阅 https://fonts.google.com/icons?selectedMaterialSymbolsOutlined:expand_less:FILL0;wght300;GRAD0;opsz24&icon.platformandroidhttps://fonts.google.com/icons?selectedMaterialSymbolsOutlined:expand_less:FILL0;wght300;GRAD0;opsz24&icon.platformand…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023