显示图片预览
编辑该页面显示图片预览
这是一个完整的工作的例子,一个方法添加图像预览SonataAdmin创建和编辑视图。
的必备条件
- 你已经得到了图像文件在某个服务器上,有一个辅助方法来检索公开可见的URL的形象,在这个例子中调用该方法
图片::getWebPath () - 您已经建立了一个管理编辑的对象包含了图片,现在你想添加预览。在这个例子中调用这个类
ImageAdmin
请注意
有一个单独的食谱配方来演示如何使用SonataAdmin上传图片(和其他文件)。
菜谱
您可以使用Symfonyob娱乐下载“帮助”和“help_html”选项,将原始HTML表单字段。我们将使用此功能嵌入一个图像标记当图像存在。
要做到这一点,我们需要:
- 获得的
图像从内部实例ImageAdmin - 基于图像的创建一个图像标记的URL
- 添加一个“帮助”和“help_html”选择一个字段在图像形式来显示图像标记
为了这个例子中,我们将使用一些基本的CSS预览图像大小的限制(我们不会生成并保存特殊缩略图)。
基本的例子——单层管理员
如果我们直接处理ImageAdmin类之后的图像可以通过调用实例$ this - > getSubject ()。因为我们从内部操作表单字段我们这样做ImageAdmin: configureFormFields ():
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21日22日23日24
最后类ImageAdmin扩展AbstractAdmin{受保护的函数configureFormFields(FormMapper美元形式):无效{/ /获取当前图像实例美元图像=美元这- >getSubject ();/ /使用$ fileFormOptions所以我们可以添加其他选项美元fileFormOptions= (“要求”= >假];如果(美元图像& & (美元webPath=美元图像- >getWebPath ())) {/ /获取请求所以可以设置图像的完整路径美元请求=美元这- >getRequest ();美元fullPath=美元请求- >getBasePath ()。' / '。美元webPath;/ /添加一个“帮助”选项包含预览的img标记美元fileFormOptions(“帮助”]=< img src = "的。美元fullPath。”class =“admin-preview " / >;美元fileFormOptions(“help_html”]=真正的;}美元形式- >add (“文件”,“文件”,美元fileFormOptions);}}然后,我们使用CSS来限制的最大大小图片:
1 2 3 4
img.admin-preview{max-height:200 px;max-width:200 px;}这就是一切!
然而,这种方法不工作的时候ImageAdmin可以嵌入到其他管理员使用吗奏鸣曲字段类型。我们需要…
先进的例子——适用于嵌入式管理员
当一个管理嵌入到另一个管理员,$ this - > getSubject ()不返回实例管理下的嵌入式管理。相反,我们需要检测,我们的管理类是嵌入式和使用不同的方法:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17日18 19 20 21日22日23日24日25日26日27 28 29 30 31 32
最后类ImageAdmin扩展AbstractAdmin{受保护的函数configureFormFields(FormMapper美元形式):无效{如果(美元这- >hasParentFieldDescription ()) {/ /这是嵌入式管理/ /美元getter将类似“getlogoImage”美元getter=“得到”。美元这- >getParentFieldDescription ()- >getFieldName ();/ /得到父对象美元父=美元这- >getParentFieldDescription ()- >getAdmin ()- >getSubject ();如果(美元父){美元图像=美元父- >美元getter ();}其他的{美元图像=零;}}其他的{美元图像=美元这- >getSubject ();}/ /使用$ fileFormOptions所以我们可以添加其他选项美元fileFormOptions= (“要求”= >假];如果(美元图像& & (美元webPath=美元图像- >getWebPath ())) {/ /添加一个“帮助”选项包含预览的img标记美元fileFormOptions(“帮助”]=< img src = "的。美元webPath。”class =“admin-preview " / >;美元fileFormOptions(“help_html”]=真正的;}美元形式- >add (“文件”,“文件”,美元fileFormOptions);}}正如你所看到的,唯一的变化就是我们如何检索集美元图片有关图像实例。当我们ImageAdmin嵌入我们首先需要得到父对象然后使用getter来检索图像。从那里,其他的都是相同的。
笔记
如果你有超过一个的嵌入管理员(可能)不工作。如果你知道一个更通用的解决方案,请在GitHub叉和更新这个食谱。类似地,如果有任何错误或拼写错误(或更好的方法)参与并分享你的见解,造福所有人。
这项工作,包括代码示例,许可下Creative Commons冲锋队3.0许可证。
