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界面包含的各个功能效果逐一分析及展现。