如何在 ASP.NET 网站上显示来自硬盘驱动器文件夹的图像列表?
Posted
技术标签:
【中文标题】如何在 ASP.NET 网站上显示来自硬盘驱动器文件夹的图像列表?【英文标题】:How do you display a list of images, from a folder on hard drive, on ASP.NET website? 【发布时间】:2011-02-07 10:53:15 【问题描述】:我正在尝试制作一个简单的照片库网站。使用 ASP.NET 和 C#。 现在我没有设置服务器,但我只是使用 Visual Studio 在您创建网站项目并运行它时启动的开发服务器。
我的硬盘上有一个文件夹,其中包含未知数量的图像。我想编写一段代码来遍历每个图像并将它们添加到默认网页。我已经尝试过这段代码,但它不起作用。我究竟做错了什么?我应该使用 ListView 控件还是 DataView 或类似的东西?我是否需要添加虚拟目录才能访问图像?如果是这样,我该如何在这个测试服务器上做到这一点?
另外,如何设置这些图片的位置和对齐方式? 例如,如何使图片垂直排成一行并以网页为中心?
protected void Page_Load(object sender, EventArgs e)
string[] filesindirectory = Directory.GetFiles(@"C:\Users\Jordan\Desktop\Web Images");
int i = 1;
foreach (string s in filesindirectory)
Image img = new Image();
img.ID = "image" + i.ToString();
img.ImageUrl = s;
img.Visible = true;
Page.Controls.Add(img);
i++;
【问题讨论】:
【参考方案1】:首先,您需要将要显示的图像放在网络树下。假设您已经这样做了,并且它们位于名为 Images 的文件夹中。然后,您可以使用 Repeater 控件通过数据绑定来显示它们,如下所示:
这样的……
<asp:Repeater ID="RepeaterImages" runat="server">
<ItemTemplate>
<asp:Image ID="Image" runat="server" ImageUrl='<%# Container.DataItem %>' />
</ItemTemplate>
</asp:Repeater>
然后在你的代码后面:
protected void Page_Load(object sender, EventArgs e)
string[] filesindirectory = Directory.GetFiles(Server.MapPath("~/Images"));
List<String> images = new List<string>(filesindirectory.Count());
foreach (string item in filesindirectory)
images.Add(String.Format("~/Images/0", System.IO.Path.GetFileName(item)));
RepeaterImages.DataSource = images;
RepeaterImages.DataBind();
这基本上创建了一个包含目录完整路径的图像数组。 然后它创建一个包含图像虚拟路径的字符串列表。 然后它将该列表绑定到转发器,该转发器显示其模板中的每个项目,这是一个使用路径作为 ImageUrl 的 Image 控件。它很快,但很有效,应该是一个很好的起点。
【讨论】:
谢谢丹,这很好用。另一个问题...如何使图像全部垂直显示在一条线上并以网页为中心?并且可以缩放图像吗? 为了对齐图像使用一些 CSS - 也许将每个图像包装在一个 div 中。您可以通过在图像控件上指定宽度和高度来使用“浏览器缩放”,但这只会缩放浏览器中的图像。要以编程方式实际缩放图像,请查看west-wind.com/Weblog/posts/283.aspx【参考方案2】:您正在创建一个 URL 为 C:\Users\Jordan\Desktop\Web Images\SomeImage.jpg
的 <img>
元素。显然,这在网络浏览器中是行不通的。
您应该将图像复制到项目的子文件夹,并将 URL 设置为相对 URL,如下所示:
img.ImageUrl = "~/Web Images/" + Path.GetFileName(s);
(假设Web Images
文件夹是应用根目录的子文件夹)
【讨论】:
【参考方案3】:例如
您需要有一种方法来指定您的图像将在您的应用中存储的位置。 因此,您需要一个包含路径的 Web 配置文件。 或者,如果您想真正发挥创造力,可以将其存储在数据库中....
在您的网页中
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Images.aspx.cs" Inherits="ImageViewer" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Viewer Demo</title>
<link href='styles.css' rel='stylesheet' type='text/css' />
</head>
<body>
<form id="form1" runat="server">
<div id="outer">
<h2>Viewer Demo</h2>
<br />
<div style="clear:both;">
<h4>Using Viewer with the Repeater Control</h4>
<p>Repeater control to display a collection of images.</p>
</div>
<div style="clear:both;">
<asp:Repeater ID="RepeaterImages" runat="server">
<ItemTemplate>
<asp:Image ID="Image" runat="server" ImageUrl='<%# Container.DataItem %>' />
</ItemTemplate>
</asp:Repeater>
</div>
<br />
</div>
</form>
</body>
</html>
在您的 web.config 中
<appSettings>
<add key="FilePath" value="~/images"/>
</appSettings>
在您的 .cs 文件后面的代码中 你真的需要过滤文件,如果有人(也许你;))放置错误的文件 在其中,您不会无意中包含它们...
string filters = "*.jpg;*.png;*.gif";
string Path = ConfigurationManager.AppSettings["FilePath"].ToString();
List<String> images = new List<string>();
foreach (string filter in filters.Split(';'))
FileInfo[] fit = new DirectoryInfo(this.Server.MapPath(Path)).GetFiles(filter);
foreach (FileInfo fi in fit)
images.Add(String.Format(Path + "/0", fi));
RepeaterImages.DataSource = images;
RepeaterImages.DataBind();
【讨论】:
非常感谢您帮助我,我只是添加大小并使其居中以上是关于如何在 ASP.NET 网站上显示来自硬盘驱动器文件夹的图像列表?的主要内容,如果未能解决你的问题,请参考以下文章
如何在 asp.net core .NET6(Razor 页面)中的单个 cshtml 中显示来自多个表/模型的数据