Graphic intersection XSL-FO

I have some problems with implementing the following layout in XSL-FO:

enter image description here

I thought I would create a simple block with a solid black frame around it. Then I placed the image in the upper right corner of this block so that it overlays the border. In the end, I could give the left and bottom border to this image.

EDIT: This is my code for posting the image. In the first block, I will try to place the image inside the block, and in the second - from the outside of the block.

<?xml version="1.0" encoding="UTF-8"?>
<fo:root xmlns:fo="http://www.w3.org/1999/XSL/Format">
    <!-- Layout-->
    <fo:layout-master-set>
        <fo:simple-page-master master-name = "ticket_layout"
                                                page-height = "297mm"
                                                page-width = "210mm"
                                                margin-left = "10mm"
                                                margin-right = "5mm"
                                                margin-top = "10mm"
                                                margin-bottom = "10mm">

            <fo:region-body margin-bottom = "20mm" margin-top = "25mm"/>
        </fo:simple-page-master>
    </fo:layout-master-set>
    <!-- page sequence-->
    <fo:page-sequence master-reference = "ticket_layout">
        <!-- Body-->
        <fo:flow flow-name = "xsl-region-body">
        <!-- Info Image-->
            <fo:block-container position="absolute" bottom="10" left="10">
                <fo:block text-align = "right">
                    <fo:external-graphic src="url('Info_Icon.jpg')" border-left= "1pt solid black" border-bottom = "1pt solid black" content-height = "50%"/>
                </fo:block>
            </fo:block-container>
            <!-- Table-->
                <fo:table margin-top = "2mm" padding-bottom = "230mm" font-family = "Agenda" font-size = "11">
                    <fo:table-body>
                        <fo:table-row>
                            <!-- InfoBlock1-->
                            <fo:table-cell >
                                <fo:block padding-bottom= "48mm" margin-right = "1mm" margin-bottom = "1mm" border = "1pt solid black" >
                                    <!-- InfoImage-->
                                    <fo:block-container position="absolute" bottom="60" left="110">
                                        <fo:block text-align = "right">
                                            <fo:external-graphic src="url('Info_Icon.jpg')" border-left= "1pt solid black" border-bottom = "1pt solid black" content-height = "50%"/>
                                        </fo:block>
                                    </fo:block-container>
                                </fo:block>
                            </fo:table-cell>
                            <!-- InfoBlock_2-->
                            <fo:table-cell >
                                <fo:block  padding-bottom= "48mm" margin-left = "1mm" margin-bottom = "1mm" border = "1pt solid black">
                                </fo:block>
                            </fo:table-cell>
                        </fo:table-row>
                    </fo:table-body>
                </fo:table>
        </fo:flow>
    </fo:page-sequence>
</fo:root>

But I have problems placing the image on the border. Is it possible?

Image link: http://i.stack.imgur.com/9FvVr.jpg

I also welcome other suggestions!

+3
source share
1 answer

, {i} . , . , .

:

  • 4 , , .
  • ( SVG)
  • 2 - = "", , , {i}
0

All Articles