【下载文档:  蛇年多屏图片切换(可添加图片链接以及编辑标题).txt 】

---

蛇年多屏图片切换(可添加图片链接以及编辑标题)
朋友要求，做一个多屏图片切换效果，以作为网站广告宣传,刚开始听到此要求时，心想一定很简单照抄就行了。但是朋友还有进一步要求，是要在网站管理后统一管理，添加图片，链接以及标题。还能编辑这些信息。前台不必在每次更新时，去修改前台代码。 即然朋友有此要求，Insus.NET照做就是了。首先看看效果(今年是蛇年，刚好Windows 8 Themes也有几张蛇图片，因此拿它来做例子了。) 在数据库创建一个表，来存储相关信息，如图片名称，链接以及标题等： 复制代码 代码如下: [dbo].[SwitchFocusNews] SET ANSI_NULLS ON GO SET QUOTED_IDENTIFIER ON GO -- ============================================= -- Author: Insus.NET -- Create date: 2013-01-12 -- Description: 创建图片切换信息表 -- ============================================= CREATE TABLE [dbo].[SwitchFocusNews] ( [Nbr] TINYINT IDENTITY(1,1) PRIMARY KEY NOT NULL, [ImageName] NVARCHAR(128) NOT NULL, [Url] NVARCHAR(200) NOT NULL, [Title] NVARCHAR(200) NOT NULL ) GO 创建一个存储过程，获取所有记录： 复制代码 代码如下: [dbo].[usp_SwitchFocusNews_GetAll] SET ANSI_NULLS ON GO SET QUOTED_IDENTIFIER ON GO -- ============================================= -- Author: Insus.NET -- Create date: 2013-01-12 -- Description: 获取所有记录 -- ============================================= CREATE PROCEDURE [dbo].[usp_SwitchFocusNews_GetAll] AS SELECT [Nbr],[ImageName],[Url],[Title] FROM [dbo].[SwitchFocusNews] GO 网站后台上传图片，以及编辑功能，Insus.NET在此省略。接下来，创建一个类别，此类别只有获取数据库表的信息，其它添加，编辑和删除方法略。 复制代码 代码如下: SwitchFocusNews Imports System.Data Imports Microsoft.VisualBasic Namespace Insus.NET Public Class SwitchFocusNews Dim objBusinessBase As New BusinessBase() Public Function GetAll() As DataTable Return objBusinessBase.GetDataToDataSet("usp_SwitchFocusNews_GetAll").Tables(0) End Function End Class End Namespace 为了以后维护方便，以及最小功能化的开发理念，Insus.NET把它写成一个用户控件ASCX，以下HTML代码，重点是在 用户控件cs代码： 复制代码 代码如下: Imports System.Data Imports Insus.NET Partial Class AscxControls_FlashAnimation Inherits System.Web.UI.UserControl '实例化类别 Dim objSwitchFocusNews As New SwitchFocusNews() Protected Sub Page_Load(sender As Object, e As EventArgs) Handles Me.Load Dim objDataTable As DataTable = objSwitchFocusNews.GetAll() '看看数据库是否有记录 If objDataTable.Rows.Count > 0 Then Dim width As Integer = 500 '宽度 Dim height As Integer = 300 '高度 Dim autoPlayer As Integer = 3 '自动播放间隔时间 Dim si As New StringBuilder() si.AppendFormat("var box = new PPTBox();") si.AppendFormat("box.width = {0};", width) si.AppendFormat("box.height = {0};", height) si.AppendFormat("box.autoplayer = {0};", autoPlayer) '循环数据表，把每一条记录循环显示以下面语法中。 图片路径正确是后台上传或是编辑时存储的路径。当然你也可把存储于数据的图片显示出来。 For Each dr As DataRow In objDataTable.Rows si.AppendFormat("box.add({{ ""url"": ""{0}"", ""href"": ""{1}"", ""title"": ""{2}""}});", ResolveUrl("~/FlashAnimation/images/" & dr("ImageName").ToString() & ""), dr("Url").ToString(), dr("Title").ToString()) Next si.Append("box.show();") Me.LiteralSwitchImage.Text = si.ToString() End If End Sub End Class