ステップ02
2. 操作手順（前回の操作の続き）
2.15 新しい D 層クラス ライブラリ プロジェクトの作成 (MySQL)
デフォルトの Class1.cs を削除し、アセンブリ名とデフォルトの名前空間名を変更します。
新しい DLayer クラスを作成する
Entity プロジェクトへの参照を追加する
MySQL への参照を追加します (この手順では MySQL が正常にインストールされている必要があります)
C:\Program Files (x86)\MySQL\Connector.NET 6.9\Assemblies\v4.5
MySQL WorkBench で新しいデータベースとデータ テーブルを作成する
同様にテストデータを追加します。
新しいプロジェクトの DLayer.cs のコードを変更し
、必要な名前空間を導入した後、SQLserver の D 層プロジェクトの元の DLayer コードを直接コピーし、conn、comm、dataadapter を対応する MySQL クラスに変更するだけです。
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Data;
using MySql.Data.MySqlClient;
using YYYDemo.Entity;
namespace YYYDemo.P_DLayer_MySQL
{
public class DLayer
{
//创建数据库连接
private MySqlConnection CreateConnection()
{
return new MySqlConnection(
"Database=数据库名称;DataSource=127.0.0.1;User=root;Pwd=root;port=3306"
);
}
//获取全部的账户信息，以Owner实体类类型返回
public IList<Owner> GetAllAccount()
{
List<Owner> owners = new List<Owner>();
MySqlConnection conn = CreateConnection();
conn.Open();
MySqlDataAdapter dAdp = new MySqlDataAdapter(
"SELECT * FROM owner", conn
);
DataSet dSet = new DataSet();
dAdp.Fill(dSet, "owner");
for (int i = 0; i < dSet.Tables[0].Rows.Count; i++)
{
Owner owner = new Owner();
owner.Oid = Convert.ToInt32(dSet.Tables[0].Rows[i][0].ToString());
owner.Name = dSet.Tables[0].Rows[i][1].ToString();
owner.Sex = Convert.ToChar(dSet.Tables[0].Rows[i][2].ToString());
owner.Phone = dSet.Tables[0].Rows[i][3].ToString();
owner.BuildNum = dSet.Tables[0].Rows[i][4].ToString();
owner.Unit = dSet.Tables[0].Rows[i][5].ToString();
owner.RoomNum = dSet.Tables[0].Rows[i][6].ToString();
owners.Add(owner);
}
conn.Close();
return owners;
}
//添加一个账户
public void AddAnAccount(Owner owner)
{
MySqlConnection conn = CreateConnection();
MySqlCommand cmd = new MySqlCommand(
string.Format(
"INSERT INTO owner(name,sex,phone,buildnum,unit,roomnum) " +
"VALUES(N'{0}','{1}',N'{2}',N'{3}',N'{4}',N'{5}')"
, owner.Name, owner.Sex, owner.Phone, owner.BuildNum, owner.Unit, owner.RoomNum),
conn
);
try
{
conn.Open();
cmd.ExecuteNonQuery();
}
catch (Exception e)
{
throw e;
}
finally
{
conn.Close();
}
}
//通过手机号获得一个账户的信息，以Owner实体类类型返回；
//这个函数是为了在B层通过手机号获取账户的id
public Owner GetAnAccountByPhone_TO_Owner(string phone)
{
MySqlConnection conn = CreateConnection();
conn.Open();
MySqlDataAdapter dAdp = new MySqlDataAdapter(
string.Format("SELECT * FROM owner WHERE phone=N'{0}'", phone),
conn);
DataSet dSet = new DataSet();
dAdp.Fill(dSet, "owner");
Owner owner = new Owner();
owner.Oid = Convert.ToInt32(dSet.Tables[0].Rows[0][0].ToString());
owner.Name = dSet.Tables[0].Rows[0][1].ToString();
owner.Sex = Convert.ToChar(dSet.Tables[0].Rows[0][2].ToString());
owner.Phone = dSet.Tables[0].Rows[0][3].ToString();
owner.BuildNum = dSet.Tables[0].Rows[0][4].ToString();
owner.Unit = dSet.Tables[0].Rows[0][5].ToString();
owner.RoomNum = dSet.Tables[0].Rows[0][6].ToString();
conn.Close();
return owner;
}
//通过id获得一个账户的信息，以Owner实体类类型返回
public Owner GetAnAccountByIndex_TO_Owner(int index)
{
MySqlConnection conn = CreateConnection();
conn.Open();
MySqlDataAdapter dAdp = new MySqlDataAdapter(
string.Format("SELECT * FROM owner WHERE Oid={0}", index),
conn);
DataSet dSet = new DataSet();
dAdp.Fill(dSet, "owner");
Owner owner = new Owner();
owner.Oid = Convert.ToInt32(dSet.Tables[0].Rows[0][0].ToString());
owner.Name = dSet.Tables[0].Rows[0][1].ToString();
owner.Sex = Convert.ToChar(dSet.Tables[0].Rows[0][2].ToString());
owner.Phone = dSet.Tables[0].Rows[0][3].ToString();
owner.BuildNum = dSet.Tables[0].Rows[0][4].ToString();
owner.Unit = dSet.Tables[0].Rows[0][5].ToString();
owner.RoomNum = dSet.Tables[0].Rows[0][6].ToString();
conn.Close();
return owner;
}
//修改一行信息
public void UpdateAnAccount(Owner owner)
{
MySqlConnection conn = CreateConnection();
MySqlCommand cmd = new MySqlCommand(
string.Format(
"UPDATE owner SET name=N'{0}',sex='{1}',phone=N'{2}',buildnum=N'{3}',unit=N'{4}',roomnum=N'{5}' " +
"WHERE Oid={6}; ", owner.Name, owner.Sex, owner.Phone, owner.BuildNum, owner.Unit, owner.RoomNum, owner.Oid),
conn
);
try
{
conn.Open();
cmd.ExecuteNonQuery();
}
catch (Exception e)
{
throw e;
}
finally
{
conn.Close();
}
}
//删除一行信息
public void DeleteAnAccount(int index)
{
MySqlConnection conn = CreateConnection();
MySqlCommand cmd = new MySqlCommand(
string.Format("DELETE FROM owner WHERE Oid = {0}", index),
conn);
try
{
conn.Open();
cmd.ExecuteNonQuery();
}
catch (Exception e)
{
throw e;
}
finally
{
conn.Close();
}
}
}
}
2.16 web.config を変更し、2 つの D 層プロジェクトの出力パスを設定する
変更前:
以下の図に示すように変更します。
2 つの D レイヤー プロジェクトの出力パスを変更します。
コメントを読んだ後、ここで出力パスの問題を説明してください。
2.17 新規クラスライブラリプロジェクトDAction（抽象データアクセス層プロジェクト）の作成
Entity プロジェクトへの参照を追加する
アセンブリ名とデフォルトの名前空間を変更する
新しいクラス (DAction_Class) を追加し、元の Class1.cs を削除します
(注: ここで新しく作成したクラスは実際にはインターフェイス タイプに変更する必要があるため、ここでそれに DAction_Class という名前を付けるのはあまり合理的ではありません)
DAction_Classのコードを変更する
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using YYYDemo.Entity;
namespace YYYDemo.DAction
{
public interface DAction_Class
{
IList<Owner> GetAllAccount();
void AddAnAccount(Owner owner);
Owner GetAnAccountByPhone_TO_Owner(string phone);
Owner GetAnAccountByIndex_TO_Owner(int index);
void UpdateAnAccount(Owner owner);
void DeleteAnAccount(int index);
}
}
2.18 新しいクラス ライブラリ プロジェクト DFactory (データ アクセス レイヤー ファクトリ) を作成する
アセンブリ名とデフォルトの名前空間を変更する
元の Class1.cs を削除し、新しいクラス DFactory_Class を作成します。
DAction プロジェクトへの参照を追加します。
以下の画像に示す参照を追加します。
DFactory_Class.csのコードを編集します。
著者：Bboy-AJ-Ren Jie
出典：CSDN
原文：https://blog.csdn.net/u013201439/article/details/51161230
教科書に書いてあることを守らないとうまくいきません。この問題を解決するためだけに、ここで長い間検索しました。
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Configuration;
using YYYDemo.DAction;
using System.Reflection;
namespace YYYDemo.DFactory
{
public sealed class DFactory_Class//数据访问层工厂
{
private DFactory_Class() {
}//数据访问层工厂构造器
public static DAction_Class DriveDLayer()
{
string path = ConfigurationManager.AppSettings["DAL"];
string className = path + ".DLayer";
return Assembly.Load(path).CreateInstance(className) as DAction_Class;
}
}
}
2.19 2 つのデータ アクセス層のコードを変更する
まず、両方の D レイヤー プロジェクトで DAction プロジェクトへの参照を追加します。
P_DLayer_MySQL プロジェクトの DLayer.cs コード:
名前空間を導入した直後に、DAction_Class という名前のこのインターフェイスから継承させます。
P_DLayer プロジェクトの DLayer.cs コード: (同じ操作)
2.20 B層プロジェクトを変更する
変更する前に、追加された参照を変更します。
変更後: (ここでは P_DLayer プロジェクトへの参照が削除されていることに注意してください)
BLayer.cs のコードの変更は、
DAction インターフェース型の関数を追加し、以前の D 層プロジェクトのクラスへの参照をインターフェース型変数への参照に変更することです。
以下の関数の参照が変更されましたが、2 つの検証関数は以前は D 層コードを呼び出していなかったため、変更する必要はありません。
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
//using YYYDemo.P_DLayer;
using System.Text.RegularExpressions;//正则表达式
using System.Runtime.InteropServices;//为了实现一个弹窗
using YYYDemo.Entity;
using YYYDemo.DAction;
using YYYDemo.DFactory;
namespace YYYDemo.P_BLayer
{
public class BLayer
{
private DAction_Class DriveDLayer()
{
return DFactory_Class.DriveDLayer();
}
//提示框，这两行照着写上即可，不必理解原理，会使用就行
[DllImport("User32.dll", SetLastError = true, ThrowOnUnmappableChar = true, CharSet = CharSet.Auto)]
public static extern int MessageBox(IntPtr handle, String message, String title, int type);
public IList<Owner> GetAllAccount()
{
//return new DLayer().GetAllAccount();
return DriveDLayer().GetAllAccount();
}
string errorStr = "";//这个也可以设置成局部变量，只不过让RegularCheck_Add(Update)_TO_Bool函数多传递一个参数而已。
//添加账户时正则表达式对输入数据的验证
private bool RegularCheck_Add_TO_Bool(Owner _owner)
{
errorStr = "";
bool flag = true;
string rStr_Name = "^[\u4e00-\u9fa5]{2,4}$";//2-4个中文
string rStr_Phone = @"^\d{11}$";//11位数字
string rStr_BuildNum_Unit_RoomNum = @"^\d{1,3}$";//1-3位数字
if (!Regex.IsMatch(_owner.Name, rStr_Name))
{
errorStr += "姓名应为2-4个汉字！\n";
flag = false;
}
if (!Regex.IsMatch(_owner.Phone, rStr_Phone))
{
errorStr += "号码应为11位数字！\n";
flag = false;
}
if (!Regex.IsMatch(_owner.BuildNum, rStr_BuildNum_Unit_RoomNum))
{
errorStr += "楼号应为1-3位数字！\n";
flag = false;
}
if (!Regex.IsMatch(_owner.Unit, rStr_BuildNum_Unit_RoomNum))
{
errorStr += "单元号应为1-3位数字！\n";
flag = false;
}
if (!Regex.IsMatch(_owner.RoomNum, rStr_BuildNum_Unit_RoomNum))
{
errorStr += "房间号应为1-3位数字！\n";
flag = false;
}
var owners = GetAllAccount();
bool equal_Phone = false;
bool equal_Position = false;
for (int i = 0; i < owners.Count; i++)
{
if (_owner.Phone == owners[i].Phone)
equal_Phone = true;
if (
_owner.BuildNum == owners[i].BuildNum &&
_owner.Unit == owners[i].Unit &&
_owner.RoomNum == owners[i].RoomNum
)
equal_Position = true;
}
if (equal_Phone)
{
errorStr += "联系电话不能重复！\n";
flag = false;
}
if (equal_Position)
{
errorStr += "住房位置不能重复！\n";
flag = false;
}
return flag;
}
//添加一个账户
public string AddAnAccount(Owner owner)
{
if (RegularCheck_Add_TO_Bool(owner))
{
errorStr = "新增业主信息成功！";
DriveDLayer().AddAnAccount(owner);
}
else
errorStr += "\n新增业主信息失败！";
return errorStr;
}
//通过手机号获取该行数据的索引，在U层中为下面的GetAnAccountByIndex_TO_DataSet()函数提供作用
public int GetIndexByPhone_TO_Int(string phone)
{
return Convert.ToInt32(
DriveDLayer().GetAnAccountByPhone_TO_Owner(phone).Oid);
}
//通过索引获取该行数据的全部信息，以Owner实体类类型返回
public Owner GetAnAccountBydIndex_TO_Owner(int index)
{
return DriveDLayer().GetAnAccountByIndex_TO_Owner(index);
}
//修改账户时正则表达式对输入数据的验证
//修改个人信息，需要验证 手机号 和 住房位置 是否 *跟别人* 重复；还需验证数据是否合理
private bool RegularCheck_Update_TO_Bool(Owner _owner)
{
errorStr = "";
bool flag = true;
string rStr_Name = "^[\u4e00-\u9fa5]{2,4}$";
string rStr_Phone = @"^\d{11}$";
string rStr_BuildNum_Unit_RoomNum = @"^\d{1,3}$";
if (!Regex.IsMatch(_owner.Name, rStr_Name))
{
errorStr += "姓名应为2-4个汉字！\n";
flag = false;
}
if (!Regex.IsMatch(_owner.Phone, rStr_Phone))
{
errorStr += "号码应为11位数字！\n";
flag = false;
}
if (!Regex.IsMatch(_owner.BuildNum, rStr_BuildNum_Unit_RoomNum))
{
errorStr += "楼号应为1-3位数字！\n";
flag = false;
}
if (!Regex.IsMatch(_owner.Unit, rStr_BuildNum_Unit_RoomNum))
{
errorStr += "单元号应为1-3位数字！\n";
flag = false;
}
if (!Regex.IsMatch(_owner.RoomNum, rStr_BuildNum_Unit_RoomNum))
{
errorStr += "房间号应为1-3位数字！\n";
flag = false;
}
var owners = GetAllAccount();
bool equal_Phone = false;
bool equal_Position = false;
for (int i = 0; i < owners.Count; i++)
{
if (owners[i].Oid != _owner.Oid)
{
if (_owner.Phone == owners[i].Phone)
equal_Phone = true;
if (
_owner.BuildNum == owners[i].BuildNum &&
_owner.Unit == owners[i].Unit &&
_owner.RoomNum == owners[i].RoomNum
)
equal_Position = true;
}
}
if (equal_Phone)
{
errorStr += "联系电话不能重复！\n";
flag = false;
}
if (equal_Position)
{
errorStr += "住房位置不能重复！\n";
flag = false;
}
return flag;
}
//修改一个账户的信息
public string UpdateAnAccount(Owner owner)
{
if (RegularCheck_Update_TO_Bool(owner))
{
errorStr = "修改业主信息成功！";
DriveDLayer().UpdateAnAccount(owner);
}
else
errorStr += "\n修改业主信息失败！";
return errorStr;
}
//删除一个账户
public string DeleteAnAccount(int index)
{
errorStr = "删除业主信息成功！";
DriveDLayer().DeleteAnAccount(index);
return errorStr;
}
}
}
コードを変更した後、ソリューションを再生成することをお勧めします。
将来データベースを切り替える場合は、web.config に必要なデータベースの値を表示するだけで済み、他のデータベースの値は非表示になります。
ここでは、MySQL データベースを使用してテストを実行します。
正常に動作しています。
これまでのプロジェクト間の参照関係図:
分割線 3
その前に、2.15～2.20で各種データベースへの対応が完了し、吐血の制作も完了しました。一晩経ちました。
2019-5-24 20:50:36
2.21 テーマフォルダーの追加
2019-5-28 10:24:10
2.22 ShowAll.aspx の GridView のプロパティ スタイル設定を変更する
ShowAll.aspx ページに戻り、GridView のスタイルを変更します。
①: 形式を変更します。
②：全列を中央に設定
次のようにすべてのフィールドを中央揃えにします。(属性によるスタイルの設定は .aspx コードにマップされます)
③：デザインパネルのGridViewのプロパティパネルで以下の設定を行います。
④:
VS のデザインインターフェースでは、下図のように表示されます。
ソースコード:
まず、GridView に SkinID を追加します。
<asp:GridView SkinID="ShowAll_GridView" ID="gView" runat="server"
AllowPaging="True"
AutoGenerateColumns="False" OnPageIndexChanging="gView_PageIndexChanging"
OnRowCommand="gView_RowCommand"
CellPadding="4" ForeColor="#333333" GridLines="None"
Font-Names="楷体" Font-Size="16pt" HorizontalAlign="Center" Width="100%"
>
<AlternatingRowStyle BackColor="White" />
<Columns>
<asp:BoundField DataField="Name" HeaderText="姓名" SortExpression="Name" >
<ItemStyle HorizontalAlign="Center" />
</asp:BoundField>
<asp:BoundField DataField="Sex" HeaderText="性别" >
<ItemStyle HorizontalAlign="Center" />
</asp:BoundField>
<asp:BoundField DataField="Phone" HeaderText="联系电话" SortExpression="Phone" >
<ItemStyle HorizontalAlign="Center" />
</asp:BoundField>
<asp:BoundField DataField="BuildNum" HeaderText="楼号" SortExpression="BuildNum" >
<ItemStyle HorizontalAlign="Center" />
</asp:BoundField>
<asp:BoundField DataField="Unit" HeaderText="单元" SortExpression="Unit" >
<ItemStyle HorizontalAlign="Center" />
</asp:BoundField>
<asp:BoundField DataField="RoomNum" HeaderText="房间号" SortExpression="RoomNum" >
<ItemStyle HorizontalAlign="Center" />
</asp:BoundField>
<asp:ButtonField CommandName="Y_Update" HeaderText="操作" ShowHeader="True" Text="修改">
<ItemStyle HorizontalAlign="Center" />
</asp:ButtonField>
<asp:ButtonField CommandName="Y_Delete" HeaderText="操作" ShowHeader="True" Text="删除" >
<ItemStyle HorizontalAlign="Center" />
</asp:ButtonField>
</Columns>
<FooterStyle BackColor="#990000" Font-Bold="True" ForeColor="White" />
<HeaderStyle BackColor="#990000" Font-Bold="True" ForeColor="White" />
<PagerStyle BackColor="#FFCC66" ForeColor="#333333" HorizontalAlign="Center" />
<RowStyle BackColor="#FFFBD6" ForeColor="#333333" />
<SelectedRowStyle BackColor="#FFCC66" Font-Bold="True" ForeColor="Navy" />
<SortedAscendingCellStyle BackColor="#FDF5AC" />
<SortedAscendingHeaderStyle BackColor="#4D0000" />
<SortedDescendingCellStyle BackColor="#FCF6C0" />
<SortedDescendingHeaderStyle BackColor="#820000" />
</asp:GridView>
上で選択したコードを Skin1 ファイルにコピーしますが、 と を削除してください
。 Skin1.skin ファイル内のコードは次のとおりです。
<asp:GridView SkinID="ShowAll_GridView" runat="server"
AllowPaging="True"
AutoGenerateColumns="False"
CellPadding="4" ForeColor="#333333" GridLines="None"
Font-Names="楷体" Font-Size="16pt" HorizontalAlign="Center" Width="100%"
>
<AlternatingRowStyle BackColor="White" />
<Columns>
<asp:BoundField DataField="Name" HeaderText="姓名" SortExpression="Name" >
<ItemStyle HorizontalAlign="Center" />
</asp:BoundField>
<asp:BoundField DataField="Sex" HeaderText="性别" >
<ItemStyle HorizontalAlign="Center" />
</asp:BoundField>
<asp:BoundField DataField="Phone" HeaderText="联系电话" SortExpression="Phone" >
<ItemStyle HorizontalAlign="Center" />
</asp:BoundField>
<asp:BoundField DataField="BuildNum" HeaderText="楼号" SortExpression="BuildNum" >
<ItemStyle HorizontalAlign="Center" />
</asp:BoundField>
<asp:BoundField DataField="Unit" HeaderText="单元" SortExpression="Unit" >
<ItemStyle HorizontalAlign="Center" />
</asp:BoundField>
<asp:BoundField DataField="RoomNum" HeaderText="房间号" SortExpression="RoomNum" >
<ItemStyle HorizontalAlign="Center" />
</asp:BoundField>
<asp:ButtonField CommandName="Y_Update" HeaderText="操作" ShowHeader="True" Text="修改">
<ItemStyle HorizontalAlign="Center" />
</asp:ButtonField>
<asp:ButtonField CommandName="Y_Delete" HeaderText="操作" ShowHeader="True" Text="删除" >
<ItemStyle HorizontalAlign="Center" />
</asp:ButtonField>
</Columns>
<FooterStyle BackColor="#990000" Font-Bold="True" ForeColor="White" />
<HeaderStyle BackColor="#990000" Font-Bold="True" ForeColor="White" />
<PagerStyle BackColor="#FFCC66" ForeColor="#333333" HorizontalAlign="Center" />
<RowStyle BackColor="#FFFBD6" ForeColor="#333333" />
<SelectedRowStyle BackColor="#FFCC66" Font-Bold="True" ForeColor="Navy" />
<SortedAscendingCellStyle BackColor="#FDF5AC" />
<SortedAscendingHeaderStyle BackColor="#4D0000" />
<SortedDescendingCellStyle BackColor="#FCF6C0" />
<SortedDescendingHeaderStyle BackColor="#820000" />
</asp:GridView>
次に、ShowAll.aspx ページでスタイルの変更をキャンセルします (スタイルはページから分離されているため、ページにはスタイル設定はありません)。
以下の画像のコード行に、Theme 属性を追加します。
これまでの ShowAll.aspx のコード
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ShowAll.aspx.cs"
Inherits="P_ULayer.ShowAll" Theme="主题1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>小区业主列表</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<div id="Div_lbl_Topic">
<asp:Label runat="server" ID="lbl_Topic" Text="小 区 业 主 列 表"></asp:Label>
</div>
<!--<div>
<asp:Button ID="btn1" runat="server" Text=" 1 " OnClick="btn1_Click" />
<asp:Button ID="btn2" runat="server" Text=" 2 " OnClick="btn2_Click" />
</div>-->
<div>
<br /><br />
<asp:HyperLink Target="_self" NavigateUrl="~/AddAccount.aspx" runat="server" ID="hLink_AddAccount" Text="新增业主"></asp:HyperLink>
<br /><br /><br /><br />
</div>
<asp:GridView SkinID="ShowAll_GridView" ID="gView" runat="server"
AllowPaging="True"
AutoGenerateColumns="False"
OnPageIndexChanging="gView_PageIndexChanging"
OnRowCommand="gView_RowCommand">
<Columns>
<asp:BoundField DataField="Name" HeaderText="姓名" SortExpression="Name" />
<asp:BoundField DataField="Sex" HeaderText="性别" />
<asp:BoundField DataField="Phone" HeaderText="联系电话" SortExpression="Phone" />
<asp:BoundField DataField="BuildNum" HeaderText="楼号" SortExpression="BuildNum" />
<asp:BoundField DataField="Unit" HeaderText="单元" SortExpression="Unit" />
<asp:BoundField DataField="RoomNum" HeaderText="房间号" SortExpression="RoomNum" />
<asp:ButtonField CommandName="Y_Update" HeaderText="操作" ShowHeader="True" Text="修改" />
<asp:ButtonField CommandName="Y_Delete" HeaderText="操作" ShowHeader="True" Text="删除" />
</Columns>
</asp:GridView>
</div>
</form>
</body>
</html>
2.23 テーマ 1 に CSS を追加する
テーマ 1 フォルダーの下に CSS スタイル シートを追加し、背景画像として画像をドラッグします。
StyleSheet1.css を変更します。
body {
width: 100%;
background-attachment: fixed;
background-image: url(BgImage3.jpg);
background-repeat: no-repeat;
background-size: 100% 100%;
}
#form1 {
width: 60%;
margin: 0 auto;
font-family: "楷体";
}
#Div_lbl_Topic {
margin: 5% auto 0;
width: 80%;
font-size: 80px;
text-align: center;
color: cyan;
}
#hLink_AddAccount {
font-size: 36px;
color: blue;
float: right;
}
テストを実行します。
cssとaspxのプロパティ設定によりShowAll.aspxページのスタイル設定が完了しました。以下がコンテンツページのスタイル設定です。
2.24 コンテンツページのスタイル設定
以前デザインした際、マスターページのTextBoxコントロールにフォント16スタイルが設定されていましたが、現在は全て削除されています
CSS スタイルの変更を続けます
#hLink_AddAccount {
font-size: 36px;
color: blue;
float: right;
}
/*上面为ShowAll*/
body {
width: 100%;
background-attachment: fixed;
background-image: url(BgImage3.jpg);
background-repeat: no-repeat;
background-size: 100% 100%;
}
#form1 {
width: 60%;
margin: 0 auto;
font-family: "楷体";
}
#Div_lbl_Topic {
margin: 5% auto 0;
width: 80%;
font-size: 80px;
text-align: center;
color: cyan;
}
/*下面为两个内容页*/
#Div_hLink_TO_01 {
font-size: 40px;
margin-left: 5%;
margin-top: 2%;
}
#tableUI {
font-size: 30px;
font-family: "楷体";
margin: 0 auto;
width: 100%;
}
.td_Left {
text-align: right;
}
#Div_btnSubmit {
margin: 0 auto;
width: 100px;
}
.CSS_class_btnSubmit {
font-size: 32px;
font-family: "楷体";
color: black;
background-color: cyan;
}
Skin1.skinを変更する
<asp:GridView SkinID="ShowAll_GridView" runat="server"
AllowPaging="True"
AutoGenerateColumns="False"
CellPadding="4" ForeColor="#333333" GridLines="None"
Font-Names="楷体" Font-Size="16pt" HorizontalAlign="Center" Width="100%"
>
<AlternatingRowStyle BackColor="White" />
<Columns>
<asp:BoundField DataField="Name" HeaderText="姓名" SortExpression="Name" >
<ItemStyle HorizontalAlign="Center" />
</asp:BoundField>
<asp:BoundField DataField="Sex" HeaderText="性别" >
<ItemStyle HorizontalAlign="Center" />
</asp:BoundField>
<asp:BoundField DataField="Phone" HeaderText="联系电话" SortExpression="Phone" >
<ItemStyle HorizontalAlign="Center" />
</asp:BoundField>
<asp:BoundField DataField="BuildNum" HeaderText="楼号" SortExpression="BuildNum" >
<ItemStyle HorizontalAlign="Center" />
</asp:BoundField>
<asp:BoundField DataField="Unit" HeaderText="单元" SortExpression="Unit" >
<ItemStyle HorizontalAlign="Center" />
</asp:BoundField>
<asp:BoundField DataField="RoomNum" HeaderText="房间号" SortExpression="RoomNum" >
<ItemStyle HorizontalAlign="Center" />
</asp:BoundField>
<asp:ButtonField CommandName="Y_Update" HeaderText="操作" ShowHeader="True" Text="修改">
<ItemStyle HorizontalAlign="Center" />
</asp:ButtonField>
<asp:ButtonField CommandName="Y_Delete" HeaderText="操作" ShowHeader="True" Text="删除" >
<ItemStyle HorizontalAlign="Center" />
</asp:ButtonField>
</Columns>
<FooterStyle BackColor="#990000" Font-Bold="True" ForeColor="White" />
<HeaderStyle BackColor="#990000" Font-Bold="True" ForeColor="White" />
<PagerStyle BackColor="#FFCC66" ForeColor="#333333" HorizontalAlign="Center" />
<RowStyle BackColor="#FFFBD6" ForeColor="#333333" />
<SelectedRowStyle BackColor="#FFCC66" Font-Bold="True" ForeColor="Navy" />
<SortedAscendingCellStyle BackColor="#FDF5AC" />
<SortedAscendingHeaderStyle BackColor="#4D0000" />
<SortedDescendingCellStyle BackColor="#FCF6C0" />
<SortedDescendingHeaderStyle BackColor="#820000" />
</asp:GridView>
<asp:TextBox Font-Size="16pt" Font-Names="楷体" runat="server"></asp:TextBox>
次に、両方のコンテンツ ページのコードの最初の行に Theme 属性を追加します。
テストを実行します。
2.25 いくつかのトピックを自由に追加してください
ここでは何気なく設定し、別のテーマ フォルダー (下図を参照) に保存し、ShowAll.aspx AddAccount.aspx AlterAccount.aspx の 3 ページの Theme プロパティを「Theme 2」に変更します。
下の写真は私が設定したテーマ 2 です。
2.26 テーマの動的な切り替えを実現
ShowAll.aspxのコードを変更する
次に、2 つのテーマの CSS で新しく追加したコントロールのスタイルを変更します。
ShowAll.aspx.cs のコードを変更します。
AlterAccount.aspx.cs のコードを変更します。
AddAccount.aspx.cs のコードを変更します。
2019-5-28 14:03:31
テストを実行します: (ジャンプを自分でテストできます)
ここでは私は普通です。2019-5-28 19:27:54
分割線 4
2019-5-30 00:27:15
スタイルを少し修正してテーマを追加し、合計3つのテーマになりました。
プロジェクトレポートの提出期限があり、あまり時間がないため、それが最終バージョンになる可能性が非常に高いです。アバターとしての写真のアップロードや複数選択など、まだ追加されていない機能は追加されないかもしれませんが、もしかしたらあるかもしれません。。。