我们先去自己定义一个可以重复使用的图标徽章小部件 .. 先添加一个类 .. 名字是 IconBadge ... 让它继承一下 StatelessWidget ..

类里面添加两个属性 .. final IconData .. 数据的类型是 IconData ... 名字是 icon .. 再添加一个 size ... final .. 类型是 double .. 名字是 size ..

添加一个构造方法 .. IconBadge .. this.icon ... 一个对象 ... 里面再添加一个 this.size ... 可以给它一个默认的值 .. 32.0 ..

这样在使用这个 IconBadge 的时候，我们可以设置一下小部件里面要使用的小图标是什么 .. 还可以设置一个尺寸 ..

下面添加一个 build 方法 .. 让它先 return 一个 Container .... 这个 Container 的 child .. 是个 Icon .. 图标是 icon 属性指的 ... 图像的 size ，也就是尺寸 .. 是 size 属性设置的 .. 再添加一个 color ... 图标的颜色设置成白色 ..

可以再设置一下这个 Container 的宽度，还有高度 .. 添加一个 width .. 它的值可以用一下 size 的值加上 60 ... 再设置一下 height，高度... 它的值也是 size 的值加上 60 ..

再添加一个 color 属性，设置一下 Container 的背景颜色 .. 颜色用一下 Color 的 fromRGBO .. 3, 54, 255, 1.0 ...

现在我们就定义好了这个小部件 .. 再找个地方用一下它 .. 在上面这个 LayoutDemo 里面 ..

用一下这个 IconBadge ... 设置一下要显示的小图标 .. Icons.pool ..

在界面上，你会看到一个蓝色背景的小图标 .. 我们可以把这个 IconBadge 放在一个 Column 里面 .. 添加一个 Column 小部件 .. 里面有一个 children 属性 ... 它的值是一组小部件 .. 里面添加一个 IconBadge ...

现在这个小部件会使用它原本设置的尺寸 ..

使用它的时候还可以设置一个尺寸 .. 添加一个 size 属性 .. 把它设置成 64.0 ... 这样它会比之前大一些 .. 如果不添加这个 size 属性的话 ... 小部件会使用默认给它的 size 的值 ...