免费网站视频主持人电子商务网站建设 下载
- 新建项目，因为我的Main页面做了其他的东西，所以我在这里新建一个form
File -> New -> From(Unigui) -> 登录窗体
- 添加组件：FDConnection，FDQuery，DataSource，Unipanel和几个uniedit，一个unibutton
首先连接数据库：FDConnection1 -> Connection Editor
Database：数据库名称
User_Name：用户名
PassWord：用户名的密码
Server：服务器，其中127.0.0.1默认为本地
点击Connection1的属性active，当active显示为true数据库连接成功
然后，FDQuery1 -> Connection -> FDConnection1
最后，DataSource -> DataSet -> FDQuery1
- 为输入账号的Uniedit1设置FieldLabel属性为用户名：，同理将输入密码的UniEdit2设为密码：
- 添加验证码，可见文章：unigui 图形验证码-CSDN博客
- 为按钮UniButton1添加登录事件,其中这段代码中为密码做了MD5加密处理
MD5加密可看文章：MD5加密-CSDN博客
procedure TUniLoginForm1.UniButton1Click(Sender: TObject);
beginFDQuery1.Close;tryFDQuery1.SQL.Text:='select * from logon where id=:aid and passwords=:apasswords';FDQuery1.Params.ParamByName('aid').Value:=uniedit1.Text;FDQuery1.Params.ParamByName('apasswords').Value:=THashMD5.GetHashString(uniedit2.Text);FDQuery1.open;finallyend;if uniedit3.text <> captchastring thenbeginshowmessage('验证码错误');uniimage1click(sender);endelse if FDQuery1.RecordCount<1 thenbeginshowmessage('账号或密码错误！');end elsemessagebox(Handle,'登陆成功！','成功',MB_OK);end;我的数据库登录表的结构是在wldy数据库中创建logon表
use wldy
create table logon
(
id int primary key,
passwords varchar(255)
)- 将form设为和浏览器大小相同，并且Unipanel永远在浏览器的中心
procedure TUniLoginForm1.UniLoginFormScreenResize(Sender: TObject; AWidth,AHeight: Integer);
beginuniloginform1.Height:=AHeight;uniloginform1.Width:=AWidth; //设form和浏览器一个大小unipanel1.Left:=(AWidth - unipanel1.width ) div 2;unipanel1.Top:=((AHeight - unipanel1.Height) div 2)+12; //unipanel在浏览器的中间
end;- 将unipanel1设为圆角
在serverModule中CustomCSS中输入变圆角的代码，其中paneladd是名称，点击确定
.paneladd {border-radius: 10px; /* 设置内容区域的圆角半径为10px */
}回到页面中，UniPanel1 -> LayoutConfig -> Cls -> 添加paneladd
- 添加unipanel。点击unipanel1，添加一个unipanel，这样能够使新添加的unipanel是unipanel1的子类
