Qt使用九宫格原理缩放图片

2020.07.21更新

一.QSS

关于九宫格，首先要学习下QSS的border-image，Qt Assistant中关于Border Image有如下介绍：
A border image is an image that is composed of nine parts (top left, top center, top right, center left, center, center right, bottom left, bottom center, and bottom right). When a border of a certain size is required, the corner parts are used as is, and the top, right, bottom, and left parts are stretched or repeated to produce a border with the desired size.
See the CSS3 Draft Specification for details.
Border Image是由九个部分（左上、中上、右上、左中、中、右中、左下、左下、中下和右下）组成的图像。当Border Image应用到指定目标时，四个角的部分原样使用，并拉伸或平铺顶部、右侧、底部和左侧部分，以生成符合目标尺寸的边框。
具体参考CSS3语法
也就是说border-image在贴图时可以指定参数，将图片分成九个部分，分别贴到目标的相应位置，即通常说的九宫格贴图。
9宫格缩放规则如下：
1、将一张图分割成9块
2、四个角(1、3、7、9)在缩放的时候是保持大小不变
3、图块2、8仅当宽度变化时缩放宽度
4、图块4、6仅当高度变化时缩放高度
5、图块5当图片大小发生变化，宽度和高度都进行缩放