《图片管理系统》PPT课件.ppt

《《图片管理系统》PPT课件.ppt》由会员分享，可在线阅读，更多相关《《图片管理系统》PPT课件.ppt（89页珍藏版）》请在三一办公上搜索。

1、图片管理系统,需求分析,1.创建专辑/修改专辑封皮图片及简介/删除专辑/按名称查询专辑;2.为专辑添加图片/浏览专辑图片/删除选中图片/修改图片简介及所属专辑名;3.分页查询,用力图,功能结构图,数据表设计,数据表设计,系统模块划分,开发步骤,1、文件新建网站，在站点下新 建App_Code和 App_Data 文件夹；2、将数据库文件及数据库日志文 件，存放在App_Data中；3、右击App_Code，添加新 项，添加类文件SqlHelper.cs 和DB.cs；4、右击站点添加配置文件 web.config5、添加两个文件夹image和 logo分别存放图片,利用SqlDataSourc

2、e生成数据库连接字符串,将SqlDataSource生成的数据库连接字符串复制到web.config中，然后就可以删除该SqlDataSource，如下所示：,为了代码重用，为了体现分层思想，我们将数据库连接代码写在SqlHelper.cs公共类中，将数据库操作代码写在DB.cs公共类中。SqlHelper.cs中：1、右击站点添加引用.NETSystem.Configuration2、代码中添加using System.Data;using System.Data.SqlClient;,SqlHelper.cs代码如下：public class SqlHelper private stati

3、c readonly string ConnectionString=ConfigurationManager.ConnectionStringsConnectionString.ConnectionString;SqlConnection conn=new SqlConnection(ConnectionString);public SqlCommand GetCommand(string sqlStr,params SqlParameter cmdparms)SqlCommand cmd=new SqlCommand();cmd.Connection=conn;cmd.CommandTex

4、t=sqlStr;cmd.CommandType=CommandType.Text;if(cmdparms!=null)foreach(SqlParameter p in cmdparms)cmd.Parameters.Add(p);return cmd;public SqlHelper()conn.Open();,DB.cs代码（首先引用using System.Data.SqlClient;）public class DBpublic DB()/TODO:在此处添加构造函数逻辑/在首页上显示所有专辑信息 public DataTable GetAll()SqlHelper helper=n

