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

C# WPF ListBox 动态显示图片

前言

        最近在和其他软件联合做一个本地图片选择传输功能,为此希望图片能够有序的呈现在客户端,简单的实现了一下功能,通过Mvvm模式进行呈现,过程简单通俗,话不多说直接上图。

处理过程

 前台代码

  1. 你只需要粘贴到你的前台xml中就可以,位置记得调整下Margin,我这是按照我的位置进行调整的,所以针对ListBox在你的前台你还需要调整下。
    <ListBox Name="lstFileManager" Background ="Transparent" ItemsSource="{Binding}" ScrollViewer.HorizontalScrollBarVisibility="Disabled" ScrollViewer.VerticalScrollBarVisibility="Auto" ScrollViewer.CanContentScroll="True" Margin="69,192,50,40"><ListBox.ItemsPanel><ItemsPanelTemplate><WrapPanel/></ItemsPanelTemplate></ListBox.ItemsPanel><ListBox.ItemTemplate><DataTemplate><!--这里修改内容整体大小以及在你框内的占比,我这一行显示5个--><Grid Margin="17" Width="100" Height="155"><Grid.RowDefinitions><RowDefinition Height="Auto" ></RowDefinition><RowDefinition Height="Auto" ></RowDefinition><RowDefinition Height="Auto" ></RowDefinition></Grid.RowDefinitions><Image Source="{Binding Pic}" HorizontalAlignment="Center" VerticalAlignment="Center" Width="100" Height="100"/><Border BorderThickness="1" BorderBrush="red" Margin="1,107,1,0"/><TextBlock Text="{Binding Name}" Grid.Row="1" Foreground="White" VerticalAlignment="Center" HorizontalAlignment="Center" Height="Auto" TextWrapping="Wrap"/></Grid></DataTemplate></ListBox.ItemTemplate>
    </ListBox>

后台代码

  1. 创建一个类进行数据绑定
        public class LVData{public string Name { get; set; }public BitmapImage Pic { get; set; }}
  2. 定义一个集合进行数据缓存 (集合定义在MainWindow的类中)
    ObservableCollection<LVData> LVDatas = new ObservableCollection<LVData>();
  3. 在我们的逻辑中进行数据填充和呈现,清除集合清空ListBox中的Item显示
    //添加图
    LVDatas.Add(new LVData { Name = "图片在ListBox中显示的名称(建议直接显示图片名称)", Pic = new BitmapImage(new Uri("完整的图片路径")) });
    //显示在ListBox中
    lstFileManager.ItemsSource = LVDatas;
    //清除集合清空呈现
    LVDatas.Clear();
    //当前点击的图片名称(lstFileManager.SelectedIndex  这是目前点击的下标)
    Console.WriteLine(LVDatas[lstFileManager.SelectedIndex].Name);
  4. 整体代码
    using System;
    using System.Collections.Generic;
    using System.Collections.ObjectModel;
    using System.IO;
    using System.Linq;
    using System.Text;
    using System.Threading.Tasks;
    using System.Windows;
    using System.Windows.Controls;
    using System.Windows.Data;
    using System.Windows.Documents;
    using System.Windows.Input;
    using System.Windows.Media;
    using System.Windows.Media.Imaging;
    using System.Windows.Navigation;
    using System.Windows.Shapes;namespace ImageTexture
    {/// <summary>/// MainWindow.xaml 的交互逻辑/// </summary>public partial class MainWindow : Window{//定义集合ObservableCollection<LVData> LVDatas = new ObservableCollection<LVData>();public MainWindow(){InitializeComponent();ImageTexture2DView("E:\\ProjectFiles\\ImageTexture");}private void ImageTexture2DView(string path){//Path是图片所在的文件夹路径var apps = System.IO.Directory.GetFiles(path);List<string> images = new List<string>();foreach (string app in apps)//---遍历文件夹所有文件{var fi = new FileInfo(app);//---使用FileInfo类进行操作if (fi.Extension == ".png"){//将图片添加到LVData中LVDatas.Add(new LVData { Name = fi.Name.Remove(fi.Name.LastIndexOf(".")), Pic = new BitmapImage(new Uri(fi.FullName)) });}}//进行呈现lstFileManager.ItemsSource = LVDatas;}private void ImageClear_Click(object sender, RoutedEventArgs e){//清除集合清空ListBox中的Item显示LVDatas.Clear();}}public class LVData{public string Name { get; set; }public BitmapImage Pic { get; set; }}
    }
    

