Как отобразить список изображений из папки на жестком диске на веб-сайте ASP.NET? - PullRequest
Новая
       10

Как отобразить список изображений из папки на жестком диске на веб-сайте ASP.NET?

15 голосов
/ 13 апреля 2010

Я пытаюсь сделать простой сайт фотогалереи. Использование 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++;

    }

}

Ответы [ 3 ]

17 голосов
/ 13 апреля 2010

Сначала вам нужно разместить изображения, которые вы хотите отобразить, под веб-деревом. Давайте предположим, что вы сделали это, и они находятся в папке с именем 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();
}

Это в основном создает массив изображений с их полным путем из каталога. Затем он создает список строк, которые содержат виртуальный путь к изображению. Затем он связывает этот список с повторителем, который отображает каждый элемент в своем шаблоне, который является элементом управления Image, который использует путь в качестве ImageUrl. Это быстро и грязно, но работает и должно быть хорошей отправной точкой.

3 голосов
/ 13 апреля 2010

Вы создаете элемент <img> с URL-адресом C:\Users\Jordan\Desktop\Web Images\SomeImage.jpg. Очевидно, что это не будет работать в веб-браузере.

Вы должны скопировать изображения в подпапку вашего проекта и установить URL-адрес для относительного URL, например: 

img.ImageUrl = "~/Web Images/" + Path.GetFileName(s);

(при условии, что папка Web Images является подпапкой корня приложения)

2 голосов
/ 30 апреля 2014

Например

У вас должен быть способ указать, где ваши изображения будут храниться в вашем приложении. Поэтому вам нужен файл веб-конфигурации с указанием пути. Или, если вы хотите быть по-настоящему креативным, вы можете сохранить его в базе данных ....

На вашей веб-странице 

    <%@ 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();
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...