メインコンテンツへスキップ
見出し画像
Photo bykerari_dowa

集中モード機能を追加しました!

    コトノハ-leaf- に機能を足したので紹介します。
    今回のメインは集中モードです。
    開発当初から入れたいと思いつつ、後回しになってしまっていた機能をやっとリリースできました!

    • サイドバーやプレビューを非表示にし、本文だけの画面にして集中できるモード切替機能

    • 書いている行を画面の中央に保つ「行を中央に」も併せて実装

    • 本文の入力欄も縦書きに対応

    • 小説のプレビューが編集中の箇所に追従


    画像
    集中モードの執筆画面。本文を縦書きにしています

    集中モード

    本文だけの画面にする

    執筆画面のツールバーに「集中モード」のボタンを追加しました。
    サイドバーやプレビュー、記法のボタン、文字数の表示などを非表示にして、本文を画面いっぱいに広げます。
    キーボードの Alt+Shift+F でも切り替えられます。

    画像
    ツールバーの「集中モード」と「行を中央に」、本文の「横書き|縦書き」

    画面に残るのは、上端の細い帯だけです。
    左に「集中モードを終了」「行を中央に」「全画面にする」の操作ボタン、右に保存の状態と表示切替のメニューボタンが出ます。

    画像
    集中モードの画面

    全画面にすると、ブラウザのタブやアドレスバーも隠れます。
    集中モードを終了すると元の画面に戻り、書きかけの文章もカーソルの位置もそのまま残ります。

    表示するものを選ぶ

    右上の「表示」から集中モードで出すものを選べ、選んだ内容は使っている端末に残ります。

    • 記法・ショートカットのボタン(ルビや傍点など)

    • 操作ボタン

    • 本文の縦書き

    • 「行を中央に」

    画像
    右上の「表示」のメニュー
    画像
    記法・ショートカットを出したところ

    操作ボタンを隠すと、画面に残るのは保存の状態と「表示」だけです。

    画像
    操作ボタンを隠し全画面にした集中モード

    書いている行を画面の中央に保つ「行を中央に」を追加しました

    「行を中央に」は、集中モードでも通常の執筆画面でも使えます。オンにすると書いている行が画面の中央あたりにとどまり、代わりに文章が送られます。画面の端で書き続けずにすむので、目線の位置が変わりません。

    画像
    書き足した行が画面の中央に来たところ

    日本語の変換中や範囲を選んでいる間は、画面を動かしません。
    マウスで前の部分を読み返しているときも表示はそのままで、文字を打つかカーソルを動かすと、書いている行が中央へ戻ります。

    集中モードとも組み合わせることができるので、必要に応じて使ってください。

    本文の入力欄も縦書きにできるようにしました

    ツールバーの「横書き|縦書き」で、本文の入力欄を縦書きに切り替えられます。プレビューの縦書き・横書きとは別々に選べるので、縦書きで書きながら横書きのプレビューで読み返すこともできます。

    画像
    本文は縦書き、プレビューは横書き

    横書きと縦書きを切り替えても、本文もカーソルの位置も、「元に戻す」の履歴もそのままです。

    小説のプレビューが、編集中の箇所に追従します


    今まで編集とプレビューのスクロールが別々のため、今書いている行がプレビューに表示されていないということが起こりがちでした。
    編集している箇所にプレビュー表示を追従するようにしたので、書いている箇所がプレビューに表示されます。

    最後に

    集中モードは海外のエディタでも重要視されていると聞いたことがあり、開発当初から入れる予定でした。
    ただ他のUIや機能を優先していたため今まで実装を先送りにしてしまっていました。
    今回実装して自分で試してみましたが、「行を中央に」する機能と組み合わせることでほとんど目線を動かすことなく、ノイズのない画面で編集ができるため執筆のしやすさを実感しました。

    無料で制限なく使える機能となりますので、この機会に是非お試し下さい。

    まだまだ荒いところもあると思うので、気づいたことは掲示板や公式Xで教えてください。
    最後まで読んでいただき、ありがとうございました。

    あなたへのおすすめ