百度360必应搜狗淘宝本站头条
当前位置:网站首页 > 编程网 > 正文

从零开始配置 vim(15)——状态栏配置

yuyutoo 2024-10-16 15:38 2 浏览 0 评论

vim 下侧有一个状态栏,会显示当前打开的文件等一系列内容,只是我们很少去关注它。而且原生的vim也支持对状态栏进行自定义。这篇文章主要介绍如何自定义状态栏

设置状态栏

我们可以采用 set statusline 来设置状态栏。
例如我们输入 :set statusline=%f\ -\ FileType=%y。之后我们可以发现它变成了如下这个样子


statusline 的值是一个格式字符串。上述命令我们使用了 %f 表示当前文件名称 。

从上面的命令中明显感觉到只输出两个内容就已经开始显的比较繁琐了,如果显示的内容多了是不是就更加难以阅读和书写了呢?好在我们还能使用 lua来做设置。上述内容可以翻译为如下的 lua代码

vim.o.statusline = "%f - FileType=%y"

我们保存之后发现下方的状态栏显示内容已经发生变化。

控制边距和宽度

如果你写过 c 或者其他编程语言中的输出语句,应该很容易理解如何控制输出的格式,一般使用类似 `%4l`` 这样的语句来控制该项占4个字符宽度。这里的设置也是类似的

vim.o.statusline = "%20f - FileType=%y"

它表示 文件名这项应该站20个字符宽度。最终效果如下所示

默认它的边距是添加在左边的,这样会让左侧空出一大半,会显得比较难看,我们可以使用 -来使空白站位符显示在右侧

vim.o.statusline = "%-20f - FileType=%y"

当然我们也可以控制一下输出字符的最大长度,例如使用如下代码

vim.o.statusline = "%0.10F - FileType=%y"

使用 %F可以显示文件的全路径。这里我们发现全路径大于10个字符,但是它只是显示了10个字符。使用这个方法可以防止某些超长的字符串破坏了我之前的布局

分割

我们再来介绍一个符号 %=,它表示将 %= 后面的内容全局居右对齐,例如

vim.o.statusline = "%f %= FileType=%y"

将得到如下显示内容

更多的关于各个标识符代表的含义可以使用 :help statusline 来查看。

练习

最后我们来做一个小练习,我们希望将状态栏显示为如下内容

mode | filename[status] | currentline:totalline                       |encoding|filetype|

其中 mode 代表当前所处模式、filename 代表文件名称、status 代表文件状态(是否可读写、是否保存)、currentline 代表光标当前所在行数、totalline 代表文件一共多少行、encoding 代表文件编码、filetype 代表文件类型

我们通过查阅文档可以知道:

  • 文件名称可以使用 %f 来显示
  • 文件状态可以使用 %m 来显示
  • 当前行可以使用 %l
  • 当前buffer总行数可以使用 %L
  • 文件类型可以使用 %y 来显示

至于当前模式和文件类型我们先不管它,根据这些内容我们可以写下如下代码

vim.o.statusline = "mode|%f%m|%l:%L%=encoding|%y"


[+] 表示对缓冲区所做的修改还没有写入到磁盘中。执行:w写入之后发现它直接消失了

我们可以通过 vim.g.encoding 来获取当前文件的编码方式,因此我们改一下当前代码

vim.o.statusline = "mode|%f%m|%l:%L%=" .. vim.g.encoding .. "|%y"

我们发现此时的状态已经改过来了。


最麻烦的是模式,
vim 中提供了一个可以获取当前模式的函数 mode 。但是在 lua 接口中我没有找到对应的函数。因此我们仍然采用在 lua 中调用 vimscript 的方式。这次我们使用函数 vim.api.nvim_eval()。它可以执行 vim 命令并将返回执行的结果。

我们可以定义一个函数返回当前所处模式

function get_mode()
    local mode = vim.api.nvim_eval([[mode]])
    if mode == "n" then
        return "Normal"
    elseif mode == "v" then
        return "Visual"
    elseif mode == "i" then
        return "Insert"
    else
        return ""
    end
end

这里我们为了演示只返回了 3中模式的字符串,更多模式可以查看vim的帮助文档

我们希望模式改变时对应的就修改 mode 对应的字段,此时我们应该采用自动命令。查看vim的用户手册我们发现,针对模式变化这一事件有一个叫做 ModeChanged 的事件类型,因此我们可以写下一些代码

local cmd_statusline = vim.api.nvim_create_autogroup("SET_STATUS_LINE", {clear = true})

vim.api.nvim_create_autocmd({"ModeChanged"}, {
    pattern = "*",
    group = cmd_statusline,
    callback = function()
      local win_id = vim.api.nvim_eval([[win_getid()]]) --获取当前window id
      vim.wo[win_id].statusline = get_mode() .. "|%f%m|%l:%L%=" .. vim.g.encoding .. "|%y" -- 使用 setlocal 针对窗口设置本地化配置
    end
)

后面我们可以对字符串进行一些格式控制,这里就不展开了。我们将这些代码写到 init.lua中,保存后发现它大致效果如下


我们发现就是简单的设置状态栏的工作也是比较麻烦的。而且有时候我们又想它好看,带点颜色什么的。这就更麻烦了。好在有大量的插件可以帮助我们来完成这一工作

lualine 插件

lualine 是一个用 lua 语言开发的 neovim 的状态栏美化插件,可以使用如下代码进行安装

use {
  'nvim-lualine/lualine.nvim',
  requires = { 'kyazdani42/nvim-web-devicons', opt = true }
}

我们创建 lualine 的配置文件,加入加载 lualine 的代码

require("lualine").setup()

然后在主配置文件中加载该文件

require("plugin-config/lualine")

lualine 官方提供了3种主题的配色,我们可以直接在代码中引用,例如我这里引用 evil_lualine 这个配置,然后将 theme改为之前我们安装的 tokyonight主题

theme = "tokyonight"

到这里我们已经完成了 状态栏的美化,其实主要靠插件,本篇一大部分写了如何使用原生的statusline 设置主要是自己手工设置比较有意思,而且也可以凑文章字数,其实你不知道statusline 这个也无所谓,很多插件都都对原生的方式进行了大量封装,而且能进行高度的自定义。完全可以满足你各种奇怪的口味。

当然状态栏配置并不只有这一种插件,如果你知道有哪些状态栏的插件也欢迎在评论区留言给出

相关推荐

如何在HTML中使用JavaScript:从基础到高级的全面指南!

“这里是云端源想IT,帮你...

推荐9个Github上热门的CSS开源框架

大家好,我是Echa。...

前端基础知识之“CSS是什么?”_前端css js

...

硬核!知网首篇被引过万的论文讲了啥?作者什么来头?

整理|袁小华近日,知网首篇被引量破万的中文论文及其作者备受关注。知网中心网站数据显示,截至2021年7月23日,由华南师范大学教授温忠麟等人发表在《心理学报》2004年05期上的学术论文“中介效应检验...

为什么我推荐使用JSX开发Vue3_为什么用vue不用jquery

在很长的一段时间中,Vue官方都以简单上手作为其推广的重点。这确实给Vue带来了非常大的用户量,尤其是最追求需求开发效率,往往不那么在意工程代码质量的国内中小企业中,Vue占据的份额极速增长...

【干货】一文详解html和css,前端开发需要哪些技术?
【干货】一文详解html和css,前端开发需要哪些技术?

网站开发简介...

2025-02-20 18:34 yuyutoo

分享几个css实用技巧_cssli

本篇将介绍几个css小技巧,目录如下:自定义引用标签的符号重置所有标签样式...

如何在浏览器中运行 .NET_怎么用浏览器运行代码

概述:...

前端-干货分享:更牛逼的CSS管理方法-层(CSS Layers)

使用CSS最困难的部分之一是处理CSS的权重值,它可以决定到底哪条规则会最终被应用,尤其是如果你想在Bootstrap这样的框架中覆盖其已有样式,更加显得麻烦。不过随着CSS层的引入,这一...

HTML 基础标签库_html标签基本结构
HTML 基础标签库_html标签基本结构

HTML标题HTML标题(Heading)是通过-...

2025-02-20 18:34 yuyutoo

前端css面试20道常见考题_高级前端css面试题

1.请解释一下CSS3的flexbox(弹性盒布局模型),以及适用场景?display:flex;在父元素设置,子元素受弹性盒影响,默认排成一行,如果超出一行,按比例压缩flex:1;子元素设置...

vue引入外部js文件并使用_vue3 引入外部js

要在Vue中引入外部的JavaScript文件,可以使用以下几种方法:1.使用``标签引入外部的JavaScript文件。在Vue的HTML模板中,可以直接使用``标签来引入外部的JavaScrip...

网页设计得懂css的规范_html+css网页设计

在初级的前端工作人员,刚入职的时候,可能在学习前端技术,写代码不是否那么的规范,而在工作中,命名的规范的尤为重要,它直接与你的代码质量挂钩。网上也受很多,但比较杂乱,在加上每年的命名都会发生一变化。...

Google在Chrome中引入HTML 5.1标记

虽然负责制定Web标准的WorldWideWebConsortium(W3C)尚未宣布HTML5正式推荐规格,而Google已经迁移到了HTML5.1。即将发布的Chrome38将引入H...

HTML DOM 引用( ) 对象_html中如何引用js

引用对象引用对象定义了一个同内联元素的HTML引用。标签定义短的引用。元素经常在引用的内容周围添加引号。HTML文档中的每一个标签,都会创建一个引用对象。...

取消回复欢迎 发表评论: