Deweb 开发用户头像上传与读取功能

我这个功能是基于dwFrame框架开发的，原始代码可以通过下面的网址导出。

dwFrame Creator

原始代码里的用户头像是固定的，我在这个框架的基础上加入了头像上传和读取的功能，这样不同的用户登录就可以显示不同的头像，也可以使用自己上传的图片当头像。

首先要调整一下数据库，原代码用的是access数据库，如果你也用的是access就不用看这一步了。我用的是mysql，这个功能用到的数据库表名为wms_user，在mysql里新建一个同样的表，或者直接把access里的表导入到mysql里。

deweb连接mysql的问题可以看我另一篇文章：Delphi Deweb连接Mysql的一些小技巧_tradiance的博客-CSDN博客

在工程中新建一个form，这个form用来上传头像，放入一个image和两个button，image用来显示刚刚上传的图片，button1用来上传图片，button2用来写入数据库。

procedure TForm_ModifyPSD.Button1Click(Sender: TObject);
begin
  dwUpload(Self, '.jpg,.png,.jpeg', 'media/images/dwms/');
end;

dwUpload完成会自动激活onEndDock事件，这一步是在image中强制刷新刚上传的图片，sFile在public中定义。

procedure TForm_ModifyPSD.FormEndDock(Sender, Target: TObject; X, Y: Integer);
begin
  sFile := dwGetProp(TForm1(Self.Owner), '__upload');
  Image1.Hint:= '{"src":"media/images/dwms/'+sFile+'?time='+IntToStr((DateTimeToUnix(Now)-86060)*1000)+';"}';
end;

下面这一步是把刚上传的图片的文件名写入到对应的用户名下，同时强制更新主页面的头像为刚上传的图片。这里用到的参数username在public中定义，值是从主unit中传过来的。

procedure TForm_ModifyPSD.Button2Click(Sender: TObject);
begin
  FDQuery1.Close;
  FDQuery1.SQL.Text := 'SELECT * FROM wms_user WHERE username = ' + ''''+userName+'''';
  FDQuery1.Open;
  with FDQuery1 do
  begin
    Edit;
    FieldByName('photo').AsString := sFile;
    Post;
  end;
  TForm1(self.owner).Im_Avatar.Hint:= '{"src":"media/images/dwms/'+sFile+'?time='+IntToStr((DateTimeToUnix(Now)-86060)*1000)+';"}';
  dwMessage('头像修改成功!', 'success', self);
end;

 这个form的内容就结束了，下面回到主unit1，在public中定义一个sPhoto:string用来储存读取到的文件名。

找到dwfCheckLogin事件，前两行是自带的，第三行是要加入的代码，找到对应位置加进去就可以了。

gsUserName := FDQuery1.FieldByName('UserName').AsString;
gsRole := FDQuery1.FieldByName('usergroup').AsString;
sPhoto:=FDQuery1.FieldByName('photo').AsString;

然后找到FormShow事件，第5行是需要新加入的代码。

B_Logout.Visible := True;
L_User.Visible := True;
L_User.Left := 0;
L_User.Caption := gsUserName;
Im_Avatar.Hint:= '{"src":"media/images/dwms/'+sPhoto+'?time='+IntToStr((DateTimeToUnix(Now)-86060)*1000)+';"}';

到此结束。

在前边新建的form中可以进一步开发，在界面上放一个scrollbox，然后在scrollbox里放一些image，可以在界面打开的时候直接显示一些头像供用户选择，操作方法类似。