结局    

后续想从数据库或者其他地方添加就根据自己的想法添加就可以了,另外获取点击的是哪个绑定个监听事件就可以了,希望对大家有帮助。

相关文章:

C# WPF ListBox 动态显示图片

前言 最近在和其他软件联合做一个本地图片选择传输功能&#xff0c;为此希望图片能够有序的呈现在客户端&#xff0c;简单的实现了一下功能&#xff0c;通过Mvvm模式进行呈现&#xff0c;过程简单通俗&#xff0c;话不多说直接上图。 处理过程 前台代码 你只需要粘贴到你的前台…...

游戏如何防御DDOS流量攻击呢,用游戏盾真的有用么?

针对在线游戏行业来说&#xff0c;DDoS&#xff08;分布式拒绝服务&#xff09;攻击是一种极具破坏性的威胁。DDoS攻击可能导致游戏服务器不可用&#xff0c;严重影响游戏体验和运营。为了解决这一问题&#xff0c;游戏盾作为一种专门为游戏行业设计的安全解决方案&#xff0c;…...

vue项目引入antDesignUI组件

快速安装ant-design-vue并配置&#xff0c;vue2.0 antDesign1.7.8 第一步&#xff1a;安装ant-deisgn-vue 1.7.8 npm install ant-design-vue1.7.8 --save第二步&#xff1a;配置package.json文件&#xff0c;将依赖写入后&#xff0c;npm install 安装依赖 "dependenc…...

非结构化数据库-MinIO基本集成

是什么 MinIO 是一个高性能的分布式对象存储服务&#xff0c;适合存储非结构化数据&#xff0c;如图片&#xff0c;音频&#xff0c;视频&#xff0c;日志等。对象文件最大可以达到5TB。 安装启动 mkdir -p /usr/local/minio cd /usr/local/minio# 下载安装包 wget https:/…...

Etcd备份及恢复

一、Etcd数据备份 1、备份命令 [rootlocalhost ~]# export ETCDCTL_API3 [rootlocalhost ~]# /data/etcd-3.4.9/bin/etcdctl --endpoints10.2.20.108:2379 snapshot save etcd-date "%Y-%m-%d_%H-%M-%S".snapshot 2、备份完成后会在当前目录生成备份文件 [rootlo…...

使用JavaMail发送邮件时嵌入公司logo图片

使用JavaMail发送邮件时嵌入公司logo图片 第一种方式&#xff1a;img标签和logo图片链接第二种方式&#xff1a;使用img标签和图片base64字符串第三种方式&#xff08;推荐&#xff09;&#xff1a;将logo当做附件一起发送并设置ContentID&#xff0c;再使用img标签&#xff0c…...

注解 @Async

注解 Async 1. 注解由来&#xff1a; Async 是 Spring 框架提供的注解&#xff0c;用于将方法标记为异步执行。通过使用 Async 注解&#xff0c;可以告知 Spring 在调用被注解的方法时&#xff0c;使用新的线程或线程池进行异步执行。 2. 注解示例&#xff1a; import org.s…...

Python“牵手”lazada商品评论数据采集方法,lazadaAPI申请指南

lazada平台API接口是为开发电商类应用程序而设计的一套完整的、跨浏览器、跨平台的接口规范&#xff0c;lazadaAPI接口是指通过编程的方式&#xff0c;让开发者能够通过HTTP协议直接访问lazada平台的数据&#xff0c;包括商品信息、店铺信息、物流信息等&#xff0c;从而实现la…...

微信小程序通用字体代码

下面是一个简单的微信小程序通用字体代码示例&#xff1a; // 在app.wxss中设置全局字体样式 import ./styles/fonts.wxss;// 在fonts.wxss中定义字体样式 font-face {font-family: CustomFont;src: url(font.ttf) format(truetype); }// 在page.wxss中使用自定义字体样式 .cus…...

LVS负载均衡DR模式

