flutter实现图片拉伸点9图

在flutter中，如果相对一张图片进行中间部分拉伸或压缩，实现类似原生点9图的效果，

通过使用DecorationImage对centerSlice属性进行设置可以实现

Container(
      width: 100.w,
      height: 150.w,
      decoration: BoxDecoration(
          image: DecorationImage(
              image: AssetImage(
                   Assets.ItemBg,
              ),
               centerSlice: const Rect.fromLTRB(25, 25, 75, 125),
              fit: BoxFit.fill,
          ),
       ),
       child: Text("111"),
   )

会根据centerSlice对图片设置的对应中间部分进行拉伸,这里设置的是拉伸区域

注意centerSlice的设置需要满足条件，图片的不可拉伸部分需要小于容器大小
例如设置的centerSlice为Rect.fromLTRB(left, top, right, bottom),
图片实际尺寸为width*height，容器尺寸为containerW*containerH,
需满足

containerW > (width - (right - left) )
containerH > (height - (bottom - top) )

否则会出现如下错误

The following assertion was thrown during paint():
centerSlice was used with a BoxFit that does not guarantee that the image is fully visible.
'package:flutter/src/painting/decoration_image.dart':
Failed assertion: line 535 pos 12: 'sourceSize == inputSize'