Generalizando, não são muitas as diferenças entre um XML da interface Lista (lum_tabularData) e de uma interface Detalhes (lum_details). Entre elas estão:
• Não existem links no XML da interface Detalhes, portanto não é necessário utilizar a tag <a> no XSL;
• Não há uma lista de itens cadastrados, pois sempre chegará apenas uma <row /> dentro de um <data />;
• Apesar do controle lum_interfaceHeader (cabeçalho) chegar no XML, provavelmente, dependendo da solução, não será utilizado no XSL;
• A tag referente a imagem é a <contentImage /> para ser atribuída uma imagem junto ao conteúdo. Pode-se também utilizar a tag <introductionImage /> para exibir uma imagem junto a introdução. Esta última não foi utilizada no exemplo de interface Detalhes;
• Tem-se o campo <content />, que traz o texto do campo conteúdo do item cadastrado.
<renderData> <controls> <control type="lum_details"> <control type="lum_interfaceHeader"> <data> <title>Detalhes</title> </data> </control> <data> <row> <title>Lumis expande operação no Brasil</title> <publishStartDate> <value>06/09/06 11:16</value> </publishStartDate> <contentImage> <name>img_logoLumis.gif</name> <href>data/files/img_logoLumis.gif</href> <imageLegend>Logo da Lumis</imageLegend> </contentImage> <introduction>A Lumis (www.lumis.com.br), desenvolvedora da plataforma de software para portais corporativos, Lumis Portal Suíte, estende operações para o Sul do Brasil, com uma unidade de negócios recéminstalada em Curitiba.</introduction> <content><p align="justify">Além disso, a empresa comemora a conquista da Copesul – Companhia Petroquímica do Sul, (<a href="http://www.copesul.com.br/">www.copesul.com.br</a>), localizada no Rio Grande do Sul e responsável pela produção de cerca de 40% do eteno consumido no Brasil.</p></content> </row> </data> </control> </controls> </renderData> |
O XSL para tratar o XML da interface Detalhes pode ser da forma a seguir:
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0"> <xsl:import href="../../../../lumis/doui/style/DouiControls.xsl" /> <xsl:output omit-xml-declaration = "yes" method="xml" /> <xsl:template match="/"> <div> <xsl:for-each select="//control[@type='lum_details']/data/row"> <div><strong><xsl:value-of select="title" /></strong></div> <br /><br /> <div> <xsl:if test="contentImage/name != ''"> <img src="{contentImage/href}" border="0" alt="" style="float:left;margin:0 6px 6px 0;"> <xsl:if test="contentImage/imageLegend != ''"> <xsl:attribute name="alt"><xsl:value-of select="contentImage/imageLegend" /></xsl:attribute> </xsl:if> </img> </xsl:if> <em><xsl:value-of disable-output-escaping="yes" select="introduction" /></em> <br /><br /> <xsl:value-of disable-output-escaping="yes" select="content" /> </div> </xsl:for-each> </div> </xsl:template> </xsl:stylesheet> |
Apesar de na interface Detalhes chegar somente um único <row / > dentro de <data />, foi utilizada a tag <xsl:for-each />, pois esta facilita a chamada de itens dentro do loop, já na hierarquia correta.
Outra opção, caso não seja utilizada a tag <xsl:for-each /> é:
| • | <xsl:value-ofselect=”//control[@type='lum_details']/data/row/XXXX” /> - Onde XXXX é o nome do campo (ex: title, content, etc… ) |
Pode-se também criar uma variável no XSL, dentro de <xsl:template />:
| • | <xsl:variable name= ”path”select=”//control[@type='lum_details']/data/row” /> |
A partir da variável acima, cada campo seria chamado da seguinte forma:
<xsl:value-of select=”$path/title” />
Substituindo as tags normais no XSL acima, pelas tags específicas do Lumis, tem-se o seguinte código, e em negrito o que foi alterado:
<xsl:stylesheetxmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:lum="http://www.lumis.com.br/doui" version="1.0"> <xsl:import href="../../../../lumis/doui/style/DouiControls.xsl" /> <xsl:output omit-xml-declaration = "yes" method="xml" /> <xsl:template match="/"> <div> <lum:details> <div><strong><lum:field id="title" /></strong></div> <br /><br /> <div> <xsl:if test="contentImage/name != ''"> <lum:field id="contentImage" isImage="true" style="float:left;margin:0 6px 6px 0;" /> </xsl:if> lum:field id="introduction" isHtml="true" /> <br /><br /> <lum:field id="content" isHtml="true" /> </div> </lum:details> </div> </xsl:template> </xsl:stylesheet> |
Verifique que no lugar de <xsl:for-each /> foi utilizado <lum:details /> e não <lum:loop />. A tag <lum:form /> não deve ser utilizada no XSL da interface Detalhes.
O layout da interface de Detalhes com aplicação deste XSL ficará assim:
Para incrementar este layout, basta criar classes CSS e aplicar no XSL customizado, nas tags <div />.