快速上手wap網站開發

近來工作比較緊張，一直想寫一些東西，無奈沒有時間，現在開發的市移動wap論壇終於告一段落，現在將開發過程簡單記錄一下，以備日後參考，都是一些簡單的使用過程，可爲初次接觸wap開發的提供一點點參考，高手可以忽略。

開發工具：vs2008 模擬器：vs自帶仿真管理器 framework版本：2.0

一。配置環境：

vs2008中已經沒有了新建wap的選項，所需的wap模板需要從網上下載：

下載地址：http://www.brsbox.com/filebox/down/fc/911fb64660cbf75f42146ac021d642fe，這是我的網絡硬盤，下載下來是一個ASPNETMobileTemplates.rar的文件，根據裏面的說明將文件拷貝到所需的文件夾。

模擬器可用openware（(官方免費註冊下載地址)http://developer.openwave.com/dvl/tools_and_sdk/phone_simulator/），也可用vs自帶的設備仿真器（要先安裝ActiveSync，），在工具—設備仿真管理器—選擇pocket pc 2003中的pocket pc 2003 se仿真器—右鍵點解連接，然後再右鍵點擊插入底座，運行後即可使用，不過在仿真管理器中地址不要用local，要用本機ip地址。

二。建立數據庫：

數據庫採用sqlserver，建立一個名爲wapDB的數據庫，如下圖：

然後添加一個用戶表userinfo，如下圖：

爲數據庫添加一條記錄，如下圖：

建立表document，用來存儲發佈的文章，表結構如下圖：

先爲document表添加20條數據，用來顯示，如下圖：

至此，數據庫建立完畢，下面我們將採用vs2008來具體開發。

三。建立工程，開始開發：

首先，我們建立一個testWap的項目，如下圖：

將新建項目默任生成的default.aspx刪除，新建一個login.aspx的mobile web form模板（在第一步環境配置中按照說明將ASPNETMobileTemplates.rar中的文件拷貝到各個文件夾後，就會在新建項目中最下面的模板中顯示mobile模板了），如下圖：

建立好以後，按照上述方法再添加一個index.aspx的文件。

至此，我們所需的文件已經全部建立完成，login.aspx用來登錄，登錄後到index.aspx頁面，此頁面用來分頁顯示document文章表中的內容，並且可以添加文章記錄。（注意，做好網頁後，需要在記事本中將我們剛纔建立的login.aspx、index.aspx打開重新保存一下，保存編碼改爲utf-8，覆蓋原文件即可，這樣做是因爲項目採用utf-8編碼，如果不這樣的話，頁面含有中文的話就會顯示爲亂碼。），如下圖：

然後開始編碼，具體編碼和asp.net中的編碼過程一樣，不同的就是換成了mobile控件，這裏需要注意的vs下開發wap不支持可視化設計，我們只能在後臺手工編碼，當添加<mobile>控件的時候，只要打上<m就會出現你所需要的mobile控件，mobile控件的具體有哪些和都有什麼屬性請參考其他文檔，日後若有時間，我會將mobile控件的使用說明詳細介紹一下，這裏給大家引薦一個網址，這裏面有mobile控件的介紹和使用說明，http://www.wapkf.com/article/aspnet-wap/Article_005_3.html

我們這裏只用到了objectlist控件和textbox、textview控件以及command、Label控件，command控件其實就是button按鈕，在mobile裏叫command。

這裏我們建立三個文件：

index.aspx：分頁顯示文章頁面，帶有快速發表

view.aspx：顯示文章具體內容頁面

三個頁面源代碼：

login.aspx 前臺代碼具體如下：

<%@ Page Language="C#" AutoEventWireup="true" Inherits="testWap.login" Codebehind="login.aspx.cs" %>
<%@ Register TagPrefix="mobile" Namespace="System.Web.UI.MobileControls" Assembly="System.Web.Mobile" %>
<html xmlns="http://www.w3.org/1999/xhtml" >
<body>
<mobile:Form id="Form1" runat="server">    <!--表單-->
      <mobile:Label ID="z1" Runat="server" Font-Size="Large" ForeColor="#3333cc">登錄窗口</mobile:Label>
      <!--lbl_out：信息標籤，初始隱藏，登錄失敗後或退出系統時顯示信息-->
      <mobile:Label ID="lbl_out" Runat="server" ForeColor="Red" Visible="false"></mobile:Label> 
      用戶名:<br />
      <mobile:TextBox ID="tb_User" Runat="server" Size="10" ></mobile:TextBox><!--用戶名輸入框:tb_User-->
      密碼：<br />
      <mobile:TextBox ID="tb_Pwd" Runat="server" Size="10" Password="True"></mobile:TextBox><!--密碼輸入框:tb_Pwd-->
      <mobile:Command ID="Button1" Runat="server" OnClick="Button1_OnClick" >登錄</mobile:Command><!--登錄按鈕-->
