こんにちは。ナミレリです。
今回は、NeovimのGUIであるNeovideを紹介します。Neovimをすでに使用している方々にNeovideの特徴、メリットをお伝えし、インストール方法とNeovide特有のGUI設定を紹介します。Neovideの素晴らしい視覚的な快適さで、モチベアップに繋がること間違いないです。
この記事でNeovideの魅力をお伝えし、Neovideを試してみるきっかけになれば幸いです。
この記事はこんな人にオススメ
- Neovimユーザーで、より洗練されたグラフィカルインターフェースを求めるユーザー
- Neovimのカスタマイズが好きなユーザー
- Neovimで高DPIやスムースなスクロールを実現したいユーザー
- M3 MacBook Air 15インチ
- macOS Sonoma 14.4.1
- Neovide 0.12.2
もありますので、ぜひダウンロードして試してみてください。M1/M2/M3のMac上で快適にMacやUbuntu、Windowsが動作します。
目次
はじめに
Neovideは、このブログでもカスタマイズ方法を紹介している人気のテキストエディターであるNeovimのグラフィカルユーザーインターフェース（GUI）です。Neovim GUIは、Neovimの強力な機能を維持しつつも、GUIならではの視覚的な利便性を提供してくれます。中でもNeovideは、視覚的なかっこ良さがすごいです。この記事では、そんなNeovideのインストール方法やNeovideをかっこよく使う設定方法を詳しく紹介します。
NeovimのGUIはNeovide以外にも人気のGUIがたくさんあります。こちらに詳しく記載があります。
特に人気の高いNeovim GUIは以下の通りです。
| Neovim GUI | 開発言語 | URL |
|---|---|---|
| NeoVide | Rust製 | https://github.com/neovide/neovide |
| Neovim Qt | C++製 | https://github.com/equalsraf/neovim-qt |
| FVim | F#製 | https://github.com/yatli/fvim |
| goneovim | Go製 | https://github.com/akiyosi/goneovim |
| GNvim | Rust製 | https://github.com/vhakulinen/gnvim |
| neovim-gtk | Rust製 | https://github.com/daa84/neovim-gtk |
| NyaoVim | TypeScript製 | https://github.com/rhysd/NyaoVim |
| NVUI | C++製 | https://github.com/rohit-px2/nvui |
今回は、視覚的な効果がかっこ良く、使っていて気持ちの良いスムーズな動きを実現するNeovideのインストールから設定方法を詳しく紹介していきます。
Neovideは、現在使っているNeovimの設定ファイルですべて動作する（私の環境では）ので、Neovimをすでに使用している方々に、Neovideの特徴やかっこいい視覚効果、気持ちの良いスムーズな動きなどを詳しく紹介していきます。
Neovideの特徴
まずはNeovideの特徴についてです。
公式サイトに詳しく記載がありますが、私がNeovideを使ってみて感動した4点を紹介したいと思います。
1. Neovimの設定やプラグインがそのまま使える
使っているNeovimの設定ファイルそのままで、全ての設定と全てのプラグインがそのまま使えます。Neovide専用の設定項目もあるので、私はNeovide専用の設定は、別のファイル（neovide_config.lua）で追加設定しました。
Neovide専用の設定をneovide_config.luaに書いて、init.luaから読み込んでいます。
Neovide専用の設定は後ほど詳しく紹介します。
neovide_config.lua
if vim.g.neovide then
-- ここに Neovide 専用の設定を書く
-- ここに Neovide 専用の設定を書く
-- ここに Neovide 専用の設定を書く
end
init.lua
require("neovide_config")
ファイル構成
~/.config/nvim/
├── init.lua
└── lua/
├── neovide_config.lua
├── lsp_config.lua
├── nvim_cmp_config.lua
├── keymaps.lua
├── options.lua
├── autocmds.lua
└── plugins.lua
2. 高DPIのサポート
次に感動したことは表示の綺麗さです。Neovideを起動した瞬間にわかります。Neovideは高DPIをサポートしているため、クリアで鮮明なテキスト表示とグラフィックス表示となり、細部までくっきり表示されます。MacBookで表示するとひときわ綺麗です。
下の画像は、CLIでのNeovimとNeovideをそれぞれ起動した画像です。画像ではわかりにくいですが、違いはわかりますか？
高DPIサポートでくっきり表示
高DPIサポートでくっきり表示
3. スムースなスクロール
これはNeovideの最も魅力的な機能のひとつです。Neovideのスムーススクローリング機能は素晴らしく、テキストのスクロールが非常に滑らかです。長いコードや長いファイルを扱う際に、その閲覧や編集がより快適にモチベ高く行えます。
滑らかなスクローリング
4. リガチャも表示できる
Neovideでは、リガチャ（合字）のフォントを表示することもできます。不等価演算子や関係演算子、論理演算子など、下の画像（右）のように表示されます。パッと見でも記号や文字がはっきりと区別でき、コーディングエラーの減少にもつながります。
リガチャの表示（右がNeovide）
Neovideのインストール
それでは、Neovideをインストールしていきましょう。MacOSの場合、brewでインストールする方法がおすすめです。brewで簡単にインストールします。
brewでインストール
brew install --cask neovide
Neovideのバージョンを確認しておきます。
neovide --version
neovide 0.12.2
Neovideの特有な設定
では、Neovideの特有な設定を紹介します。
neovideの設定ファイルについて
冒頭にも書きましたが、Neovide専用の設定をneovide_config.luaに書いて、init.luaから読み込んでいます。
neovide_config.lua
if vim.g.neovide then
-- ここに Neovide 専用の設定を書く
-- ここに Neovide 専用の設定を書く
-- ここに Neovide 専用の設定を書く
end
init.lua
require("neovide_config")
ファイル構成
~/.config/nvim/
├── init.lua
└── lua/
├── neovide_config.lua
├── lsp_config.lua
├── nvim_cmp_config.lua
├── keymaps.lua
├── options.lua
├── autocmds.lua
└── plugins.lua
Display関連の設定
まずは、ディスプレイ関連の設定です。フォントやリフレッシュレート、行間、スケール、パディングなどを設定しています。
neovide_config.lua
if vim.g.neovide then
---- ディスプレイの設定
-- フォントの設定
vim.o.guifont = "JetBrainsMono Nerd Font:h20"
-- リフレッシュレート
vim.g.neovide_refresh_rate = 60
-- フォーカスされていないときのリフレッシュ レート
vim.g.neovide_refresh_rate_idle = 5
-- 行間
vim.opt.linespace = 0
-- スケール：拡大率
vim.g.neovide_scale_factor = 1.0
-- パディング
vim.g.neovide_padding_top = 0
vim.g.neovide_padding_bottom = 0
vim.g.neovide_padding_right = 0
vim.g.neovide_padding_left = 0
end
vim.gはVimスクリプトにおいてグローバル変数を設定する際に使われます。
フォントの設定
上記の設定ファイルにのフォントの設定について説明します。
-- フォントの設定
vim.o.guifont = "JetBrainsMono Nerd Font:h20"
- vim.oは、Vimスクリプトにおいてオプションを設定する際に使われます。
- guifontは、GUI モードで使用されるフォントを指定するオプションです。
- JetBrainsMono Nerd Font:h20 は設定するフォント名や値です。
- h20はフォントサイズです。
リフレッシュレートの設定
Neovideのリフレッシュレートを設定するオプションです。
-- リフレッシュレート
vim.g.neovide_refresh_rate = 60
-- フォーカスされていないときのリフレッシュ レート
vim.g.neovide_refresh_rate_idle = 5
vim.g.neovide_refresh_rate = 60
- vim.gはVimスクリプトにおいてグローバル変数を設定する際に使われます。
- vim.g.neovide_refresh_rateは、Neovideがアクティブなときの画面の更新頻度を設定します。
- 値の60は、1秒間に60回画面が更新するという意味で、60Hz のリフレッシュレートのことです。
vim.g.neovide_refresh_rate_idle = 5
- vim.g.neovide_refresh_rate_idleは、Neovide がアイドル状態の画面の更新頻度を設定します。
行間の設定
Neovideの行間を設定するオプションです。
-- 行間
vim.opt.linespace = 0
- linespaceは、行の間に追加する追加の行間を指定します。
- 値0は、追加の行間を設定しないという意味で、フォントのデフォルトの行高（line height）が使用されます。
スケールの設定
Neovideの表示スケールを設定するためのオプションです。
-- スケール
vim.g.neovide_scale_factor = 1.0
- neovide_scale_factorは、Neovideの表示スケールを指定します。
- 値1.0は、100%のスケール（標準の大きさ）で表示する設定です。
パディングの設定
Neovideウィンドウの上下左右のパディング（余白）を設定するためのオプションです。
-- パディング
vim.g.neovide_padding_top = 0
vim.g.neovide_padding_bottom = 0
vim.g.neovide_padding_right = 0
vim.g.neovide_padding_left = 0
- vim.g.neovide_padding_topは、ウィンドウ上部のパディング。
- vim.g.neovide_padding_bottomは、ウィンドウ下部のパディング。
- vim.g.neovide_padding_rightは、ウィンドウ右側のパディング。
- vim.g.neovide_padding_leftは、ウィンドウ左側のパディング。
ウィンドウ関連の設定
続いて、ウィンドウ関連の設定です。ウィンドウのぼかし、ブラー、シャドウなどを設定しています。
if vim.g.neovide then ... endの中に書きます。
neovide_config.lua
---- ウィンドウの設定
-- ウィンドウのぼかし(Macのみ)
vim.g.neovide_window_blurred = true
-- フローティングブラー
vim.g.neovide_floating_blur_amount_x = 2.0
vim.g.neovide_floating_blur_amount_y = 2.0
-- シャドウ
vim.g.neovide_floating_shadow = true
vim.g.neovide_floating_z_height = 10
vim.g.neovide_light_angle_degrees = 45
vim.g.neovide_light_radius = 5
ウィンドウのぼかしの設定（Macのみ）
Neovideの背景を透過した際に、背景をぼかす設定です。
-- ウィンドウのぼかし(Macのみ)
vim.g.neovide_window_blurred = true
フローティングウィンドウのぼかし設定
Neovideのフローティングウィンドウをぼかす設定です。
-- フローティングブラー
vim.g.neovide_floating_blur_amount_x = 2.0
vim.g.neovide_floating_blur_amount_y = 2.0
vim.g.neovide_floating_blur_amount_x = 2.0
- ぼかし効果をX軸方向（水平方向）に2.0の値で設定しています。
vim.g.neovide_floating_blur_amount_y = 2.0
- ぼかし効果をY軸方向（垂直方向）に2.0の値で設定しています。
シャドウの設定
フローティングウィンドウの影（シャドウ）を設定するためのオプションです。
-- シャドウ
vim.g.neovide_floating_shadow = true
vim.g.neovide_floating_z_height = 10
vim.g.neovide_light_angle_degrees = 45
vim.g.neovide_light_radius = 5
vim.g.neovide_floating_shadow = true
- フローティングウィンドウに影（シャドウ）をつけるかどうかの設定。
vim.g.neovide_floating_z_height = 10
- フローティングウィンドウのZ軸の数値を指定します。ウローティングウィンドウの浮いている高さです。
vim.g.neovide_light_angle_degrees = 45
- フローティングウィンドウに影を落とす光源の角度を指定します。
vim.g.neovide_light_radius = 5
- 光源の半径を指定します。
スクロールアニメーションの設定
if vim.g.neovide then ... endの中に書きます。
neovide_config.lua
---- スクロールアニメーションの設定
-- スクロールアニメーション
vim.g.neovide_scroll_animation_length = 0.3
-- スクロールアニメーションの行数
vim.g.neovide_scroll_animation_far_lines = 5
スクロールアニメーションの設定
Neovideのスクロールアニメーションの持続時間を秒で設定するオプションです。
vim.g.neovide_scroll_animation_length = 0.3
- vim.g.neovide_scroll_animation_lengthはスクロールアニメーションの持続時間を秒で指定します。
- スクロールアニメーションの持続時間を0.3として指定してます。0.3秒のことです。
- 0.3秒ぐらい短い設定にすると、移動が速くダイナミックに感じられます。
スクロールアニメーションの行数
とりあえず5に設定しましたが、1や9999との設定の違いがいまいちわかりませんでした。
vim.g.neovide_scroll_animation_far_lines = 5
カーソルアニメーション関連の設定
if vim.g.neovide then ... endの中に書きます。
neovide_config.lua
---- カーソルアニメーションの設定
-- アニメーションの長さ
vim.g.neovide_cursor_animation_length = 0.05
-- アニメーションの軌跡の長さ
vim.g.neovide_cursor_trail_size = 0.8
-- アンチエイリアス
vim.g.neovide_cursor_antialiasing = true
-- 挿入モードをアニメーション
vim.g.neovide_cursor_animate_in_insert_mode = true
-- コマンドラインへの切り替えをアニメーション
vim.g.neovide_cursor_animate_command_line = true
-- フォーカスされていないアウトラインの幅
vim.g.neovide_cursor_unfocused_outline_width = 0.125
-- カーソルの点滅をアニメーション化
vim.g.neovide_cursor_smooth_blink = true
-- 粒子
-- 粒子の種類
vim.g.neovide_cursor_vfx_mode = "railgun"
-- パーティクルの透明度
vim.g.neovide_cursor_vfx_opacity = 200.0
-- パーティクルが存続する時間
vim.g.neovide_cursor_vfx_particle_lifetime = 1.2
-- パーティクルの数
vim.g.neovide_cursor_vfx_particle_density = 9.0
-- パーティクルの速度
vim.g.neovide_cursor_vfx_particle_speed = 10.0
-- パーティクルの質量移動
vim.g.neovide_cursor_vfx_particle_phase = 1.5
-- パーティクルの回転速度
vim.g.neovide_cursor_vfx_particle_curl = 1.0
Neovideを透明にする設定
if vim.g.neovide then ... endの中に書きます。
neovide_config.lua
--- Neovideを透明にする設定
-- 不透明度の設定
vim.g.neovide_transparency = 0.8
-- 境界線を表示(不透明なウィンドウの周囲にのみ灰色の境界線を表示)
vim.g.neovide_show_border = true
-- フローティングやポップアップを完全に透明にする
-- vim.opt.winblend = 100
-- vim.opt.pumblend = 100
-- フローティングやポップアップを完全に透明にしない
-- vim.opt.winblend = 0
-- vim.opt.pumblend = 0
-- フローティングやポップアップの透明度
vim.opt.winblend = 20
vim.opt.pumblend = 20
その他の設定
if vim.g.neovide then ... endの中に書きます。
brewでインストールしたNeovideを起動すると、ディレクトリは/になっているのでHOMEディレクトリにcdするように設定します。
起動時にcdする
---- その他の設定
-- 起動時にcdする
vim.cmd([[autocmd VimEnter * cd ~]])
ウィンドウのサイズを記憶する
-- ウィンドウサイズを記憶
vim.g.neovide_remember_window_size = true
IMEの設定
---- IMEの設定
local function set_ime(args)
if args.event:match("Enter$") then
vim.g.neovide_input_ime = true
else
vim.g.neovide_input_ime = false
end
end
local ime_input = vim.api.nvim_create_augroup("ime_input", { clear = true })
vim.api.nvim_create_autocmd({ "InsertEnter", "InsertLeave" }, {
group = ime_input,
pattern = "*",
callback = set_ime,
})
vim.api.nvim_create_autocmd({ "CmdlineEnter", "CmdlineLeave" }, {
group = ime_input,
pattern = "[/\\?]",
callback = set_ime,
})
プロファイラを有効にする
-- プロファイラを有効にする
vim.g.neovide_profiler = true
プロファイラを有効にすると、左上にプロファイラが表示されます。
最後に
最後まで読んでいただきありがとうございます。今回のNeovimのGUI、Neovideのインストールと設定はいかがでしたでしょうか。Neovideは、Neovimのパワフルな機能を保持しつつ、魅力的な操作が可能になりモチベーションアップにもなりますね。
既にNeovimを利用している方であれば、設定をそのままにすぐに使うことができるのでぜひ試してみてください。
NeovimとHHKBの組み合わせは、コーディング体験を最適化し、より生産的で満足のいくものにするための最高のツールです。コーディングの楽しさと効率性を新たなレベルへと引き上げてくれます。
定番おすすめ記事
Neovimをかっこ良くクールに使う設定
