TBogdan
TBogdan

Reputation: 737

Placing images programatically on page ASP.net Web application c#

How can I move an image control programatically ? in a asp.net web application on that page, I wish to create 3 images programatically and place them with some distance between them;

int punctX = 50;
            int punctY=50;

            for (int y = 0; y < 2; y++)
            {
                System.Web.UI.WebControls.Image image = new System.Web.UI.WebControls.Image();
                image.ID = "culoare" + y.ToString();

-- how to place image on page? }

Upvotes: 1

Views: 16145

Answers (3)

user1994891
user1994891

Reputation: 1

    //The image data is from database.
    System.Web.UI.WebControls.Image img = new System.Web.UI.WebControls.Image();
    img.ID = row["id"].ToString();
    img.AlternateText = row["id"].ToString();
    img.ImageUrl = "~/myimage.png";
    img.Style["position"] = "relative";              //here must be "relative"
    img.Style["left"] = row["posX"].ToString() + "px";
    img.Style["top"] = row["posY"].ToString() + "px";

Upvotes: 0

Prashanth Thurairatnam
Prashanth Thurairatnam

Reputation: 4361

It's better if you can use some kind of a place holder to add your images into. Here in this example I am using a asp.net panel control. In the code behind you can set the style property with the corresponding attributes.

<%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"
    CodeBehind="Default.aspx.cs" Inherits="StackOverFlow_2._Default" %>

<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
    <asp:Panel ID="pnlImages" runat="server"></asp:Panel>
</asp:Content>

Provided you have images like this

enter image description here

You can do something like this (not may be the cleanest code; but you get the idea)

using System;
using System.Web.UI;

namespace StackOverFlow_2
{
    public partial class _Default : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!Page.IsPostBack)
            {
                double punctX = 10;
                double punctY = 10;

                double spacing = 5;

                pnlImages.Style["position"] = "relative";

                for (int y = 0; y < 3; y++)
                {
                    System.Web.UI.WebControls.Image image = new System.Web.UI.WebControls.Image();
                    image.ID = "culoare" + y.ToString();
                    image.Style["position"] = "absolute";
                    image.Style["left"] = punctX.ToString() + "px";
                    image.Style["top"] = punctY.ToString() + "px";
                    image.Width = 100;
                    image.Height = 60;
                    image.ImageUrl = "~/Images/" + image.ID.ToString() + ".jpg";

                    pnlImages.Controls.Add(image);                    

                    punctX += image.Width.Value + spacing;

                }
            }
        }
    }
}

Rendered output looks like this (your images are placed 5px apart)

enter image description here

Upvotes: 2

HatSoft
HatSoft

Reputation: 11201

You will have to add them to your page control collection like this

page.Controls.Add(yourImage)

Upvotes: 0

Related Questions