WPF—QQ界面(一):QQ界面的整体布局

15年6月底初学C#的WPF,在此之前对软件编程行业基本上相当于小白,从此漫漫程序路。

把C#的基本语法看了一遍,高级教程还没看,在师兄的提点下,开始尝试着写QQ的界面。

先将界面包含的各个效果分块写成随笔,期间遇到各种问题,要么请教师兄、同学,要么上网查阅大牛们写的博客(此后所有的文章中若有冒犯,请私信),如文中出现不当或者不够优化的代码,望广大博友积极指出,谢谢!

编译环境:windows 8.1 + VS2013

先上效果图:

整体布局我采用Grid来做,将整个界面分成9行(其中两行是空的),接着在各个网站找小图标(For exp:www.iconfont.cn公开图标库),将这些小图标添加进界面即可。

将图标添加进界面的详细步骤:(可以以Button或Image两种方式添加)

1,在解决方案处右键添加——新建文件夹,重命名为A,此时在本地也会生成一个同名的文件夹,将找好的小图标放进该A文件夹;

2,找到Properties下的Resources.resx 并双击,在弹出的Resources.resx的窗口中点击“添加资源”——添加现有文件,将A文件夹的图片导入资源库;

3,此时在解决方案下的A文件夹中就有了你导入的图片,选中该图片右键——属性,在属性栏的“生成操作”中选择“Resource”,此时我们就可以在代码中引用这张图片了。

4,例如我用Image将这张图片添加到界面中,

<Image  Source="emotion/online2.png" />

上行代码中的source 是图片源,能够索引图片的位置,emotion相当于A文件夹,online2.png是图片名,此时图片就能在Xaml的设计器中显示了。

。。。。。

重复这样的步骤,能够将大致的界面布局完成,添加文本框和文本块这样的简单操作在这里我就不一一赘述了。

接下来的随笔将会对这个QQ界面包含的各个功能效果逐一分析及展示。

原文地址:https://www.cnblogs.com/danieldong/p/5095868.html