Using anchor points in quadwriter #83

To learn how quad and quadwriter work, I tried building a version of the Practical Typography "after" résumé as a quadwriter document. In order to achieve the "left-aligned location, right-aligned date on the same line" layout, I tried using the anchor-from-parent and anchor-to attributes on a Q-expression, to no avail:

#lang quadwriter

'(q
  (q ((border-width-top "1pt")
      (border-color-top "black")
      (display "block"))
     (q ((font-bold "true")
         (font-family "heading"))
        "Education")
     (para-break))
  (q ((font-size "12pt") (draw-debug "true"))
     (q "UCLA Anderson School of Management ") ;; place 
     (q ((anchor-from-parent "se") ;; date
         (anchor-to "bo"))
        "2011--13")))

It seems that both the "place" and "date" quads are still using the 'baseline-in-to-'baseline-out anchors:
Screen Shot 2020-12-15 at 11 16 36 AM
Am I going about this in the correct way? How can one specify the anchor points of a quad while in #lang quadwriter, instead of using the lower-level quad commands like (quad->pict (position (attach-to parent 'e child 'w)))?

To learn how `quad` and `quadwriter` work, I tried building a version of the [Practical Typography "after" résumé ](https://practicaltypography.com/resumes.html) as a `quadwriter` document. In order to achieve the "left-aligned location, right-aligned date on the same line" layout, I tried using the `anchor-from-parent` and `anchor-to` attributes on a Q-expression, to no avail: ```racket #lang quadwriter '(q (q ((border-width-top "1pt") (border-color-top "black") (display "block")) (q ((font-bold "true") (font-family "heading")) "Education") (para-break)) (q ((font-size "12pt") (draw-debug "true")) (q "UCLA Anderson School of Management ") ;; place (q ((anchor-from-parent "se") ;; date (anchor-to "bo")) "2011--13"))) ``` It seems that both the "place" and "date" quads are still using the `'baseline-in`-to-`'baseline-out` anchors: <img width="807" alt="Screen Shot 2020-12-15 at 11 16 36 AM" src="https://user-images.githubusercontent.com/8475789/102242185-cafe2780-3ec7-11eb-9f75-ac521b6baabd.png"> Am I going about this in the correct way? How can one specify the anchor points of a quad while in `#lang quadwriter`, instead of using the lower-level `quad` commands like `(quad->pict (position (attach-to parent 'e child 'w)))`?

This is one of the trickier formatting problems I’ve come across in working on Quadwriter. Quadwriter doesn’t have a concept of “right-aligned tab stop”, which is how you would handle this in a word processor.

The way I went about it was to sequence the duration and title as sequential paragraphs, and then apply a negative space-after attribute to the duration, thereby hoisting the title to be vertically aligned with the duration. (You would also want to apply a generous inset-right to the title so that it doesn’t wrap all the way to the right edge, so its text doesn’t collide with the duration, which should have a predictable width).

In other words, you convert it from a problem of inserting horizontal space (= hard) to one of subtracting vertical space (= easy)

Screen Shot 2020-12-15 at Dec 15 9 41 14 AM

This is one of the trickier formatting problems I’ve come across in working on Quadwriter. Quadwriter doesn’t have a concept of “right-aligned tab stop”, which is how you would handle this in a word processor. The way I went about it was to sequence the duration and title as sequential paragraphs, and then apply a negative `space-after` attribute to the duration, thereby hoisting the title to be vertically aligned with the duration. (You would also want to apply a generous `inset-right` to the title so that it doesn’t wrap all the way to the right edge, so its text doesn’t collide with the duration, which should have a predictable width). In other words, you convert it from a problem of inserting horizontal space (= hard) to one of subtracting vertical space (= easy) <img width="1312" alt="Screen Shot 2020-12-15 at Dec 15 9 41 14 AM" src="https://user-images.githubusercontent.com/1425051/102251464-b155e380-3eb9-11eb-9579-58ed6f98cf30.png">

More precisely:space-after should be the negative of line-height. Here is the relevant fragment of my markup, which should give you enough to go on:

(define line-ht "1.3em")
 `(q
   (q ((font-size "1.4em")(line-height ,line-ht))
      (para-break)
      (duration ((keep-with-next "true")
                 (space-after ,(string-append "-" line-ht))
                 (line-align "right"))
                (q ,duration))
      (para-break)
      (q ((space-after "0")
          (inset-right "3em")
          (keep-with-next "true"))
         (q ,title))))

More precisely:`space-after` should be the negative of `line-height`. Here is the relevant fragment of my markup, which should give you enough to go on: ``` (define line-ht "1.3em") `(q (q ((font-size "1.4em")(line-height ,line-ht)) (para-break) (duration ((keep-with-next "true") (space-after ,(string-append "-" line-ht)) (line-align "right")) (q ,duration)) (para-break) (q ((space-after "0") (inset-right "3em") (keep-with-next "true")) (q ,title))))

How can one specify the anchor points of a quad while in #lang quadwriter

The low-level Quad layout functions are not exposed in Quadwriter markup, except for anchor-from-parent and anchor-to. Quadwriter is a demo app that’s meant to demonstrate a higher-level interface (and convince myself that it is possible).

> How can one specify the anchor points of a quad while in #lang quadwriter The low-level Quad layout functions are not exposed in Quadwriter markup, except for `anchor-from-parent` and `anchor-to`. Quadwriter is a demo app that’s meant to demonstrate a higher-level interface (and convince myself that it is possible).

Labels Milestones

Using anchor points in quadwriter #83