在LVS&#xff08;Linux Virtual Server&#xff09;负载均衡中的DR&#xff08;Direct Routing&#xff09;模式下&#xff0c;数据包的流向如下&#xff1a; 客户端发送请求到负载均衡器&#xff08;LVS&#xff09;的虚拟IP&#xff08;VIP&#xff09;。负载均衡器&#x…...

ArcGIS Pro基础入门、制图、空间分析、影像分析、三维建模、空间统计分析与建模、python融合、案例全流程科研能力提升

目录 第一章 入门篇 GIS理论及ArcGIS Pro基础 第二章 基础篇 ArcGIS数据管理与转换 第三章 数据编辑与查询、拓扑检查 第四章 制图篇 地图符号与版面设计 第五章 空间分析篇 ArcGIS矢量空间分析及应用 第六章 ArcGIS栅格空间分析及应用 第七章 影像篇 遥感影像处理 第八…...

​ Spring Clould 配置中心 - Nacos

视频地址&#xff1a;微服务&#xff08;SpringCloudRabbitMQDockerRedis搜索分布式&#xff09; Nacos配置管理-Nacos实现配置管理&#xff08;P24、P25&#xff09; Nacos除了可以做注册中心&#xff0c;同样可以做配置管理来使用。 当微服务部署的实例越来越多&#xff0c…...

1609.奇偶数

目录 一、题目 二、代码 三、完整测试代码 一、题目 1609. 奇偶树 - 力扣&#xff08;LeetCode&#xff09; 二、代码 /*** Definition for a binary tree node.* struct TreeNode {* int val;* TreeNode *left;* TreeNode *right;* TreeNode() : val(0),…...

c++--异常

1.什么是异常 对于C语言来说&#xff0c;处理错误的机制有&#xff1a; 1.终止程序&#xff1a;如assert&#xff0c;缺陷&#xff0c;如发生内存错误&#xff0c;除0之外发生程序终止&#xff0c;用户无法接受。 2.返回错误码&#xff1a;对于大型程序来说&#xff0c;需要…...

ArcGIS 利用cartogram插件制作变形地图

成果图 注&#xff1a;本图数据并不完全对&#xff0c;只做为测试用例 操作 首先需要下载一个插件cartogram 下载地址在这里 https://www.arcgis.com/home/item.html?idd348614c97264ae19b0311019a5f2276 下载完毕之后解压将Cartograms\HelpFiles下的所有文件复制到ArcGIS…...

Mybatis批量插入方式有哪些

MyBatis的批量插入有多种写法&#xff0c;下面我将列出一些常见的批量插入写法 方式列表 使用XML配置文件进行批量插入&#xff1a;在XML映射文件中使用<insert>标签&#xff0c;并通过foreach标签迭代批量数据&#xff0c;然后在SQL语句中使用VALUES关键字。使用Java注…...

前端框架学习-React(一)

React 应用程序是由组件组成的。 react 程序是用的jsx语法&#xff0c;使用这种语法的代码需要由babel进行解析&#xff0c;解析成js代码。 jsx语法&#xff1a; 只能返回一个根元素 所有的标签都必须闭合&#xff08;自闭和或使用一对标签的方式闭合&#xff09; 使用驼峰式…...

Android Studio实现解析HTML获取图片URL将图片保存到本地

目录 效果activity_main.xmlMainActivityImageItemImageAdapter 效果 项目本来是要做成图片保存到手机然后读取数据后瀑布流展示&#xff0c;但是有问题&#xff0c;目前只能做到保存到手机 activity_main.xml <?xml version"1.0" encoding"utf-8"?…...

单例模式的理论与实践

本文实践代码仓库&#xff1a;https://github.com/goSilver/my_practice 文章目录 一、定义二、作用三、实现3.1 饿汉式3.2 懒汉式3.3 双重检查3.4 静态内部类3.5 枚举 四、总结4.1 单例存在哪些问题&#xff1f;4.2 单例有什么替代解决方案&#xff1f; 一、定义 单例模式是一…...

深入了解MongoDB:灵活的文档型数据库与应用案例

什么是MongoDB ? MongoDB 是由C语言编写的&#xff0c;是一个基于分布式文件存储的开源数据库系统。 在高负载的情况下&#xff0c;添加更多的节点&#xff0c;可以保证服务器性能。 MongoDB 旨在为WEB应用提供可扩展的高性能数据存储解决方案。 MongoDB 将数据存储为一个…...

