界面设计

GUI界面设计

界面中划分了今天、明天和后天的区域，并且给天气数据设定了对应的显示控件，无论显示的是图片还是文字，采用的都是QLabel。

• 控件的对齐和绑定

维持界面的整洁，对齐非常关键，整个界面用了几个Layout来框定了需要显示的内容，等于把几个控件“绑定”为一个更大的控件，后续的位置和大小调整就会非常方便。

界面中红色方框的就是Layout，以最上面的输入框以及下拉框为例，用的就是Horizontal Layout，里面的各个控件都是水平对齐。

将这个Layout拖入主窗口，然后再往里面填其他控件。

• 非常有用的控件：Spacer

当你需要显示的内容需要调整位置时，可以往该控件的左边和右边插入Spacer控件，并调整Spacer的大小，等于在指定位置填充一个可调整大小的空白控件，达到调整控件位置的目的。当控件都排列在Layout中时，各个控件是按垂直或者水平排列的，如果不插入Spacer的话，各个控件就会挤到一起，显示出来就不好看了，所以我在界面中插入了很多的Spacer，将各个控件分离开来。

• 在QLabel控件显示图片

通过控件的setPixmap方法，可以在控件显示相应的图片。心知天气中可以下载天气现象的图片，查询到天气的code后，对应code的文件名即为天气现象的图标，所以可以在查询后，为控件更换图片。

QLabel.setPixmap(QtGui.QPixmap(imgfilename))

• 界面与逻辑分离

在Designer中，只有界面的设计，没有事件的定义。事件的定义需要继承设计的窗口类后自己添加。所以下拉菜单的选择、输入框的回车捕捉、按钮的点击等事件，要放到自己的主程序窗口代码中实现。