maui中实现加载更多 RefreshView跟ListView(2)
一个类似商品例表的下拉效果:
代码
新增个类为商品商体类
public class ProductItem{public string ImageSource { get; set; }public string ProductName { get; set; }public string Price { get; set; }}
界面代码:
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"xmlns:d="http://schemas.microsoft.com/dotnet/2021/maui/design"xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"mc:Ignorable="d"BackgroundColor="{DynamicResource PageBackgroundColor}"x:Class="fenye.MainPage"><RefreshView IsRefreshing="{Binding IsRefreshing}" Command="{Binding RefreshCommand}"><StackLayout Margin="10"><ListView ItemsSource="{Binding Items}" ItemAppearing="OnItemAppearing" RowHeight="70" Margin="20"><ListView.ItemTemplate><DataTemplate><ViewCell><Grid><Grid.ColumnDefinitions><ColumnDefinition Width="Auto" /><!-- 第一列宽度自适应 --><ColumnDefinition Width="*" /><!-- 第二列宽度填充剩余空间 --></Grid.ColumnDefinitions><!-- 左侧图片 --><Image Source="{Binding ImageSource}" Aspect="AspectFit"WidthRequest="150"HeightRequest="150" Grid.Column="0" /><!-- 右侧商品名和价格 --><StackLayout Grid.Column="1" Margin="10"><Label Text="{Binding ProductName}" FontAttributes="Bold"FontSize="18"/><Label Text="{Binding Price}" FontSize="16" TextColor="Green"/></StackLayout></Grid></ViewCell></DataTemplate></ListView.ItemTemplate></ListView></StackLayout></RefreshView>
</ContentPage>
后端代码:
using System;
using System.Collections.ObjectModel;
using System.Threading.Tasks;
using Microsoft.Maui.Controls;
using Microsoft.Maui.Controls.Xaml;
using System.ComponentModel;
using System.Runtime.CompilerServices;namespace fenye
{public class ProductItem{public string ImageSource { get; set; }public string ProductName { get; set; }public string Price { get; set; }}// 标记 XAML 编译选项[XamlCompilation(XamlCompilationOptions.Compile)]public partial class MainPage : ContentPage{// 数据源,用于存储列表项的集合private ObservableCollection<ProductItem> _items;// 是否正在刷新的标志private bool _isRefreshing;public ObservableCollection<ProductItem> Items => _items;// 随机数生成器private Random _random = new Random();// 各类水果数组private string[] fruits = { "苹果", "香蕉", "橙子", "葡萄", "草莓", "梨", "桃子", "西瓜", "蓝莓", "樱桃" };// 构造函数,初始化页面public MainPage(){InitializeComponent();BindingContext = this;// 初始化数据源并填充一些初始数据_items = new ObservableCollection<ProductItem>();for (int i = 0; i < 20; i++){AddNewItem();}// 通知界面数据源已更新OnPropertyChanged(nameof(Items));}// 数据源的公共属性// 是否正在刷新的属性,并使用 SetProperty 方法实现属性更改通知public bool IsRefreshing{get => _isRefreshing;set => SetProperty(ref _isRefreshing, value);}// 刷新命令,绑定到下拉刷新控件public Command RefreshCommand => new Command(async () => await OnRefresh());// 下拉刷新事件处理方法private async Task OnRefresh(){// 开始刷新IsRefreshing = true;// 模拟异步操作(例如,从网络加载数据)await Task.Delay(2000);// 在主线程上更新 UIawait MainThread.InvokeOnMainThreadAsync(() =>{// 添加新的列表项for (int i = 0; i < 10; i++){AddNewItem();}// 结束刷新IsRefreshing = false;});}// 列表项即将可见事件处理方法private async void OnItemAppearing(object sender, ItemVisibilityEventArgs e){// 检查是否即将显示最后一个列表项,触发加载更多if (e.Item == _items[_items.Count - 1]){await LoadMoreItems();}}// 加载更多的方法private async Task LoadMoreItems(){// 模拟加载更多数据的异步操作await Task.Delay(2000);// 在主线程上更新 UIawait MainThread.InvokeOnMainThreadAsync(() =>{// 添加更多新的列表项for (int i = 0; i < 10; i++){AddNewItem();}IsRefreshing = false;});}private void AddNewItem(){string randomFruit = fruits[_random.Next(fruits.Length)];_items.Add(new ProductItem{ImageSource = "dotnet_bot.png", // 替换为实际的图片路径ProductName = $"{randomFruit}: {_items.Count}",Price = $"价格: {_random.NextDouble() * 100:F2} 元"});}// 通用方法,用于设置属性并触发属性更改通知protected bool SetProperty<T>(ref T backingStore, T value,[CallerMemberName] string propertyName = "",Action onChanged = null){if (EqualityComparer<T>.Default.Equals(backingStore, value))return false;backingStore = value;onChanged?.Invoke();OnPropertyChanged(propertyName);return true;}}
}相关文章:
maui中实现加载更多 RefreshView跟ListView(2)
一个类似商品例表的下拉效果: 代码 新增个类为商品商体类 public class ProductItem{public string ImageSource { get; set; }public string ProductName { get; set; }public string Price { get; set; }}界面代码: <?xml version"1.0&quo…...
win10环境下git安装和基础操作
简述 关于git的作用就不多赘述了,配合GitHub,达到方便人们日常项目维护和管理,每一次项目增删改查都可以看的清清楚楚,方便团队协作和个人项目日常维护。 下载git 首先我们自然是要到官网下载git,下载地址为https:/…...
将yolo格式转化为voc格式:txt转xml(亲测有效)
1.文件目录如下所示: 对以上目录的解释: 1.dataset下面的image文件夹:里面装的是数据集的原图片 2.dataset下面的label文件夹:里面装的是图片对应得yolo格式标签 3.dataset下面的Annotations文件夹:这是一个空文件夹&…...
字符串 - 541.反转字符串II(C#和C实现)
字符串 - 541.反转字符串II(C#和C实现) 题目描述 给定一个字符串 s 和一个整数 k,你需要对从字符串开头算起的每隔 2k 个字符的前 k 个字符进行反转。 如果剩余字符少于 k 个,则将剩余字符全部反转。如果剩余字符小于 2k 但大于或等于 k 个࿰…...
机器视觉技术与应用实战(开运算、闭运算、细化)
开运算和闭运算的基础是膨胀和腐蚀,可以在看本文章前先阅读这篇文章机器视觉技术与应用实战(Chapter Two-04)-CSDN博客 开运算:先腐蚀后膨胀。开运算可以使图像的轮廓变得光滑,具有断开狭窄的间断和消除细小突出物的作…...
云原生之深入解析云原生架构的日志监控
一、什么是云原生架构的日志监控? 云原生架构的日志监控要求现代 Web 应用程序采用与传统应用程序略有不同的方法。部分原因是应用程序环境要复杂得多,包括从微服务中获取数据、使用 Kubernetes 和其他容器技术,以及在许多情况下集成开源组件…...
基于hfl/rbt3模型的情感分析学习研究——文本挖掘
参考书籍《HuggingFace自然语言处理详解 》 什么是文本挖掘 文本挖掘(Text mining)有时也被称为文字探勘、文本数据挖掘等,大致相当于文字分析,一般指文本处理过程中产生高质量的信息。高质量的信息通常通过分类和预测来产生&…...
计算机网络基础——常用的中英文网络述语大全,强烈建议收藏
系统网络体系结构(System Network Architecture,SNA) 国际标准化组织(International Organization for Standardization,ISO) 开放系统互连基本参考模型(Open System Interconnection Reference Model。OSI/RM) 物理层(Physical Layer) 数据终端设备…...
c++如何自定义类及成员函数
#include <iostream>using namespace std;class Box {public:double length; // 长度double breadth; // 宽度double height; // 高度// 成员函数声明double get(void);void set( double len, double bre, double hei ); }; // 成员函数定义 double Box::get(void) …...
100G云数据中心网络建设解决方案
随着数据和流量的快速增长,近年来数据中心已经进入了一个全新的100G时代。为了更高效地提供包括人工智能、虚拟现实、4K视频等在内的云计算服务,全球范围内正在大规模建设众多大型100G数据中心,如云数据中心。作为一种新型高效的基础设施&…...
Zoho Desk为何受到跨境电商企业青睐:优势与特点解析
现如今,跨境电商已成为中国外贸发展的一支重要力量,正从一种新业态成长为外贸的新常态。越来越多的国内电商玩家加入了跨境电商这个战场。跨境电商自有其特殊性,海外客户服务不好一样惨遭投诉,Zoho Desk可以帮助您赢得客户满意度&…...
git 删除仓库中多余的文件或者文件夹
目录 问题 解决方案 第一步:同步代码 第二步:删除文件 第三步:提交 第四步:推送远端 问题 在项目开发测试阶段,将无意间将本地敏感的、或无用的文件或目录不小心提交到远程仓库,该怎么解决呢。 解决方…...
搭建git服务器(本地局域网)
搭建git服务器(本地局域网) 创建仓库 (假定在/home/git目录下创建仓库) git init --bare sample.git克隆远程仓库到本地 git clone git192.168.0.100:/home/git/sample.git已有项目,绑定远程仓库 # 查看远程仓库绑定 git remote -v# 解除…...
如何让营销更生动,更有效!
作为专业的营销人员,我们深知在当今竞争激烈的市场环境中,如何让自己的产品或服务脱颖而出,吸引更多的潜在客户,是企业成功的关键。而中昱维信视频短信平台,正是您实现这一目标的得力助手。 一、视频短信,…...
RestTemplate请求参数需要转义 处理
项目需求 iam的token鉴权 需要带转义的回调http路径 用以下处理参数 接口仍然返回异常: public String authBack(String backUrl){ // backUrl http://192.168.1.156:sdm/String state URLEncoder.encode(state, "UTF-8"); }查了一下,Rest…...
使用Kaptcha实现的验证码功能
目录 一.需求 二.验证码功能实现步骤 验证码 引入kaptcha依赖 完成application.yml配置文件 浏览器显示验证码 前端页面 登录页面 验证成功页面 后端 此验证码功能是以SpringBoot框架下基于kaptcha插件来实现的。 一.需求 1.页面生成验证码 2.输入验证码ÿ…...
【无标题】CTF之SQLMAP
拿这一题来说 抓个包 复制报文 启动我们的sqlmap kali里边 sqlmap -r 文件路径 --dump --dbs 数据库 --tables 表...
【Qt之Quick模块】1. 概述及Quick应用程序创建流程
概述 Qt的Quick模块是用于创建现代化、动态和响应式用户界面的工具集。它是基于QML(Qt Meta-Object Language)和JavaScript的。 QML是一种声明性的语言,用于描述用户界面的结构和行为。它使用层叠样式表(CSS)的语法来…...
C语言-数组指针笔试题讲解(1)-干货满满!!!
文章目录 ▶️1.sizeof和strlen的对比💯➡️1.1 sizeof是什么?💯➡️1.2sizeof用法举例💯▶️1.3strlen是什么?💯▶️1.4 strlen函数用法举例:💯▶️1.5 strlen和sizeof的对比&#…...
springboot整合vue,将vue项目整合到springboot项目中
将vue项目打包后,与springboot项目整合。 第一步,使用springboot中的thymeleaf模板引擎 导入依赖 <!-- thymeleaf 模板 --><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-t…...
SpringBoot+Tess4j:轻松实现OCR功能
一、引言二、功能演示三、功能实现1. 描述2. 编码实现四、源码五、结束语一、引言你是否曾遇到过这样的情况:看到一段有用的文本,想要快速复制下来,却只能眼巴巴地盯着屏幕,手动输入?其实,Java 也可以轻松实…...
别再手动点啦!用Android无障碍服务+讯飞语音,5分钟实现App语音操控(保姆级教程)
用Android无障碍服务打造语音操控神器:5分钟实现"可见即可说" 你是否厌倦了在手机上反复点击屏幕的操作?想象一下,只需对着手机说出"打开微信"、"点击朋友圈"、"返回主页",设备就能自动完…...
Z-Image-Turbo在艺术创作中的实战:将文字灵感转化为超写实画作
Z-Image-Turbo在艺术创作中的实战:将文字灵感转化为超写实画作 你是否曾经有过绝妙的创意画面,却苦于无法将其具现化?Z-Image-Turbo极速云端创作室正是为解决这一痛点而生。这个基于先进AI技术的文生图工具,能够将你的文字描述在…...
Janus-Pro-7B效果展示:手写体/表格/多语言混合OCR识别准确率实测
Janus-Pro-7B效果展示:手写体/表格/多语言混合OCR识别准确率实测 1. 引言 你有没有遇到过这样的场景?翻出一张老照片,背面是长辈用钢笔写下的寄语,字迹有些潦草,想把它转成电子版保存,却一个字也认不出来…...
foobar2000界面美化终极指南:3步打造你的专属音乐播放器
foobar2000界面美化终极指南:3步打造你的专属音乐播放器 【免费下载链接】foobox-cn DUI 配置 for foobar2000 项目地址: https://gitcode.com/GitHub_Trending/fo/foobox-cn 还在为foobar2000那套单调乏味的默认界面感到困扰吗?今天我要为你介绍…...
手把手教你用DuckDB 1.3.0的DuckLake功能搭建数据湖(PostgreSQL+MinIO实战)
实战指南:基于DuckDB 1.3.0与MinIO构建企业级数据湖架构 在数据驱动的时代,企业需要更灵活、高效的解决方案来管理海量数据。DuckDB 1.3.0推出的DuckLake功能,结合PostgreSQL的元数据管理能力和MinIO的对象存储优势,为中小型企业…...
CSS动画+超级千问:打造有呼吸感的语音合成反馈系统(实战教程)
CSS动画超级千问:打造有呼吸感的语音合成反馈系统(实战教程) 1. 项目介绍与核心价值 1.1 传统TTS工具的痛点 大多数语音合成工具的操作体验是这样的:面对一堆参数滑块,反复调整"语速"、"音高"、…...
Qwen3-14B芯片设计辅助:Verilog注释生成、RTL代码解释、DFT建议
Qwen3-14B芯片设计辅助:Verilog注释生成、RTL代码解释、DFT建议 1. 镜像概述与硬件适配 Qwen3-14B私有部署镜像是专为芯片设计工程师打造的AI辅助工具,基于通义千问大语言模型优化定制。该镜像完美适配RTX 4090D 24GB显存配置,预装了完整的…...
掌握罗技鼠标宏的5个技术维度:从原理到实战优化
掌握罗技鼠标宏的5个技术维度:从原理到实战优化 【免费下载链接】logitech-pubg PUBG no recoil script for Logitech gaming mouse / 绝地求生 罗技 鼠标宏 项目地址: https://gitcode.com/gh_mirrors/lo/logitech-pubg 一、技术原理解析:机械补…...
Mojo加速Python科学计算:如何在72小时内将AI推理速度提升8.6倍(附完整可运行代码)
第一章:Mojo与Python混合编程概述Mojo 是一种为 AI 系统量身打造的现代系统编程语言,兼具 Python 的易用性与 C/C 的执行效率。它原生兼容 Python 生态,允许开发者在同一个项目中无缝调用 Python 模块、复用现有 NumPy/Torch 代码,…...