</mobile:Form>
</body>
</html>

login.aspx.cs 後臺代碼具體如下：

using System;
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Web;
using System.Web.Mobile;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.MobileControls;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
using System.Data.SqlClient;
namespace testWap
{
    public partial class login : System.Web.UI.MobileControls.MobilePage
    {
        protected void Page_Load(object sender, EventArgs e)
        { 
            #region 系統退出時將信息標籤lbl_out賦值並且顯示 
            if (Session["loginOutInfo"] != null)
            {
                string outInfo = Session["loginOutInfo"].ToString();
                this.lbl_out.Text = outInfo;
                this.lbl_out.Visible = true;
                Session.Clear();
            } 
            #endregion 
        }
        /// <summary> 
        /// 登錄驗證 
        /// </summary> 
        /// <param name="sender"></param> 
        /// <param name="e"></param> 
        protected void Button1_OnClick(object sender, EventArgs e)
        {
            string username = this.tb_User.Text.Trim();
            string userpwd = this.tb_Pwd.Text.Trim();
            string strCon = "Data Source=(local);Database=wapDB;Uid=sa;Pwd=zxkj";
            string strSql = "select * from userinfo where user_name='"+username+"' and user_pwd='"+userpwd+"'";
            SqlConnection conn = new SqlConnection(strCon);
            conn.Open();
            SqlDataAdapter da = new SqlDataAdapter(strSql, conn);
            DataSet ds = new DataSet();
            da.Fill(ds);
            conn.Close();
            int rowCount = ds.Tables[0].Rows.Count;
            if (rowCount > 0)
            {
                Session["username"] = ds.Tables[0].Rows[0]["user_name"].ToString().Trim();
                Response.Redirect("index.aspx");
            }
            else
            {
                this.lbl_out.Text = "用戶名密碼錯誤，請重新登錄!";
                this.lbl_out.Visible = true;
            }
        }
    }
}

index.aspx 前臺代碼具體如下：

<%@ Page Language="C#" AutoEventWireup="true" Inherits="testWap.index" Codebehind="index.aspx.cs" %>
<%@ Register TagPrefix="mobile" Namespace="System.Web.UI.MobileControls" Assembly="System.Web.Mobile" %>
<html xmlns="http://www.w3.org/1999/xhtml" >
<body>
<mobile:Form id="Form1" runat="server">    <!--表單-->
<mobile:Label ID="lbl_uname" Runat="server"></mobile:Label>
<mobile:Label ID="wt" Runat="server" Font-Size="Large" ForeColor="Red">文章列表</mobile:Label>
<mobile:ObjectList ID="ObjectList1" Runat="server"><!--ObjectList控件-->
  <DeviceSpecific>
    <Choice>
      <ItemTemplate>
<mobile:Link Runat="server" Text='<%# ((ObjectListItem)Container)["doc_title"] %>' NavigateUrl='<%# "view.aspx?id="+((ObjectListItem)Container)["doc_id"]%>' ID="Title" NAME="Title" Wrapping="Wrap">
</mobile:Link>
      </ItemTemplate>
    </Choice>
  </DeviceSpecific>