浅谈 React Hooks

React Hooks 是 React 16.8 引入的一组 API&#xff0c;用于在函数组件中使用 state 和其他 React 特性&#xff08;例如生命周期方法、context 等&#xff09;。Hooks 通过简洁的函数接口&#xff0c;解决了状态与 UI 的高度解耦&#xff0c;通过函数式编程范式实现更灵活 Rea…...

<6>-MySQL表的增删查改

目录 一&#xff0c;create&#xff08;创建表&#xff09; 二&#xff0c;retrieve&#xff08;查询表&#xff09; 1&#xff0c;select列 2&#xff0c;where条件 三&#xff0c;update&#xff08;更新表&#xff09; 四&#xff0c;delete&#xff08;删除表&#xf…...

《从零掌握MIPI CSI-2: 协议精解与FPGA摄像头开发实战》-- CSI-2 协议详细解析 (一)

CSI-2 协议详细解析 (一&#xff09; 1. CSI-2层定义&#xff08;CSI-2 Layer Definitions&#xff09; 分层结构 &#xff1a;CSI-2协议分为6层&#xff1a; 物理层&#xff08;PHY Layer&#xff09; &#xff1a; 定义电气特性、时钟机制和传输介质&#xff08;导线&#…...

CMake基础:构建流程详解

目录 1.CMake构建过程的基本流程 2.CMake构建的具体步骤 2.1.创建构建目录 2.2.使用 CMake 生成构建文件 2.3.编译和构建 2.4.清理构建文件 2.5.重新配置和构建 3.跨平台构建示例 4.工具链与交叉编译 5.CMake构建后的项目结构解析 5.1.CMake构建后的目录结构 5.2.构…...

DAY 47

三、通道注意力 3.1 通道注意力的定义 # 新增&#xff1a;通道注意力模块&#xff08;SE模块&#xff09; class ChannelAttention(nn.Module):"""通道注意力模块(Squeeze-and-Excitation)"""def __init__(self, in_channels, reduction_rat…...

【磁盘】每天掌握一个Linux命令 - iostat

目录 【磁盘】每天掌握一个Linux命令 - iostat工具概述安装方式核心功能基础用法进阶操作实战案例面试题场景生产场景 注意事项 【磁盘】每天掌握一个Linux命令 - iostat 工具概述 iostat&#xff08;I/O Statistics&#xff09;是Linux系统下用于监视系统输入输出设备和CPU使…...

linux arm系统烧录

1、打开瑞芯微程序 2、按住linux arm 的 recover按键 插入电源 3、当瑞芯微检测到有设备 4、松开recover按键 5、选择升级固件 6、点击固件选择本地刷机的linux arm 镜像 7、点击升级 &#xff08;忘了有没有这步了 估计有&#xff09; 刷机程序 和 镜像 就不提供了。要刷的时…...

解决本地部署 SmolVLM2 大语言模型运行 flash-attn 报错

出现的问题 安装 flash-attn 会一直卡在 build 那一步或者运行报错 解决办法 是因为你安装的 flash-attn 版本没有对应上&#xff0c;所以报错&#xff0c;到 https://github.com/Dao-AILab/flash-attention/releases 下载对应版本&#xff0c;cu、torch、cp 的版本一定要对…...

今日学习:Spring线程池|并发修改异常|链路丢失|登录续期|VIP过期策略|数值类缓存

文章目录 优雅版线程池ThreadPoolTaskExecutor和ThreadPoolTaskExecutor的装饰器并发修改异常并发修改异常简介实现机制设计原因及意义 使用线程池造成的链路丢失问题线程池导致的链路丢失问题发生原因 常见解决方法更好的解决方法设计精妙之处 登录续期登录续期常见实现方式特…...

稳定币的深度剖析与展望

一、引言 在当今数字化浪潮席卷全球的时代&#xff0c;加密货币作为一种新兴的金融现象&#xff0c;正以前所未有的速度改变着我们对传统货币和金融体系的认知。然而&#xff0c;加密货币市场的高度波动性却成为了其广泛应用和普及的一大障碍。在这样的背景下&#xff0c;稳定…...