Question

我正在尝试在5个不同的标签中添加5个智能图像。 xtype是html5smartimage。

我使用文件引用在jsp中渲染。

即

<img src="<%=properties.get("fileReference1")%> //different reference for different smartimages

我尝试使用Image组件

Image image = new Image(resource, "firstimage");

image.setSelector(".img");

String text = properties.get("text", "TEXT NA");

String path = currentStyle.get("path", "PATH NA");
%>
<h2><%= path %></h2>
<%= text %>
<%
image.draw(out);
%>

但它没有用。

第一种方法有效但当我再次尝试编辑时，图像消失，裁剪被禁用。任何人都可以让我知道该怎么做？

dialog.xml：

Answer 1

由于图像servlet的工作原理，无法更改smartimage小部件的属性名称，并且必须是fileReference，fileName，imageCrop，imageMap等。为了在单个对话框中拥有多个smartimage小部件，您需要将图像数据存储为资源下的子节点，并确保它是一个sling：扩展parbase的组件的resourceType。下面的示例配置是如何支持多个智能映像小部件的示例。在对话框将信息存储在正确的位置后，您可以执行resource.getChild（“image1”）。adaptTo（Image.class）和resource.getChild（“image2”）。adaptTo（Image.class）来获取图像对象为您的不同图像。

<?xml version="1.0" encoding="UTF-8"?>
<jcr:root xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0"
          xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
          jcr:primaryType="cq:Dialog"
          title="Multiple Smart Images"
          xtype="dialog">
    <items jcr:primaryType="cq:TabPanel">
        <items jcr:primaryType="cq:WidgetCollection">
            <tab1
                jcr:primaryType="cq:Panel"
                title="Image Properties">
                <items jcr:primaryType="cq:WidgetCollection">
                    <image1ResType
                        jcr:primaryType="cq:Widget"
                        ignoreData="{Boolean}true"
                        name="./image1/sling:resourceType"
                        value="foundation/components/image"
                        xtype="hidden"/>
                    <image2ResType
                        jcr:primaryType="cq:Widget"
                        ignoreData="{Boolean}true"
                                    name="./image2/sling:resourceType"
                        value="foundation/components/image"
                        xtype="hidden"/>
                </items>
            </tab1>
            <tab2
                jcr:primaryType="cq:Widget"
                cropParameter="./image1/imageCrop"
                ddGroups="[media]"
                fileNameParameter="./image1/fileName"
                fileReferenceParameter="./image1/fileReference"
                mapParameter="./image1/imageMap"
                name="./image1/file"
                requestSuffix="/image1.img.png"
                rotateParameter="./image1/imageRotate"
                title="Image 1"
                uploadUrl="/tmp/upload/*"
                xtype="html5smartimage">
            </tab2>
            <tab3
                jcr:primaryType="cq:Widget"
                cropParameter="./image2/imageCrop"
                ddGroups="[media]"
                fileNameParameter="./image2/fileName"
                fileReferenceParameter="./image2/fileReference"
                mapParameter="./image2/imageMap"
                name="./image2/file"
                requestSuffix="/image2.img.png"
                rotateParameter="./image2/imageRotate"
                title="Image 2"
                uploadUrl="/tmp/upload/*"
                xtype="html5smartimage">
            </tab3>
        </items>
    </items>
</jcr:root>

可以将多个智能图像作为不同的表添加到cq5中的同一对话框中

1 个答案: