鴻蒙 List 組件解析:從基礎列表到高性能界面開發指南

一、引言:列表布局 —— 鴻蒙應用的數據展示中樞

在鴻蒙應用開發體系中,列表布局是處理結構化數據展示的核心場景。從新聞資訊的信息流、電商平臺的商品陳列到任務管理的待辦事項,幾乎所有中大型應用都依賴高效的列表組件實現數據可視化。鴻蒙提供的 List、ListItem、ListItemGroup 三件套組件,通過標準化的接口設計與分層架構,構建了一套完整的列表解決方案。本文將系統解析這三個組件的核心機制、進階用法與工程實踐,幫助開發者掌握高性能列表開發的鴻蒙范式。

二、核心組件架構與協作機制

2.1 組件層級與職責劃分

鴻蒙列表體系采用三層架構設計:

  • List:列表容器組件,負責整體布局控制、滾動管理與性能優化
  • ListItem:列表項原子單元,承載具體數據展示與交互邏輯
  • ListItemGroup:列表分組組件,實現數據邏輯分組與吸頂吸底效果

組件層級關系示意圖:

List
├─ ListItemGroup(分組容器)
│  ├─ ListItem(列表項1)
│  ├─ ListItem(列表項2)
├─ ListItem(獨立列表項)

2.2 核心技術優勢

  • 標準化交互模型:內置滑動刪除、選中狀態、編輯模式等通用交互
  • 高性能渲染引擎:支持懶加載、預渲染與虛擬列表優化
  • 語義化分組能力:通過 ListItemGroup 實現數據分層與視覺分組
  • 多端自適應:自動適配手機、平板、車機等不同設備的屏幕特性

三、List 組件:列表布局的總控制器

3.1 基礎接口與布局控制

// xxx.ets
import { ListDataSource } from './ListDataSource';@Entry
@Component
struct ListLanesExample {arr: ListDataSource = new ListDataSource([0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19]);@State alignListItem: ListItemAlign = ListItemAlign.Start;build() {Column() {List({ space: 20, initialIndex: 0 }) {LazyForEach(this.arr, (item: string) => {ListItem() {Text('' + item).width('100%').height(100).fontSize(16).textAlign(TextAlign.Center).borderRadius(10).backgroundColor(0xFFFFFF)}.border({ width: 2, color: Color.Green })}, (item: string) => item)}.height(300).width('90%').friction(0.6).border({ width: 3, color: Color.Red }).lanes({ minLength: 40, maxLength: 40 }).alignListItem(this.alignListItem).scrollBar(BarState.Off)Button('點擊更改alignListItem:' + this.alignListItem).onClick(() => {if (this.alignListItem == ListItemAlign.Start) {this.alignListItem = ListItemAlign.Center;} else if (this.alignListItem == ListItemAlign.Center) {this.alignListItem = ListItemAlign.End;} else {this.alignListItem = ListItemAlign.Start;}})}.width('100%').height('100%').backgroundColor(0xDCDCDC).padding({ top: 5 })}
}

3.2 滾動事件與交互控制

