# nine_images_tools

**Repository Path**: xjdd/nine_images_tools

## Basic Information

- **Project Name**: nine_images_tools
- **Description**: Flutter 9图处理工具，根据内容展示区域拉伸区域
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: main
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2023-03-23
- **Last Updated**: 2023-04-11

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 9图工具

### Version[1.0.1]
在Flutter中并不能直接使用 `.9.png` ;这里通过`ImageProvider`获取到图片的所有像素点的坐标系，并且判断出每个边界一个像素的黑色区域边界坐标轴，这样我们就知道了9图的填充区域和拉升区域。

1. 拉伸区域只能使用 `centerSlice`这个属性来是图片的进行拉伸大小。我们根据属性填充我们需要拉伸的区域填充进去即可`Rect.fromLTRB(this.left, this.top, this.right, this.bottom)`
2. 填充区域，拉伸区域有了之后需要再处理填充区域，这里使用的`Container`中`padding`属性来填充四个边，使得我们内容展示区域就是我们想要的区域，`EdgeInsets.fromLTRB(this.left, this.top, this.right, this.bottom)`
3. 我们在裁切9图边缘区域，去掉黑色像素即获得了我们想要干净可拉伸区域。

1.使用方式如下:

```dart
  NineImage(
    //imageProvider 图像处理
    imageProvider: AssetImage("images/private_bubble_baron.9.png"),
    //内容填充区域
    child: Text(
      "sadasdasdasdas",
      style: TextStyle(color: Colors.white),
    ),
  )
```

![](/images/WeChat86789805a021efda45e34ce3c6a84e7b.png)

目前还有个问题就是关于像素倍率压缩问题。目前推荐使用一倍图。