機能価格ドキュメントブログ
moteを入手
← ブログ
デザイン·2026年8月5日·読了まで5分

手入力した表をそのまま保つ表編集

表の単語を一つ直しただけなのに、git diffに表全体が表示されたことはありませんか。Markdownで最もずれやすいのが表です。

m
mote
ライブモードで表のセルを長方形に選択した画面。選択されたセルだけが青く塗られ、表の外にある文は選択範囲に入りません。
ライブモードで表のセルを長方形に選択した画面。選択されたセルだけが青く塗られ、表の外にある文は選択範囲に入りません。

Markdownの表には、手で整えた跡が残ります。パイプをきれいにそろえ、空白でセルの幅を合わせ、ときにはわざと配置を崩すこともあります。その形自体がファイルの原文です。

しかし、表をグリッドとして表示するエディタは原文を解釈しなければなりません。再保存するときに表を自動で整列すると、人が作った形まで変わってしまいます。

Typoraの表の自動整列がそのような例として知られています。列幅を合わせるためにパイプの間を空白で埋め、その結果が保存内容に反映されます。公開イシューにまとめられており、オプションで無効にしたいという要望も別途上がっています。

moteはそうしないことにしました。画面上では表をグリッドとして表示しつつ、ファイルには手で書いた原文をそのまま残します。

編集するセルだけが原文で表示されます

ライブモードで表をクリックしても、グリッドはそのままです。キャレットがあるセルだけが原文に変わり、パイプ記号が薄く表示されます。

Tabや矢印キーで別のセルへ移動できます。最後の行でEnterを押すと、新しい行が作られます。

選択も自然です。セル内でドラッグすると、文字だけが選択されます。セルの外までドラッグすると、複数のセルが長方形に選択され、コピーすると選択したセルだけで表が作られます。最初の行は見出しになり、配置も維持されます。

表の外から始めた選択が表に触れると、表全体が選択されます。表の半分だけが不自然に選択されることはありません。

行や列も丸ごと移動できます。表にマウスを重ねると、行の左側と列の上側にハンドルが表示されます。ドラッグして好きな位置へ移動するだけです。

右クリックメニューでは、行や列を追加したり削除したりできます。すべての操作は一回の編集として処理されるため、一度で元に戻せます。触れていないセルの原文は変わりません。同じ機能はコマンドパレットでも見つけられます。

コマンドパレットに「表」と入力した画面 — 表の作成と「表:下に行」がそれぞれのショートカットとともに表示され、背後の文書にはグリッドとして描画された表が見えます
コマンドパレットに「表」と入力した画面 — 表の作成と「表:下に行」がそれぞれのショートカットとともに表示され、背後の文書にはグリッドとして描画された表が見えます

パイプ一つで表が崩れました

最初は、表の中でパイプを入力すると無条件にバックスラッシュを付けていました。セル内にパイプ文字を入れる場合しか考えていなかったからです。

しかし、Markdownの表を直接書く人にとって、パイプはセルを区切る記号です。新しい行を入力すると区切り文字まで文字に変わり、表が崩れてしまいました。

そこで、入力した位置を見るように直しました。

行が始まる位置にパイプを入力すると無視します。後ろに区切り文字がすでにある場合は、次のセルへキャレットを移動します。セル内の文にパイプを入力したときだけエスケープします。表のすぐ下でパイプから始まる行を書くと、既存の表の新しい行として続きます。

このような問題は、コードだけを見て見つけるのが困難です。そこで、実際のウィンドウで表をクリックし、ハンドルをドラッグするテストを作りました。表が正しく描画されるか、行と列が意図した方向へ動くか、その過程でアプリがクラッシュしないかを確認します。

結果は保存したあと、より明確に分かります。一つのセルの単語だけを変更すると、git diffにもその一行だけが表示されます。

列をそろえるための空白も、箇条書き記号のアスタリスクも、行末の二つの空白もそのままです。末尾に改行がなかったファイルなら、その状態まで維持します。ステータス行では、保存によって何バイト変わったのかをすぐに確認できます。

表の一つのセルにある単語をライブモードで変更し、保存したあとのステータス行とgit diff。ステータス行には+8 −6 Bと表示され、diffには修正したセルがある一行と文一つだけが表示されています。
表の一つのセルにある単語をライブモードで変更し、保存したあとのステータス行とgit diff。ステータス行には+8 −6 Bと表示され、diffには修正したセルがある一行と文一つだけが表示されています。

作ったあとに取り除いた機能もあります

しばらくの間は、マウスで列幅を調整できました。今はありません。

Markdownには列幅を保存する構文がありません。幅を記憶するには、文書の横に別のファイルを作らなければなりません。そうすると、そのフォルダはmoteがなければ完全な状態ではなくなります。gitで移動したり、別の端末で開いたり、別のエディタを使ったりすると、その情報が失われます。

表の罫線はアプリの設定で解決しました。グリッドとして表示するか、見出しの下だけに線を引くかを選べます。画面とPDF、HTMLへの書き出しにも同じ設定が適用されます。

基準は単純です。Markdownに書けない値はアプリの設定に置くか、機能として作りません。

そのため、列幅を調整する機能を取り除きました。列幅は内容に合わせて自動的に決まります。文書は最後まで一つの.mdファイルとして残ります。

表をきれいに書き直してくれるエディタと、自分が書いた表をそのまま守ってくれるエディタ。

moteは後者を選びました。

← 前の記事Markdown記号をカーソルが触れた単語だけに表示する理由次の記事 →どのインストール形式でも同じ見た目になるよう、GTKを同梱することにした
RSSで更新を追えます。
書くことだけを残す
日本語
© 2026 mote