</mobile:ObjectList>
<br />
<mobile:Label id="lbl_page" runat="server" Visible="False">1</mobile:Label><!--頁碼：lbl_page-->
<mobile:Label id="lbl_pagecount" runat="server" Visible="False">1</mobile:Label><!--總頁數：lbl_pagecount-->
<mobile:Link ID="lnk_top" Runat="server" BreakAfter="False">首頁 | </mobile:Link><mobile:Link id="lnk_pre" runat="server"> 上一頁</mobile:Link>
<mobile:Link id="lnk_end" runat="server" Visible="False" BreakAfter="false">尾頁 | </mobile:Link><mobile:Link id="lnk_next" runat="server"> 下一頁</mobile:Link>
<br />
<mobile:Label id="lbl_fabu" Runat="server">發佈文章:</mobile:Label>
<mobile:Label ID="lbl_error" Runat="server" Visible="false" ForeColor="Red"></mobile:Label>
<mobile:TextBox ID="tb_title" Runat="server"></mobile:TextBox>
<mobile:TextBox ID="tb_content" Runat="server"></mobile:TextBox>
<mobile:Command ID="Button2" Runat="server" OnClick="Button2_OnClick" BreakAfter="false">發表</mobile:Command><mobile:Command ID="Button1" Runat="server" OnClick="Button1_OnClick">退出</mobile:Command>
</mobile:Form>
</body>
</html>

index.aspx.cs 後臺代碼具體如下：

using System;
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Web;
using System.Web.Mobile;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.MobileControls;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
using System.Data.SqlClient;
namespace testWap
{
    public partial class index : System.Web.UI.MobileControls.MobilePage
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            if (Session["username"] == null)
            {
                Session["loginOutInfo"] = "登錄時間到，請重新登錄！";
                Response.Redirect("login.aspx");
            }
            this.lbl_uname.Text = "歡迎您："+(string)Session["username"];
            if (Session["ok"] != null)
            {
                this.lbl_error.Text = "發表成功!";
                this.lbl_error.Visible = true;
                Session["ok"] = null;
            }
            if (!IsPostBack)
            {
                Bind();
            }
        }
        private void Bind()
        {
            string rPage = Request.QueryString["Page"];
            int page = 1;
            if (rPage != null)
            {
                try
                {
                    page = int.Parse(rPage);
                }
                catch
                {
                    page = 1;
                }
            }
            Session["page"] = page;
            PagedDataSource ps = new PagedDataSource();
            string strCon = "Data Source=(local);Database=wapDB;Uid=sa;Pwd=zxkj";
            string strSql = "select * from document order by doc_id desc";
            SqlConnection conn = new SqlConnection(strCon);
            conn.Open();
            SqlDataAdapter da = new SqlDataAdapter(strSql, conn);
            DataSet ds = new DataSet();
            da.Fill(ds);
            conn.Close();
            ps.DataSource = ds.Tables[0].DefaultView;
            ps.AllowPaging = true;
            ps.PageSize = 5;
            ps.CurrentPageIndex = page - 1;
            this.lnk_top.Visible = true;
            this.lnk_pre.Visible = true;
            this.lnk_next.Visible = true;
            this.lnk_end.Visible = true;
            this.lnk_top.NavigateUrl = "index.aspx?page=1";
            this.lnk_pre.NavigateUrl = "index.aspx?page=" + (page - 1);
            this.lnk_next.NavigateUrl = "index.aspx?page=" + (page + 1);
            this.lnk_end.NavigateUrl = "index.aspx?page=" + ps.PageCount;
            if (page == 1)
            {
                this.lnk_top.Visible = false;
                this.lnk_pre.Visible = false;
            }
            if (page == ps.PageCount)
            {
                this.lnk_next.Visible = false;
                this.lnk_end.Visible = false;
            }
            if (ps.PageCount == 1)
            {
                this.lnk_top.Visible = false;
                this.lnk_pre.Visible = false;
                this.lnk_next.Visible = false;
                this.lnk_end.Visible = false;
            }
            this.lbl_pagecount.Text = Convert.ToString(ps.PageCount);
            this.ObjectList1.DataSource = ps;
            this.ObjectList1.DataBind();
        }
        protected void Button2_OnClick(object sender, EventArgs e)
        {
            string title = this.tb_title.Text.Trim();
            string content = this.tb_content.Text.Trim();
            if (title == "" || title == null || content == "" || content == null)
            {
                this.lbl_error.Text = "文章標題或內容不能爲空!!";
                this.lbl_error.Visible = true;
                return;
            }
            string strSql = "insert document values('" + title + "','" + content + "')";
            string strCon = "Data Source=(local);Database=wapDB;Uid=sa;Pwd=zxkj";
            SqlConnection conn = new SqlConnection(strCon);
            conn.Open();
            SqlCommand com = new SqlCommand(strSql, conn);
            com.ExecuteNonQuery();
            conn.Close();
            Session["ok"] = "ok";
            Response.Redirect("index.aspx");
        }
        protected void Button1_OnClick(object sender, EventArgs e)
        {
            try
            {
                Session.Clear();
                Session["loginOutInfo"] = "退出成功！";
            }
            catch
            {
                Session["loginOutInfo"] = "退出成功！";
            }
            Response.Redirect("login.aspx");
        }
    }
}

