新建一个文件，放在 lib/post/show/components 里面，名字是 post_show_media.dart ，在文件里定义一个小部件，名字是 PostShowMedia ，文件顶部导入 provider 这个包。

小部件里添加一个属性，类型是 Post 名字是 post，一个构造方法 PostShowMedia，给它一个参数，this.post。

小部件里可以先用一个 Observer ，设置一下它的 builder ，这个 builder 最终 return 的东西可以先用一个 SliverToBoxAdapter 。

打开 post_content_view，在这个 slivers 里面，可以再添加一个 PostShowMedia 小部件，提供一个 post 参数。回到继续编辑这个小部件。

在这个 Observer 的 builder 里面，声明一个 postShowStore，值是 context.read，类型是 PostShowStore，下面声明一个 mediaAspectRatio，值是 postShowStore.mediaAspectRatio。

再声明一个 Widget ，名字是 media ，它的值可以是 PostMedia 这个小部件，post 参数的值设置成 post 。

下面判断一下，如果 mediaAspectRatio 不等于 0 ，并且 mediaAspectRatio 也不等于 null ，重新设置一下 media 的值，等于一个 AspectRatio ，里面添加一个 aspectRatio 参数，值是 mediaAspectRatio ，它的 child 可以是一个 PostMedia ，把 post 参数的值设置成 post。

然后在这个 SliverToBoxAdapter 里面，设置一下它的 child 值是一个 Container，里面用 padding 添加点边距，EdgeInsets.symmetric ，horizontal 设置成 8 。它的 child 是 media。

测试

在模拟器上测试一下，按一下比例小图标，可以选择要使用的媒体比例，你会发现，内容图像的比例会发生变化。

恢复

重建这个小部件的时候可以恢复一下用户之前选择的图像比例，这里我们可以把这个小部件转换成一个 StatefullWidget ，带状态的小部件。

然后在 State 这个类里面添加一个 initState 方法，在这个方法里，用一下 context.read，类型是 PostShowStore，用一下 restoreMediaAspectRatio 这个方法。

重新启动一下应用，再打开一个内容项目，你会发现，内容图像仍然会使用用户之前选择的比例显示。