5、ew SqlHelper();string strsql=select*from album;SqlCommand cmd=new SqlCommand();cmd=helper.GetCommand(strsql,null);DataTable dt=new DataTable();using(SqlDataReader rdr=cmd.ExecuteReader()dt.Load(rdr);return dt;,/在首页上按名称查询专辑信息 public DataTable GetByID(int id)SqlHelper helper=new SqlHelper();string str

6、sql=select*from album where albumID=albumID;SqlParameter parm=new SqlParameter new SqlParameter(albumID,id);SqlCommand cmd=new SqlCommand();cmd=helper.GetCommand(strsql,parm);DataTable dt=new DataTable();using(SqlDataReader rdr=cmd.ExecuteReader()dt.Load(rdr);return dt;,/为首页的专辑名称下拉菜单绑定名称 public Data

7、Table GetAlbumName()SqlHelper helper=new SqlHelper();string strsql=select albumID,albumName from album;SqlCommand cmd=new SqlCommand();cmd=helper.GetCommand(strsql,null);DataTable dt=new DataTable();using(SqlDataReader rdr=cmd.ExecuteReader()dt.Load(rdr);return dt;,当SqlHelper.cs和DB.cs两个公共类写好后，右击站点，生

8、成网站，检查是否生成成功。如果生成成功，做如下操作：,利用GridView显示专辑信息，用上述方法新建数据源对象，与上述方法中不同的是，选择的DB方法不同。注意：GridView的属性设置：AllowPaging=True,AutoGenerateColumns=False,DataKeyNames=albumID,PageSize=2.,利用GridView显示专辑信息，用上述方法新建数据源对象，与上述方法中不同的是，选择的DB方法不同。,给GridView编辑列，如下所示：BoundField:专辑编号、专辑名称、专辑创建时间TemplateField:专辑封面HyperLinkField

9、:为专辑添加图片、浏览专辑图片、修改专辑CommandField:删除,注意检查GridView的属性设置：AllowPaging=“True”AutoGenerateColumns=“False”DataKeyNames=“albumID”PageSize=“2”,增加查询按钮Button,新建ObjectDataSource,配置数据源，选择DB中的GetByID,双击查询按钮buttton1，进入Default.aspx.cs代码中编辑：protected void Button1_Click(object sender,EventArgs e)GridView1.DataSourceI

10、D=ObjectDataSource3.ID;GridView1.DataBind();,对于”创建专辑”按钮按下后,应该打开新的窗体AddAlbum.aspx,实现专辑名称,专辑封面图片和专辑简介信息的添加.如下图:,在DB.cs中继续添加功能块,实现添加专辑信息的功能public void AddAlbum(string albumName,DateTime albumTime,string logoUrl,string albumDesc)SqlHelper helper=new SqlHelper();string strsql=insert into album(albumName,

11、albumTime,logoUrl,albumDesc)values(name,time,logourl,desc);SqlParameter parm=new SqlParameter new SqlParameter(name,albumName),new SqlParameter(time,albumTime),new SqlParameter(logourl,logoUrl),new SqlParameter(desc,albumDesc);SqlCommand cmd=helper.GetCommand(strsql,parm);cmd.ExecuteNonQuery();,双击”提

12、交”按钮,将专辑信息添加到album数据表中.,protected void Button1_Click(object sender,EventArgs e)DB db=new DB();string albumName=TextBox1.Text;DateTime albumTime=DateTime.Now;string logourl=image/+FileUpload1.FileName;string exname=FileUpload1.FileName.Split(.)1;string albumDesc=TextBox2.Text;if(exname.ToLower()=jpg|

13、exname.ToLower()=gif|exname.ToLower()=png)FileUpload1.SaveAs(Server.MapPath(logourl);db.AddAlbum(albumName,albumTime,logourl,albumDesc);Response.Write(alert(创建专辑成功);location.href=default.aspx;);,为专辑添加图片功能的实现:右击站点添加新页面addimage.aspx,给image数据表添加信息,再次给GridView编辑列，如下所示：查看HyperLinkField列:为专辑添加图片,DataNavig

14、ateUrlFields:albumID绑定到超链接的NavigateUrl属性字段;DataNavigateUrlFormatString:addimage.aspx?id=0对绑定到超链接的NavigateUrl属性的值应用的格式设置.给image数据表添加信息:,/打开DB.cs,添加方法,实现给专辑添加照片功能:public void addimage(int albumID,string imageName,string imageUrl,DateTime imageTime,string imageDesc)SqlHelper helper=new SqlHelper();stri

15、ng addimage=insert into image(albumID,imageName,imageUrl,imageTime,imageDesc)Values(albumID,imageName,imageUrl,imageTime,imageDesc);SqlParameter parm=new SqlParameter new SqlParameter(albumID,albumID),new SqlParameter(imageName,imageName),new SqlParameter(imageUrl,imageUrl),new SqlParameter(imageTim

16、e,imageTime),new SqlParameter(imageDesc,imageDesc);SqlCommand cmd=helper.GetCommand(addimage,parm);cmd.ExecuteNonQuery();,/点击addimage.aspx的“提交按钮”时:protected void Button1_Click(object sender,EventArgs e)DB db=new DB();int albumID=Convert.ToInt32(DropDownList1.SelectedValue);DateTime imageTime=DateTim

17、e.Now;string imageUrl=image/+FileUpload1.FileName;string imageType=FileUpload1.FileName.Split(.)1;string imageName=FileUpload1.FileName.Split(.)0;string imageDesc=TextBox1.Text.ToString();if(imageType.ToLower()=jpg|imageType.ToLower()=gif|imageType.ToLower()=png)FileUpload1.SaveAs(Server.MapPath(ima

18、geUrl);db.addimage(albumID,imageName,imageUrl,imageTime,imageDesc);Response.Write(alert(添加成功！);location.href=default.aspx;);,浏览专辑图片功能的实现:右击站点添加新页面ViewImage.aspx,首先对default.aspx的GridView进行编辑列操作，使得“浏览专辑图片按钮”具有超链接功能,可链到ViewImage.aspx如下所示:,/在DB.cs中编写方法,实现浏览某个专辑中的所有照片首先引用命名空间:using System.Text;和using Sys

19、tem.Collections;public DataTable showImage(int albumID)SqlHelper helper=new SqlHelper();StringBuilder strsql_show=new StringBuilder();strsql_show.Append(select imageID,alb.albumID,alb.albumName,imageName,imageUrl,imageTime,imageDesc);strsql_show.Append(from image as img,album as alb where img.albumI

20、D=alb.albumID and img.albumID=id);SqlParameter parm=new SqlParameter new SqlParameter(id,albumID);SqlCommand cmd=helper.GetCommand(strsql_show.ToString(),parm);DataTable dt=new DataTable();using(SqlDataReader rdr=cmd.ExecuteReader()dt.Load(rdr);return dt;,设计ViewImage.asp页面,对GridView进行编辑列操作:CommandFi

21、eld:选择 showselectButton:true;BoundField:HeaderText:图片编号DataField:imageIDHeaderText:图片地址DataField:imageUrl HeaderText:图片名称DataField:imageNameHeaderText:所属专辑名DataField:albumNameHeaderText:图片上传时间DataField:imageTime,HeaderText:图片简介DataField:imageDescHyperLinkField:Text:修改图片所属专辑TemplateField,编辑模板:Templat

22、eField,其中HeaderTemplate和ItemTemplate设计如下:,注意将GridView的属性设置如下:AllowPaging:True,AutoGenergateColumns:False,PageSize:2,DataKeyNames:imageID,设计ViewImage.aspx增加Button和DetailsView控件,给DetailsView控件编辑字段-添加模板,给DetailsView控件编辑模板,如下所示:Label1Text:Eval(“imageName”)Label2Text:Eval(“albumName”)Image1imageUrl:Eval(

23、“imageUrl”)Label3Text:Eval(“imageTime”)Label4Text:Eval(“imageDesc”)并将DetailsView的AutoGenerateRows属性设为False,修改专辑功能的实现,为站点添加新页面updateAlbum.aspx,然后在Default.aspx中单击“修改专辑”导航到updateAlbum.aspx页面,在DB.cs中编写updateAlbum方法实现修改专辑信息的功能 public void updateAlbum(int id,string albumDesc,string albumName,DateTime albu

24、mTime,string logourl)SqlHelper helper=new SqlHelper();string strsql=update album set albumName=albumName,albumTime=albumTime,albumDesc=albumDesc,logoUrl=logourl where albumID=albumID;SqlParameter parm=new SqlParameter new SqlParameter(albumID,id),new SqlParameter(albumDesc,albumDesc),new SqlParamete

25、r(albumName,albumName),new SqlParameter(logourl,logourl),new SqlParameter(albumTime,albumTime);SqlCommand cmd=helper.GetCommand(strsql,parm);cmd.ExecuteNonQuery();,Textbox:TextMode:SingleLineImageFileuploadTextbox:TextMode:MultiLinebutton,因为进行修改时，要先把旧的数据显示在控件中，在此基础上修改再提交，所以要先按照从Default.aspx传过来的album

26、ID查找出该专辑的所有信息，然后再修改提交。我们在DB.cs中写入新的方法select_albumMore,代码如下：public DataTable select_albumMore(int id)SqlHelper helper=new SqlHelper();string strsql=select albumName,logoUrl,albumDesc from album where albumID=albumID;SqlParameter parm=new SqlParameter new SqlParameter(albumID,id);SqlCommand cmd=helper

27、.GetCommand(strsql,parm);DataTable dt=new DataTable();using(SqlDataReader rdr=cmd.ExecuteReader()dt.Load(rdr);return dt;,当点击default.aspx的修改专辑时，会打开updateAlbum.aspx页面，并触发该页面的Page_Load事件，代码如下所示：protected void Page_Load(object sender,EventArgs e)if(!IsPostBack)DB db=new DB();int albumID=Convert.ToInt32(

28、Request.QueryStringid);TextBox1.Text=db.select_albumMore(albumID).Rows00.ToString();TextBox2.Text=db.select_albumMore(albumID).Rows02.ToString();Image1.ImageUrl=db.select_albumMore(albumID).Rows01.ToString();,在updateAlbum.aspx中点击”提交修改“按钮时，触发以下方法：protected void Button1_Click(object sender,EventArgs e

29、)DB db=new DB();int albumID=Convert.ToInt32(Request.QueryStringid);string albumDesc=TextBox2.Text.ToString();string albumName=TextBox1.Text.ToString();DateTime albumTime=DateTime.Now;string logourl=image/+FileUpload1.FileName;string exname=FileUpload1.FileName.Split(.)1;if(exname.ToLower()=jpg|exnam

30、e.ToLower()=png|exname.ToLower()=gif)FileUpload1.SaveAs(Server.MapPath(logourl);db.updateAlbum(albumID,albumDesc,albumName,albumTime,logourl);Response.Write(alert(修改成功);location.href=default.aspx?;);,在default.aspx中点击“删除”按钮时，删除专辑的方法在DB中：public void deleteAlbum(int albumID)SqlHelper helper=new SqlHelp

31、er();string strsql=delete from image where image.albumID=albumID;delete from album where albumID=albumID;SqlParameter parm=new SqlParameter new SqlParameter(id,albumID);SqlCommand cmd=helper.GetCommand(strsql,parm);cmd.ExecuteNonQuery();,在objectdatasource2中的DELETE方法中选择DB中的deleteAlbum方法。,删除专辑功能的实现，在d

32、efault.aspx中编辑列时，将删除按钮启动,注意：如果通过查询按钮查出某个专辑后，再点删除按钮，不能实现删除，因为查询功能是通过ObjectDataSource3实现的，而它不支持CommandField的删除钮，除非再编写相应的删除方法。,修改图片所属专辑和简介,给站点添加新页面update.aspx,用于修改图片所属的专辑名和修改图片简介。,在DB.cs中编写需要的方法，因为修改先要显示旧的专辑名和专辑简介信息，所以要有一个按imageID查找所属albumID和imageDesc的方法select_Desc(),代码如下所示：public DataTable select_Desc

33、(int imageID)SqlHelper helper=new SqlHelper();string strsql=select imageDesc from image where imageID=imageID;SqlParameter parm=new SqlParameter new SqlParameter(imageID,imageID);SqlCommand cmd=helper.GetCommand(strsql,parm);DataTable dt=new DataTable();using(SqlDataReader rdr=cmd.ExecuteReader()dt.

34、Load(rdr);return dt;,在DB.cs中编写需要的方法，因为点击提交修改按钮后，实现修改，所以要有一个修改图片所属专辑和图片简介的方法，代码如下所示：public void update(int albumID,string imageDesc,int imageID)SqlHelper helper=new SqlHelper();string strsql=update image set albumID=albumID,imageDesc=imageDesc where imageID=imageID;SqlParameter parm=new SqlParameter

35、new SqlParameter(albumID,albumID),new SqlParameter(imageDesc,imageDesc),new SqlParameter(imageID,imageID),;SqlCommand cmd=helper.GetCommand(strsql,parm);cmd.ExecuteNonQuery();,点击 按钮，导航到update.aspx页面时触发该页的page_load事件，代码如下：protected void Page_Load(object sender,EventArgs e)if(!IsPostBack)DB db=new DB(

36、);int imageID=Convert.ToInt32(Request.QueryStringimageID);TextBox1.Text=db.select_Desc(imageID).Rows00.ToString();,当点击update.aspx的 时，触发下面的事件：protected void Button1_Click(object sender,EventArgs e)DB db=new DB();int albumID=Convert.ToInt32(DropDownList1.SelectedValue);string imageDesc=TextBox1.Text.T

37、oString();int imageID=Convert.ToInt32(Request.QueryStringimageID);db.update(albumID,imageDesc,imageID);Response.Write(alert(修改成功);location.href=default.aspx?;);,通过ViewImage.aspx页面的“全选”框，实现全部选择功能，并且可以任意多选或单选，翻页可以保存选择状态。,当显示图片信息的GridView1翻页时，触发以下事件，代码如下：protected void GridView1_PageIndexChanging(objec

38、t sender,GridViewPageEventArgs e)RememberOldValues();/调用RememberOldValues()方法，保存选中状 态到session中 GridView1.PageIndex=e.NewPageIndex;GridView1.DataBind();RePopulateValue();/调用RePopulateValue()方法，将session中保存的 状态表现在CheckBox中 e.Cancel=true;/退出事件，如果没有此动作，GridView将会再次 DataBind()，将覆盖CheckBox的选中状态,/保存选中状态到ses

39、sion中 private void RememberOldValues()ArrayList al=null;/声名集合/创建一个Session并检查是否为空，这个Session用来保存集合/这里是判断是否是第一次进行分页 if(Sessionchecked_items!=null)/将Session对象保存到集合中 al=(ArrayList)Sessionchecked_items;else al=new ArrayList();/声明一个变量用来保存相应数据从而判断操作的是哪个check控件 int index=-1;续下页,foreach(GridViewRow row in Gri

40、dView1.Rows)/遍历GridViewRow index=(int)GridView1.DataKeysrow.RowIndex.Value;/从gridview中取得行的绑定值bool result=(CheckBox)row.FindControl(CheckBox2).Checked;/从每行的check中取得选中状态 if(result)/判断选中状态/当check为选中,并且集合中不包含这个值时,将此绑定值添加进集合中 if(!al.Contains(index)al.Add(index);else/当状态为不选中,并且集合中包含这个值时,将帮定值从集合中移除 if(al.C

41、ontains(index)al.Remove(index);,/最后判断集合是否为空或者没有值,如果有则将集合添加到Session中,以便保存数据 if(al!=null,/将session中保存的状态表现在CheckBox中 private void RePopulateValue()/将Session中的值赋给集合 ArrayList al=(ArrayList)Sessionchecked_items;if(al!=null,/点击“全选”后，触发CheckedChanged事件的代码：protected void allchecked(object sender,EventArgs

42、e)/注意修改checkbox1的AutoPostBack属性为true CheckBox cbx=(CheckBox)sender;/遍历GridViewRow将其中的check控件的状态设置 foreach(GridViewRow gvr in GridView1.Rows)CheckBox ch=(CheckBox)gvr.FindControl(CheckBox2);ch.Checked=cbx.Checked;,为了实现删除选中的图片记录，在DB.cs中编写如下方法：public void deletemore(ArrayList al)SqlHelper helper=new Sq

43、lHelper();StringBuilder str=new StringBuilder();str.Append(delete from image where imageID in();for(int i=0;i al.Count;i+)str.Append(ali+,);string s=str.ToString().Substring(0,str.ToString().Length-1);s+=);SqlCommand cmd=helper.GetCommand(s,null);cmd.ExecuteNonQuery();,/删除所选记录 protected void Button1_Click(object sender,EventArgs e)DB db=new DB();/首先判断gridview是否有值，如果有才可以进行删除 if(GridView1.Rows.Count 0)/通过调用保存状态方法盘判断那个记录被选中 RememberOldValues();/从Session对象中取得集合的内容 ArrayList al=(ArrayList)Sessionchecked_items;if(al!=null)/调用删除多条的方法进行删除操作 db.deletemore(al);GridView1.DataBind();,