Nui-Components.nvim 使用教程

Nui-Components.nvim 使用教程

nui-components.nvimA feature-rich and highly customizable library for creating user interfaces in Neovim.项目地址:https://gitcode.com/gh_mirrors/nu/nui-components.nvim

项目介绍

Nui-Components.nvim 是一个为 Neovim 设计的用户界面组件库，旨在使 Neovim 中的 UI 开发更加直观、易用和愉快。该库基于 nui.nvim 构建，提供了一系列丰富的工具，用于使用 Lua 在 Neovim 中创建用户界面。

项目快速启动

安装

首先，确保你已经安装了 Neovim 和 Packer.nvim（一个 Neovim 的包管理器）。然后，在你的 init.lua 或 init.vim 文件中添加以下代码来安装 Nui-Components.nvim：

use {
  'grapp-dev/nui-components.nvim',
  requires = {
    'MunifTanjim/nui.nvim',
  },
  config = function()
    require('nui-components').setup()
  end
}

基本使用

以下是一个简单的示例，展示如何使用 Nui-Components.nvim 创建一个弹出窗口：

local Popup = require("nui.popup")

local popup = Popup({
  enter = true,
  border = {
    style = "single",
    text = {
      top = "[示例弹出窗口]",
      top_align = "center",
    },
  },
  position = "50%",
  size = {
    width = 40,
    height = 10,
  },
})

popup:mount()

popup:on({ "BufLeave", "BufHidden", "BufDelete" }, function()
  popup:unmount()
end)

应用案例和最佳实践

创建一个菜单

以下是一个创建菜单的示例：

local Menu = require("nui.menu")
local event = require("nui.utils.autocmd")

local menu = Menu({
  position = "50%",
  size = {
    width = 25,
    height = 5,
  },
  border = {
    style = "single",
    text = {
      top = "[选择一个元素]",
      top_align = "center",
    },
  },
  win_options = {
    winhighlight = "Normal:Normal,FloatBorder:Normal",
  },
}, {
  lines = {
    Menu.item("氢 (H)"),
    Menu.item("碳 (C)"),
    Menu.item("氮 (N)"),
    Menu.separator("惰性气体", { char = "-", text_align = "right" }),
    Menu.item("氦 (He)"),
    Menu.item("氖 (Ne)"),
    Menu.item("氩 (Ar)"),
  },
  max_width = 20,
  keymap = {
    focus_next = { "j", "<Down>", "<Tab>" },
    focus_prev = { "k", "<Up>", "<S-Tab>" },
    close = { "<Esc>", "<C-c>" },
    submit = { "<CR>" },
  },
})

menu:mount()

典型生态项目

Nui-Components.nvim 可以与其他 Neovim 插件结合使用，例如：

• nvim-tree.lua: 一个文件树插件，可以与 Nui-Components.nvim 结合使用，提供更好的文件管理体验。
• lualine.nvim: 一个状态栏插件，可以使用 Nui-Components.nvim 提供的组件来增强状态栏的功能。

通过这些组合，你可以构建一个功能强大且高度定制的 Neovim 开发环境。

nui-components.nvimA feature-rich and highly customizable library for creating user interfaces in Neovim.项目地址:https://gitcode.com/gh_mirrors/nu/nui-components.nvim