// ListDataSource.ets
export class ListDataSource implements IDataSource {private list: number[] = [];private listeners: DataChangeListener[] = [];constructor(list: number[]) {this.list = list;}totalCount(): number {return this.list.length;}getData(index: number): number {return this.list[index];}registerDataChangeListener(listener: DataChangeListener): void {if (this.listeners.indexOf(listener) < 0) {this.listeners.push(listener);}}unregisterDataChangeListener(listener: DataChangeListener): void {const pos = this.listeners.indexOf(listener);if (pos >= 0) {this.listeners.splice(pos, 1);}}// 通知控制器數據刪除notifyDataDelete(index: number): void {this.listeners.forEach(listener => {listener.onDataDelete(index);});}// 通知控制器添加數據notifyDataAdd(index: number): void {this.listeners.forEach(listener => {listener.onDataAdd(index);});}// 在指定索引位置刪除一個元素public deleteItem(index: number): void {this.list.splice(index, 1);this.notifyDataDelete(index);}// 在指定索引位置插入一個元素public insertItem(index: number, data: number): void {this.list.splice(index, 0, data);this.notifyDataAdd(index);}
}
// xxx.ets
import { ListDataSource } from './ListDataSource';@Entry
@Component
struct ListExample {private arr: ListDataSource = new ListDataSource([0, 1, 2, 3, 4, 5, 6, 7, 8, 9]);build() {Column() {List({ space: 20, initialIndex: 0 }) {LazyForEach(this.arr, (item: number) => {ListItem() {Text('' + item).width('100%').height(100).fontSize(16).textAlign(TextAlign.Center).borderRadius(10).backgroundColor(0xFFFFFF)}}, (item: string) => item)}.listDirection(Axis.Vertical) // 排列方向.scrollBar(BarState.Off).friction(0.6).divider({ strokeWidth: 2, color: 0xFFFFFF, startMargin: 20, endMargin: 20 }) // 每行之間的分界線.edgeEffect(EdgeEffect.Spring) // 邊緣效果設置為Spring.onScrollIndex((firstIndex: number, lastIndex: number, centerIndex: number) => {console.info('first' + firstIndex);console.info('last' + lastIndex);console.info('center' + centerIndex);}).onScrollVisibleContentChange((start: VisibleListContentInfo, end: VisibleListContentInfo) => {console.info(' start index: ' + start.index +' start item group area: ' + start.itemGroupArea +' start index in group: ' + start.itemIndexInGroup);console.info(' end index: ' + end.index +' end item group area: ' + end.itemGroupArea +' end index in group: ' + end.itemIndexInGroup);}).onDidScroll((scrollOffset: number, scrollState: ScrollState) => {console.info(`onScroll scrollState = ScrollState` + scrollState + `, scrollOffset = ` + scrollOffset);}).width('90%')}.width('100%').height('100%').backgroundColor(0xDCDCDC).padding({ top: 5 })}
}

?

3.3 性能優化屬性

屬性名稱類型功能描述
cachedCountnumber預加載相鄰項數量,默認值 5,提升滾動流暢度
itemSizenumber固定列表項高度,避免動態計算布局開銷
layoutWeightnumber彈性布局權重,配合 ListItem 使用
useVirtualizedboolean啟用虛擬列表模式,僅渲染可見區域(API 10+)

四、ListItem 組件:列表項的原子實現單元

4.1 基礎結構與樣式配置

// xxx.ets
export class ListDataSource implements IDataSource {private list: number[] = [];constructor(list: number[]) {this.list = list;}totalCount(): number {return this.list.length;}getData(index: number): number {return this.list[index];}registerDataChangeListener(listener: DataChangeListener): void {}unregisterDataChangeListener(listener: DataChangeListener): void {}
}@Entry
@Component
struct ListItemExample {private arr: ListDataSource = new ListDataSource([0, 1, 2, 3, 4, 5, 6, 7, 8, 9]);build() {Column() {List({ space: 20, initialIndex: 0 }) {LazyForEach(this.arr, (item: number) => {ListItem() {Text('' + item).width('100%').height(100).fontSize(16).textAlign(TextAlign.Center).borderRadius(10).backgroundColor(0xFFFFFF)}}, (item: string) => item)}.width('90%').scrollBar(BarState.Off)}.width('100%').height('100%').backgroundColor(0xDCDCDC).padding({ top: 5 })}
}

4.2 交互能力實現

