Skip to main content
Known Participant
July 22, 2010
Answered

Support for handing indent?

  • July 22, 2010
  • 2 replies
  • 1227 views

Ok guys I need your help.    I have been building a Word -> FXML converter and so far have had pretty good success, but I cannot seem to figure out a way to do a hanging index in FXML.      See http://www.webopedia.com/TERM/H/hanging_indent.html for more info.  But basically a hanging indent is a left margin or indentation that's applied to every line after the first in a paragraph.  For eample

Speaker A:   Lorem ipsum dolor sit amet,

                        consectetur adipiscing elit.

                        Donec dignissim tristique tellus,

Speaker B: sit amet mattis leo vehicula id.

                        Quisque varius pulvinar ligula quis pellentesque.

                        Duis ac turpis id purus euismod sagittis.

                        Aliquam ultrices ultricies accumsan.

Now the indendation for subsequent paragraph lines happens on any new line caused by either a line break or a word wrap, so I cannot just explicitly insert some spacing or break apart the text into seperate elements and add indents or margains as this solution will not work for word wrapping.

So can someone please help me figure how I might implement this, or if I have to.... how I might go about adding this type of functionality into the TextLayoutFramework?

For bonus points:   Word also supports special indent that only gets applied after the first tab.   This is very useful in combination with the hanging indent...

Speaker C:               sit amet mattis leo vehicula id.

                               Quisque varius pulvinar ligula quis pellentesque.

                               Duis ac turpis id purus euismod sagittis.

                               Aliquam ultrices ultricies accumsan.

So please TLF crew, guide me to how I can go about this, even if that means I need to get into the guts, I'll happily contribute back.

~ JT

This topic has been closed for replies.
Correct answer

Here's a markup example of what Richard suggested:

<TextFlow><p paragraphStartIndent="50" textIndent="-50">

<span>Speaker B: sit amet mattis leo vehicula id. Quisque varius pulvinar ligula quis pellentesque. Duis ac turpis id purus euismod sagittis. Aliquam ultrices ultricies accumsan.

</span></p></TextFlow>

2 replies

JTtheGeekAuthor
Known Participant
July 22, 2010

Another note, in html/css one easy way to do this is to set the paragraphs text-indent to a negative value, and margin-left to a positive value like:

p {text-indent: -3em; margin-left: 3em;}

I tried this within TLF with padding left intead of margin left, but using a negative value for the text indent forces the text to appear off-screen to the left.

Correct answer
July 22, 2010

Here's a markup example of what Richard suggested:

<TextFlow><p paragraphStartIndent="50" textIndent="-50">

<span>Speaker B: sit amet mattis leo vehicula id. Quisque varius pulvinar ligula quis pellentesque. Duis ac turpis id purus euismod sagittis. Aliquam ultrices ultricies accumsan.

</span></p></TextFlow>

JTtheGeekAuthor
Known Participant
July 22, 2010

Awesome that worked, I accidentally used paragraphSpaceBefore instead of paragraphStartIndent, thank you for the code.

Ok, any ideas on how to implement a specific indent for the text after the first tab in a paragraph to complete the second part?

Adobe Employee
July 22, 2010

The textIndent property indents just the first line and can take a negative value.  Use paragraphStartIndent to indent the entire paragraph and textIndent with a negative value to get the hanging paragraph.

Hope that helps,

Richard

JTtheGeekAuthor
Known Participant
July 22, 2010

Thanks richard, but when i use a negative value for textindent on the paragraph element the whole paragraph starts to the left of the viewable space.   I can click and move over to the left a whole bunch and everything works right, but what's the deal with the offscreen content?

From what I can tell it seems to throw of the container width using a negative text indent, so although in this case i told the container to only be 400px wide, with a text indent of -200, the actual container content is 600px wide and thus dosen't actually fit inside the specified container...