qss九宫格分割法

九宫格分割法

九宫格分割法，将边界图利用四条分割线，分割成九个格子，固定左上、右上、右下、左下的格子大小不变，对其余的五个格子进行缩放（平铺、拉伸）。边界图设置后，为了防止边角发生形变，相对的要设置各个方向参数一致的border-width。
示例代码如下：

#pushButton_3{
	border-image:url(:/new/prefix1/images/song.jpg) 60 60 60 60;
	border-width:60;
}

#pushButton_4{
	border-image:url(:/new/prefix1/images/song.jpg) 100 2 100 10 ;
	border-top:100;
	border-right:2;
	border-bottom:100;
	border-left:10;
}

图片分割的四个参数的含义分别是：
参数一：上分割线距离顶部边界的像素点个数
参数二：右分割线距离右边界的像素点个数
参数三：下分割线距离底部边界的像素点个数
参数四：左分割线距离左边界的像素点个数
只要记住顺序：“上–右--下–左”的顺序即可
理解了参数的意思，那么border-width的设置就可以理解了，也分别对应了了border-width的“上–右--下–左”。
注：如果四个方向值相同，那么可以直接写border-width:值 ，否则需要单独指定不同方向上对应的值

缩放方式

拉伸方式有：拉伸(stretch)、平铺(round)两种方式

平铺（round）

添加参数 round，即可实现平铺效果

QWidget{

	border-image:url(:/new/prefix1/images/test.jpg)4 4 4 4 round round;
	border-width:4px;
}	

拉伸（stretch）

添加参数stretch，实现拉伸效果

QWidget{
	border-image:url(:/new/prefix1/images/test.jpg)4 4 4 4 strech strech;
	border-width:4px;
}