    ListItem().selectable(true)        // 可選中狀態.selected($$this.isSelected)   // 雙向綁定選中狀態.onSelect((selected: boolean) => {// 選中狀態變更回調console.log(`選中狀態: ${selected}`);}).swipeAction({          // 滑動操作end: {                // 向右滑動顯示builder: () => Row()}})

4.3 卡片樣式優化(API 10+)

// xxx.ets
@Entry
@Component
struct ListItemExample3 {build() {Column() {List({ space: '4vp', initialIndex: 0 }) {ListItemGroup({ style: ListItemGroupStyle.CARD }) {ForEach([ListItemStyle.CARD, ListItemStyle.CARD, ListItemStyle.NONE], (itemStyle: number, index?: number) => {ListItem({ style: itemStyle }) {Text('' + index).width('100%').textAlign(TextAlign.Center)}})}ForEach([ListItemStyle.CARD, ListItemStyle.CARD, ListItemStyle.NONE], (itemStyle: number, index?: number) => {ListItem({ style: itemStyle }) {Text('' + index).width('100%').textAlign(TextAlign.Center)}})}.width('100%').multiSelectable(true).backgroundColor(0xDCDCDC)}.width('100%').padding({ top: 5 })}
}

五、ListItemGroup 組件:列表的邏輯分組器

5.1 分組結構與吸頂效果

// ListDataSource.ets
export class TimeTableDataSource implements IDataSource {private list: TimeTable[] = [];private listeners: DataChangeListener[] = [];constructor(list: TimeTable[]) {this.list = list;}totalCount(): number {return this.list.length;}getData(index: number): TimeTable {return this.list[index];}registerDataChangeListener(listener: DataChangeListener): void {if (this.listeners.indexOf(listener) < 0) {this.listeners.push(listener);}}unregisterDataChangeListener(listener: DataChangeListener): void {const pos = this.listeners.indexOf(listener);if (pos >= 0) {this.listeners.splice(pos, 1);}}// 通知控制器數據變化notifyDataChange(index: number): void {this.listeners.forEach(listener => {listener.onDataChange(index);});}// 修改第一個元素public change1stItem(temp: TimeTable): void {this.list[0] = temp;this.notifyDataChange(0);}
}export class ProjectsDataSource implements IDataSource {private list: string[] = [];constructor(list: string[]) {this.list = list;}totalCount(): number {return this.list.length;}getData(index: number): string {return this.list[index];}registerDataChangeListener(listener: DataChangeListener): void {}unregisterDataChangeListener(listener: DataChangeListener): void {}
}export interface TimeTable {title: string;projects: string[];
}
// xxx.ets
import { TimeTable, ProjectsDataSource, TimeTableDataSource } from './ListDataSource';
@Entry
@Component
struct ListItemGroupExample {itemGroupArray: TimeTableDataSource = new TimeTableDataSource([]);aboutToAppear(): void {let timeTable: TimeTable[] = [{title: '星期一',projects: ['語文', '數學', '英語']},{title: '星期二',projects: ['物理', '化學', '生物']},{title: '星期三',projects: ['歷史', '地理', '政治']},{title: '星期四',projects: ['美術', '音樂', '體育']}];this.itemGroupArray = new TimeTableDataSource(timeTable);}@BuilderitemHead(text: string) {Text(text).fontSize(20).backgroundColor(0xAABBCC).width('100%').padding(10)}@BuilderitemFoot(num: number) {Text('共' + num + '節課').fontSize(16).backgroundColor(0xAABBCC).width('100%').padding(5)}build() {Column() {List({ space: 20 }) {LazyForEach(this.itemGroupArray, (item: TimeTable) => {ListItemGroup({ header: this.itemHead(item.title), footer: this.itemFoot(item.projects.length) }) {LazyForEach(new ProjectsDataSource(item.projects), (project: string) => {ListItem() {Text(project).width('100%').height(100).fontSize(20).textAlign(TextAlign.Center).backgroundColor(0xFFFFFF)}}, (item: string) => item)}.divider({ strokeWidth: 1, color: Color.Blue }) // 每行之間的分界線})}.width('90%').sticky(StickyStyle.Header | StickyStyle.Footer).scrollBar(BarState.Off)}.width('100%').height('100%').backgroundColor(0xDCDCDC).padding({ top: 5 })}
}

5.2 分組布局規則

  • 垂直布局:ListItemGroup 高度由內容自動計算,禁止顯式設置 height
  • 水平布局:寬度由內容自動計算,禁止顯式設置 width
  • 性能優化:分組內 ListItem 共享滾動上下文,減少內存占用
  • 交互限制:分組頭部 / 尾部不支持滑動操作,僅內容區支持

六、實戰案例:從基礎到復雜的列表開發

6.1 新聞資訊垂直列表

@Entry
@Component
struct NewsFeed {// 使用類替代接口定義數據模型@State newsData: NewsItem[] = generateNews(20) // 生成模擬數據private dataSource: NewsDataSource = new NewsDataSource(this.newsData)build() {List({ space: 12 }) {// 使用正確的LazyForEach語法LazyForEach(this.dataSource, (item: NewsItem) => {ListItem() {Column() {Image(item.image).width('100%').height(180).objectFit(ImageFit.Cover).borderRadius(4)Text(item.title).fontSize(16).fontWeight(FontWeight.Medium).margin({ top: 8, bottom: 4 }).maxLines(2).textOverflow({ overflow: TextOverflow.Ellipsis })Text(item.summary).fontSize(14).fontColor('#666666').lineHeight(20).maxLines(2).textOverflow({ overflow: TextOverflow.Ellipsis })}.padding(16).backgroundColor('#FFFFFF').borderRadius(8)}}, (item: NewsItem) => item.id) // 唯一鍵}.width('100%').height('100%').onReachEnd(() => this.loadMoreNews()) // 滾動到底部加載更多.cachedCount(8) // 預加載8項.divider({ strokeWidth: 0.5, color: '#EEEEEE' }) // 添加分割線}// 加載更多數據private loadMoreNews() {const newItems = generateNews(10)this.newsData = this.newsData.concat(newItems)this.dataSource.updateData(this.newsData)}
}// 實現LazyForEach所需的數據源
class NewsDataSource implements IDataSource {private data: NewsItem[] = []private listeners: DataChangeListener[] = []constructor(data: NewsItem[]) {this.data = data}// 更新數據源updateData(newData: NewsItem[]) {this.data = newDatathis.notifyDataReload()}// 通知數據變化private notifyDataReload() {this.listeners.forEach(listener => listener.onDataReloaded())}totalCount(): number {return this.data.length}getData(index: number): NewsItem {return this.data[index]}registerDataChangeListener(listener: DataChangeListener): void {this.listeners.push(listener)}unregisterDataChangeListener(listener: DataChangeListener): void {const index = this.listeners.indexOf(listener)if (index !== -1) {this.listeners.splice(index, 1)}}
}// 新聞數據模型
class NewsItem {id: string = ''title: string = ''summary: string = ''image: Resource = $r('app.media.default_news') // 默認圖片資源
}// 模擬數據生成函數
function generateNews(count: number): NewsItem[] {const result: NewsItem[] = []for (let i = 0; i < count; i++) {result.push({id: `news_${Date.now()}_${i}`,title: `新聞標題 ${i + 1}`,summary: `這是新聞摘要內容,展示了ArkTS新聞列表的實現方式...`,image: $r('app.media.news_image') // 實際項目中替換為真實資源})}return result
}

6.2 任務管理分組列表

@Entry
@Component
struct TaskManager {// 任務分組數據模型@State tasks: TaskGroup[] = [{title: '今日待辦',items: [{ id: '1', title: '完成工作報告', completed: false },{ id: '2', title: '準備會議材料', completed: false }]},{title: '已完成',items: [{ id: '3', title: '晨跑鍛煉', completed: true },{ id: '4', title: '回復郵件', completed: true }]}]// 更新任務狀態private updateTaskStatus(groupIndex: number, itemIndex: number, checked: boolean) {this.tasks[groupIndex].items[itemIndex].completed = checked// 創建新數組觸發UI更新this.tasks = [...this.tasks]}// 分組頭部構建器@BuildergroupHeaderBuilder(title: string) {Text(title).fontSize(18).fontWeight(FontWeight.Bold).padding({ top: 20, bottom: 12, left: 16 }).width('100%').backgroundColor('#f5f5f5')}build() {List({ space: 8 }) {ForEach(this.tasks, (group: TaskGroup, groupIndex: number) => {ListItemGroup({ header: this.groupHeaderBuilder(group.title) }) {ForEach(group.items, (task: TaskItem, itemIndex: number) => {ListItem() {Row() {Checkbox().onChange((checked: boolean) => {this.updateTaskStatus(groupIndex, itemIndex, checked)})Text(task.title).margin({ left: 8 }).fontSize(16)}.padding(16).width('100%')}.borderRadius(8).margin({ bottom: 8 }).backgroundColor('#FFFFFF')}, (task: TaskItem) => task.id)}}, (group: TaskGroup) => group.title)}.width('100%').height('100%').divider({ strokeWidth: 0 }) // 隱藏分割線.listDirection(Axis.Vertical)}
}// 數據模型定義
class TaskGroup {title: string = ''items: TaskItem[] = []
}class TaskItem {id: string = ''title: string = ''completed: boolean = false
}

七、工程實踐最佳指南

7.1 性能優化策略

虛擬列表實現
 List() {// 虛擬列表不需要子組件}.width('100%').height('100%').cachedCount(10)  // 預加載項數.onScrollIndex((start, end) => {// 滾動事件處理(可選)console.log(`當前可見項: ${start}-${end}`)})
長列表優化組合
List()
.cachedCount(10) // 預加載10項

7.2 兼容性處理方案

API 分級適配
#if (API >= 9)List().editMode(true).onItemDelete((index) => {// 新API編輯邏輯})
#elseList().onClick((index) => {// 舊API模擬編輯邏輯})
#endif
多端布局適配
List()
.listDirection(DeviceType.isTablet() ? Axis.Horizontal : Axis.Vertical
)
.then((list) => {if (DeviceType.isPhone()) {list.itemSize(80)} else {list.itemSize(100)}
})

7.3 常見問題解決方案

問題場景解決方案
列表滾動卡頓1. 啟用虛擬列表模式 .useVirtualized (true)
2. 設置固定項高度 .itemSize (80)
分組頭部不吸頂確認 .sticky (StickyStyle.Header) 已設置,且 List 為垂直布局
滑動刪除無響應1. 檢查 API 版本是否≥9
2. 確保 actionAreaDistance < ListItem 寬度
選中狀態不同步使用雙向綁定 .selected ($isSelected),避免直接操作狀態變量
列表項點擊穿透在最外層容器添加 .onClick (() => {}) 消耗點擊事件

八、總結:三層架構構建高效列表體系

鴻蒙 List 組件體系通過 List、ListItem、ListItemGroup 的三層架構,為開發者提供了完整的列表解決方案:

  1. List 容器:負責整體布局控制、滾動管理與性能優化,是列表的總控制器
  2. ListItem 單元:承載數據展示與交互邏輯,是列表的原子組件
  3. ListItemGroup 分組:實現數據邏輯分組與吸頂效果,提升復雜列表的信息層級

在實際開發中,建議遵循以下最佳實踐:

  • 長列表優先使用 LazyForEach + 虛擬列表模式
  • 復雜數據采用 ListItemGroup 進行語義化分組
  • 交互操作通過組件內置 API 實現,避免自定義事件系統
  • 多端適配結合 DeviceType 與條件編譯實現

隨著鴻蒙生態向全場景拓展,列表組件將持續進化,未來版本可能加入 AI 驅動的布局優化、3D 滾動效果等創新功能。建議開發者從基礎案例入手,結合 DevEco Studio 的實時預覽與性能調試工具,逐步掌握列表開發的核心技巧,為用戶打造流暢、高效的數據瀏覽體驗

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/pingmian/86406.shtml
繁體地址,請注明出處:http://hk.pswp.cn/pingmian/86406.shtml
英文地址,請注明出處:http://en.pswp.cn/pingmian/86406.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

原生微信小程序中限制多選框(Checkbox)可選個數的實現詳解

在實際業務場景中&#xff0c;我們經常會遇到表單中的復選框多選限制需求。例如最多只能選擇 3 個愛好、標簽、興趣點等&#xff0c;這時就需要在微信小程序中手動控制 Checkbox 的選擇行為。 本文將通過一個完整的示例&#xff0c;演示如何實現最多只能選擇 N 個的 Checkbox …

OpenCV CUDA模塊設備層-----線性插值函數log()

操作系統&#xff1a;ubuntu22.04 OpenCV版本&#xff1a;OpenCV4.9 IDE:Visual Studio Code 編程語言&#xff1a;C11 算法描述 該函數用于創建線性插值訪問器&#xff0c;支持對GPU內存中的圖像數據進行雙線性插值采樣。主要應用于圖像縮放、旋轉等幾何變換中需要亞像素級精…

Redis 單線程的“天花板”與集群的必要性

雖然 Redis 以其單線程模型&#xff08;主要是處理請求的核心邏輯&#xff09;帶來了極高的性能和簡潔性&#xff0c;但這并不意味著它沒有瓶頸。 CPU 瓶頸&#xff1a;當業務邏輯復雜&#xff0c;或者 Redis 執行大量計算密集型操作&#xff08;比如使用 Lua 腳本進行復雜處理…

16.7 Prometheus+Grafana實戰:容器化監控與日志聚合一站式解決方案

《Prometheus+Grafana實戰:容器化監控與日志聚合一站式解決方案》 關鍵詞:容器化監控、日志聚合、Prometheus、Grafana、ELK Stack、用戶反饋收集 容器化監控與日志系統的架構設計 在 LanguageMentor Agent 生產部署中,監控系統需要覆蓋以下維度: #mermaid-svg-I7cOqUK0i…

商務創業項目策劃計劃書PPT模版

創業商業融資計劃書PPT模版&#xff0c;商務商業計劃融資書PPT模版&#xff0c;創業融資計劃書PPT模版&#xff0c;框架完整創業融資計劃書PPT模版 商務創業項目策劃計劃書PPT模版&#xff1a;https://pan.quark.cn/s/d07d22408497

【軟考高級系統架構論文】論面向方面的編程技術及其應用

論文真題: 請圍繞“論軟件測試中缺陷管理及其應用”論題,依次從以下三個方面進行論述: 概要敘述你參與管理和開發的軟件項目以及承擔的工作。詳細論述常見的缺陷種類及級別,論述缺陷管理的基本流程。結合你具體參與管理和開發的實際項目,說明是如何進行缺陷管理的。請具體…

人機協作新范式:GEO與COKE框架的融合應用與品牌大模型種草實踐

在人工智能迅猛發展的今天&#xff0c;我們正經歷著人機關系的根本性重構。從工具性使用到協作伙伴關系&#xff0c;AI正在以前所未有的方式融入企業運營和品牌建設的各個環節。尤其是在品牌傳播領域&#xff0c;“品牌大模型種草”正在成為品牌實現優質曝光和用戶信任構建的新…

速通KVM(云計算學習指南)

第一章 云端的變形金剛&#xff1a;KVM的云計算基因 1.1 云計算與KVM的共生關系 想象一下&#xff0c;你有一臺魔法服務器&#xff0c;它能像變形金剛一樣隨時分解成多臺獨立的小服務器&#xff0c;又能瞬間合體恢復原狀——這就是KVM在云計算中扮演的角色。作為Linux內核的原…

C#最佳實踐:為何優先使用隱式類型

C#最佳實踐:為何優先使用隱式類型 在C#的編程世界里,類型聲明是編寫代碼的重要環節。從早期嚴格指定變量類型,到引入隱式類型var,編程方式發生了不小的變革。隱式類型并非簡單的語法糖,合理使用它能讓代碼更簡潔、更易讀,還能適應復雜的編程場景。接下來,我們就深入探討…

PG靶機復現 Squid

官方定義為easy級別&#xff0c;因為省略了提權階段&#xff0c;這個靶機主要是利用3128 Squid服務 枚舉 通過nmap掃描到3128端口開啟。 Squid 是一個緩存和轉發的 HTTP 網絡代理。它有多種用途&#xff0c;包括通過緩存重復請求來加速 web 服務器&#xff0c;為共享網絡資源…

Java底層原理:深入理解JVM類加載機制與反射機制

一、JVM類加載機制 JVM類加載機制是Java運行時環境的重要組成部分&#xff0c;它負責將字節碼文件加載到JVM內存中&#xff0c;并將其轉換為可執行的類。類加載機制的實現涉及類加載器&#xff08;ClassLoader&#xff09;、類加載過程和類加載器的層次結構。 &#xff08;一…

系統思考:結構影響行為

感謝今天參與沙龍伙伴的評價&#xff0c;雖然只有短短半天的時間&#xff0c;希望今天的交流能為大家帶來一些思考的火花。真正的改變&#xff0c;往往不僅來自一次啟發&#xff0c;更來自一個支持改變的結構。 就像系統思考中所說的&#xff1a;“結構影響行為。”如果我們希望…

Ubuntu 20.04 系統上運行 SLAM卡頓是什么原因

在 Ubuntu 20.04 系統上運行 SLAM&#xff08;Simultaneous Localization and Mapping&#xff09;數據集時出現卡頓&#xff0c;可能是由硬件、軟件配置或數據集處理需求等多方面原因導致。以下是一些可能的原因和解決建議&#xff1a; 1. 硬件性能瓶頸 盡管你使用的是 NVID…

Starwind商用共享存儲解決方案——安裝篇

介紹 StarWind 是一家提供虛擬化和存儲解決方案的軟件公司&#xff0c;主要專注于為中小企業&#xff08;SME&#xff09;和遠程辦公室/分支機構&#xff08;ROBO&#xff09;環境提供高性價比的虛擬化存儲解決方案。其核心產品包括 StarWind Virtual SAN 和 StarWind NAS 等&…

Unity | AmplifyShaderEditor插件基礎(第十集:噪聲的種類+火焰制作-中)

一、&#x1f44b;&#x1f3fb;前言 你現在看見的是一套非常系統的ASE入門學習教程&#xff0c;并不是心血來潮隨心創作的。 up原來是初中物理老師&#xff08;有教師資格證&#xff09;后轉入程序行業&#xff0c;認真學習過課程設計等相關知識&#xff0c;只要你認真的學每一…

從零開始的二三維CAD|CAE輕量級軟件開發:學習以及研發,Gmsh的腳本編輯器設計!

背景: 痛點: 1.編寫.geo腳本, 沒有智能提示很頭大; 2.沒有高亮顯示很頭大! 在數值仿真過程中,大家離不開gmsh這個軟件,而在學習的過程中,也離不開要編寫.geo腳本, 寫這種腳本麻煩的要死,那么多腳本函數要記? 反正寫的很頭大, 所以,既然為了方便大家,也為了方便自己,不如自…

ModerationModel溫和模式

ModerationModel能夠對內容進?合規檢測&#xff0c;屏蔽那些不合規的內容。未來如果你的?模型應?需要對外提供 服務時&#xff0c;合規就是?個必須的標準。 1、代碼 import dev.langchain4j.model.moderation.Moderation; import dev.langchain4j.model.moderation.Modera…

OpenDeepWiki:AI代碼對話新紀元

OpenDeepWiki 現已支持更智能的多輪對話能力&#xff0c;讓您可以與代碼庫進行深入交流&#xff0c;像與真人對話一樣理解代碼邏輯和架構。新的對話系統能夠保持上下文連貫性&#xff0c;理解復雜查詢&#xff0c;并提供更精準的回答。 系統接入能力 現在您可以輕松將 OpenDeep…

Ubuntu安裝Docker部署Python Flask Web應用

一、Ubuntu安裝Docker 下面是具體的步驟&#xff1a; 1.準備條件:安裝前先卸載操作系統默認安裝的docker&#xff0c;再安裝必要支持。 #安裝前先卸載操作系統默認安裝的docker&#xff0c; sudo apt-get remove docker docker-engine docker.io containerd runc#安裝必要支持…

7. 實現接口多重斷言pytest-assume

pytest-assume 終極指南&#xff1a;實現多重斷言的無縫驗證 在自動化測試中&#xff0c;單個測試往往需要驗證多個條件。本文將深入解析如何通過pytest-assume插件優雅解決多重斷言問題。 一、為什么需要多重斷言&#xff1f; 傳統斷言的局限性 def test_user_profile():use…