1
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

簡単レシート印刷 receiptline で位置揃えしてみた

Last updated at Posted at 2020-07-15

日本発のオープンソース receiptline でレシート印刷に少しずつトライしています。
まだレシートプリンターがないので、前回利用した開発ツールを引き続き使います。
今回は位置揃えです。

01.png

Markdown のテーブル

Markdown のテーブルを思い出してみましょう。
1 行目はヘッダー、2 行目は位置揃え、3 行目以降はデータです。

Markdown
|left|center|right|
|:---|:---:|---:|
|ABCDEFGHIJ|abcdefghij|1234567890|
left center right
ABCDEFGHIJ abcdefghij 1234567890

レシートはテーブル

receiptline もテーブルなのですが、少し違いがあります。
ヘッダー行と位置揃え行がなく、どこまでもデータ行です。

レシートを無限に続くテーブルと考えているのですね。
では最初のこれもテーブル?

ReceiptLine
hello, world!

文字列の両側にテーブルの区切り記号 | を追加してみます。
しかし、結果は変わりません。

ReceiptLine
|hello, world!|

02.png

行の始めと終わりの | は省略されていたのです。
単純な文字列も立派なテーブルでした。

位置揃えはスペースで

位置揃え行を使わずに、どのように設定するのでしょうか?
それはスペースです。

左揃え

文字列の後にスペースを挿入すると、左揃えになります。

ReceiptLine
|hello, world!   |

03.png

中央揃え

文字列の前にもスペースを挿入すると、今度は中央揃えに。

ReceiptLine
|   hello, world!   |

04.png

右揃え

文字列の後のスペースを削除すると、右揃えになります。

ReceiptLine
|   hello, world!|

05.png

省略形

行の始めと終わりの | が省略できることを利用した位置揃えです。
| がレシート用紙の端に見えてきませんか?

ReceiptLine
|左揃え
|left
右揃え|
 right|

06.png

字下げのスペースを出力する

ソースコードやポエムに欠かせない、字下げ。
しかし、スペースはすでに位置揃えのために使われています。

そこで空白記号 ~ の登場です。~ はスペースに変換されます。
ちなみに、チルダを出力したいときは \~ と書きます。

ReceiptLine
|hello, world!      |
|~hello, world!     |
|~~hello, world!    |
|~~~hello, world!   |

07.png

次回は 2 列のテーブルを試してみようと思います。

1
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?