Share via

WPF Documents - Indenting Paragraphs

  • Article

As I promised, this is a post about what I learned while creating a flow document that had indented paragraphs. The hierarchy was dynamically built based on the data.

The first thing I noticed is that indenting a paragraph is very easy, just set the left margin of the paragraph and the entire paragraph will be indented. If you want just the first line of the paragraph indented, simply set the TextIndent property. In either case, the value is a double that represents WPF device indendependent units. If you want the first line to be outdenting, or you simply want a hanging indent. You have to set the left margin to the hanging indent value and then set the TextIndent to the negative of that value.

Another way to indent a paragraph is to add it to a section that has the left margin set. Sections don't have a TextIndent property, but a section can contain another section (unlike paragraphs). So, If you nested 3 sections that all had an indent of 20.0, the result would be that the inner most section would be indented 60.0 units from the left edge of the window. I didn't use this approach because I didn't have to. It was simple enough for me to simply indent each paragraph accordingly.

So, that's a lot of talking without any code or pictures. Here is some XAML to demonstrate indenting:

 <FlowDocumentScrollViewer>
     <FlowDocument>
         <Section>
          <Paragraph>
       This paragraph is not indented in any way and should wrap normally. This paragraph is not indented in any way and should wrap normally. This paragraph is not indented in any way and should wrap normally.
          </Paragraph>
      </Section>
         <Section>
          <Paragraph TextIndent="50">
       The first line of this paragraph is indented by 50 units, but the rest of the lines will not indent at all. The first line of this paragraph is indented by 50 units, but the rest of the lines will not indent at all.
          </Paragraph>
      </Section>
         <Section>
          <Paragraph TextIndent="-50" Margin="50,20,0,0">
       The first line of this paragraph is not indented, but the rest of the lines will be indented by 50 units. The first line of this paragraph is not indented, but the rest of the lines will be indented by 50 units.
          </Paragraph>
      </Section>
         <Section>
          <Paragraph Margin="50,20,0,0">
       This paragraph is indented by 50 units, but the section is not indented at all. This paragraph is indented by 50 units, but the section is not indented at all. This paragraph is indented by 50 units, but the section is not indented at all.
          </Paragraph>
          <Paragraph Margin="100,0,0,0">
       This paragraph is indented by 100 units, but the section is not indented at all. This paragraph is indented by 100 units, but the section is not indented at all. This paragraph is indented by 100 units, but the section is not indented at all.
          </Paragraph>
      </Section>
         <Section Margin="50,20,0,0">
          <Paragraph Margin="0,0,0,0">
       This paragraph is not indented, but the section is indented by 50 units. This paragraph is not indented, but the section is indented by 50 units. This paragraph is not indented, but the section is indented by 50 units.
          </Paragraph>
          <Paragraph Margin="50,0,0,0">
       This paragraph is indented by 50 units, but the section is also indented by 50 units. This paragraph is indented by 50 units, but the section is also indented by 50 units. This paragraph is indented by 50 units, but the section is also indented by 50 units.
          </Paragraph>
      </Section>
         <Section Margin="50,20,0,0">
               <Section Margin="50,0,0,0">
              <Paragraph Margin="0,0,0,0">
           This paragraph is not indented, but it is in a nested section that is indented by 50 units and the outer section is also indented by 50 units - that makes 100 units total for this paragraph.
              </Paragraph>
          </Section>
      </Section>
  </FlowDocument>
 </FlowDocumentScrollViewer>

Comments