view.aspx 前臺代碼具體如下：

<%@ Page Language="C#" AutoEventWireup="true" Inherits="testWap.view" Codebehind="view.aspx.cs" %>
<%@ Register TagPrefix="mobile" Namespace="System.Web.UI.MobileControls" Assembly="System.Web.Mobile" %>

<html xmlns="http://www.w3.org/1999/xhtml" >
<body>
<mobile:Form id="Form1" runat="server">
<mobile:Label ID="Label1" Runat="server" ForeColor="#0000cc" >帖子內容</mobile:Label>
<mobile:Label ID="z1" Runat="server" ForeColor="#0066ff"> 標題：</mobile:Label>
<mobile:TextView ID="tv_title" Runat="server" Wrapping="Wrap"></mobile:TextView>
<mobile:Label ID="z2" Runat="server" ForeColor="#0066ff"> 內容：</mobile:Label>
<mobile:TextView ID="tv_Content" Runat="server" Wrapping="Wrap"></mobile:TextView>
<mobile:Link ID="lnk_FanHui" Runat="server" BreakAfter="false">返回上層</mobile:Link> | 
<mobile:Command ID="Command1" Runat="server" OnClick="Button1_OnClick">退出</mobile:Command>
</mobile:Form>
</body>
</html>

view

.aspx.cs 後臺代碼具體如下：

using System;
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Web;
using System.Web.Mobile;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.MobileControls;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
using System.Data.SqlClient;
namespace testWap
{
    public partial class view : System.Web.UI.MobileControls.MobilePage
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            if (Session["username"] == null || Session["page"] == null)
            {
                Session["loginOutInfo"] = "登錄時間到，請重新登錄！";
                Response.Redirect("login.aspx");
            }
            int docid = int.Parse(Request["id"].ToString());
            string strCon = "Data Source=(local);Database=wapDB;Uid=sa;Pwd=zxkj";
            string strSql = "select * from document where doc_id=" + docid;
            SqlConnection conn = new SqlConnection(strCon);
            conn.Open();
            SqlDataAdapter da = new SqlDataAdapter(strSql, conn);
            DataSet ds = new DataSet();
            da.Fill(ds);
            conn.Close();
            this.tv_title.Text = ds.Tables[0].Rows[0]["doc_title"].ToString();
            this.tv_Content.Text = ds.Tables[0].Rows[0]["doc_content"].ToString();
            int page = (int)Session["page"];
            this.lnk_FanHui.NavigateUrl = "index.aspx?page="+Convert.ToString(page);
        }
        protected void Button1_OnClick(object sender, EventArgs e)
        {
            try
            {
                Session.Clear();
                Session["loginOutInfo"] = "退出成功！";
            }
            catch
            {
                Session["loginOutInfo"] = "退出成功！";
            }
            Response.Redirect("login.aspx");
        }
    }
}

以上程序完畢，這是個簡單的發表分頁的wap項目，比較簡單，僅供參考，內容還有很多不完善之處，比如登錄的驗證需要完善，數據庫連接可以放到config中，這裏只是爲了簡單而寫成這樣的。

在wap開發中的一點心得：

需將文件另保存爲utf-8格式。

wap控件每個默認後面自動分行，若想不分行需將控件的BreakAfter屬性置爲False。

wap控件中的內容自動分行：Wrapping="Wrap"

快速上手wap網站開發

快速上手wap網站開發

今天天氣好冷啊！

MYSQL刪除表的記錄後如何使ID從1開始

我與ajax的第一次親密接觸！

開始的序章。

Mac下配置sublime實現LaTeX

https://yachay.unat.edu.pe/blog/index.php?comment_area=format_blog&comment_component=blog&comment_co

linux以太網驅動總結