3 Replies Latest reply on Mar 2, 2014 10:11 PM by user19752

    Combining text and graphics in a single "field"

    mcrip

      Is there a way to combine both text and graphics in a container field?

       

      Or can anyone suggest a way to combine a text field and a container field (containing the graphic) on a print layout such that an end user, without access to the layout mode, can control where the graphic ends up in relation to the text?

       

      Essentially I'm trying to replicate the ability in excel to insert a graphic, adjust the placement so it looks like it is part of the text. See the third line in the attached PDF (178), although in many cases there might be more text than this example.

       

      I current thinking (haven't experimented to see how viable this is) is to create vertical and horizontal offset fields, overlay the text and graphic (container) and use those offsets to allow end users to move the container via some calculation. I'm certainly open to other suggestions though.

       

      Additional background on this is contained in my post at

      https://fmdev.filemaker.com/message/124950#124950

        • 1. Re: Combining text and graphics in a single "field"
          PalmDBS

          AFAIK, you can't offset the container position, and items in the container will always be centered. 

           

          I would consider an approach using webviewers instead, although there are many caveats with that as will. 

           

          • First, the webviewer will appear ON TOP of any other fields, regardless of whether the webviewer is designated interactive or not.  So... you would have to include the text as a separate layer in the HTML you load into the webviewer. 
          • Additionally, you must be able to reference the images by file, not by container. You could accomplish this by exporting images to your documents folder and using a reference like "<img src='file:///Users/palmdbs/Documents/image.jpg' />" (or the windows equivalent) so the webviewer can display the image
          • The webviewer will kill your sliding, as im fairly certain it can't resize to the data within - you're stuck with the size you define.

           

          The advantages of the webviewer are

          • positionable and resizable text and images
          • multiple images if needed
          • very versatile in the you could (if you so desired) create the whole page layout in HTML rather than having each row as it's own record.  This gives you great design ability, but requires HTML knowledge.

           

          In the webviewer definition, you can write a data URI to load HTML dynamically without having to create a file:

           

          "data:text/html,<body style='margin: 0;'><div style='z-index: 1; position: absolute; left: 5px; top: 15px; font-size: 10pt; font-weight: bold; color: #f00;'>FM Rules</div><div style='z-index: 0; position: absolute; left: 45px; top: 0; '><img src='http://palmdbs.com/images/Palm-Database-Solutions-logo.png' style='max-height: 40px;'></div></body>"

           

          This example is intentionally overlapped, and results in an image like the attached.  You can obviously adjust as needed.  This also allows for multiple independently-positioned images as well.  I'll leave it to you to figure out how to calculate, but this example showls how to layer (higher z-indexes ar on top) and position elements relative to the top left of the webviewer.

          Screen Shot 2013-09-18 at 12.57.19 AM.png

          • 2. Re: Combining text and graphics in a single "field"
            mcrip

            Getting back to this a few months later, figure I might should probably list what worked.

             

            I agree the best solution is probably to move the whole thing to a large HTML table (but that's a bit more work than I'm willing to go through at this point, but I'm marked it down as a feature to explore down the road).

             

            I was able to get the horizontal alignment of a graphic with text working with an offset variable (integer), a couple of calculations, and a merge field (text set the same color as the background).  One of the big drawbacks to this you must switch to preview mode to see it in action (as part of the calcs I created a text replica of the graphic area that was pretty close to actual space of the graphic in order to get a good idea of how much offset was needed).

             

            However when I tried to extend this same idea to vertical alignment I ran into lots of issues since there was already a number of fields sliding up in order to try and align the text vertically and it just wasn't working.  Since most of the instructions involving graphis are relatively short I'm willing to accept this as a trade off of time and effort.  But I've noted the html answer for future consideration.

            • 3. Re: Combining text and graphics in a single "field"
              user19752

              There are many arrows in UNICODE

              http://www.unicode.org/charts/PDF/U2190.pdf

              how many patterns do you need on the column ALPINE in the report ?

              Making original font is an idea.