electron-tabs-sample:示例应用程序演示了Electron中的多个窗口和多个选项卡功能

  • k7_810299
    了解作者
  • 17.1KB
    文件大小
  • zip
    文件格式
  • 0
    收藏次数
  • VIP专享
    资源类型
  • 0
    下载次数
  • 2022-06-13 00:51
    上传日期
电子选项卡式 这是一个示例应用程序,演示了多个窗口和多个选项卡功能。 功能由 跑步 $ npm i $ npm start 文件结构概述 tabs\文件夹,其中包含在选项卡中打开的示例页面 windows\文件夹,其中包含作为新窗口打开的示例页面 在应用程序首次启动时显示的windows\main\窗口,并显示一个包含所有选项卡链接的菜单 windows\tabs\包含从主菜单打开的所有选项windows\tabs\窗口 main.js应用程序的主要过程。 负责打开窗户并处理窗户之间的通讯 整体方法 应用程序首次启动时,将打开一个新窗口( window\main\index.html )。 主窗口有一个包含三个链接的菜单。 这些链接可以引用此应用程序内的其他页面(请参阅链接1和链接2)或外部链接(请参阅链接3)。 当从菜单中选择一个链接时,该窗口会请求主进程打开一个带有标题和URL参数的
electron-tabs-sample-master.zip
  • electron-tabs-sample-master
  • .gitignore
    914B
  • package.json
    344B
  • main.js
    1.8KB
  • package-lock.json
    42.3KB
  • windows
  • main
  • index.js
    619B
  • index.html
    611B
  • index.css
    755B
  • tabs
  • index.js
    924B
  • index.html
    478B
  • README.md
    1.5KB
  • tabs
  • tab.2.html
    141B
  • tab.1.html
    140B
内容介绍
# Electron Tabbed This is a sample app that demonstrates multiple windows and multiple tabs functionality in [Electron](https://electronjs.org/). Tabbing functionality is provided by [electron-tabs](https://www.npmjs.com/package/electron-tabs) ## Running ```sh $ npm i $ npm start ``` ## File Structure Overview * `tabs\` folder containing sample pages that are open within tabs * `windows\` folder with sample pages that are open as new windows * `windows\main\` window displayed when app first starts and shows a menu with links to all tabs * `windows\tabs\` window that contains all tabs that are opened from the main menu * `main.js` main process of the application. Responsible for opening the windows and handling communication between the windows ## Overall Approach 1. When the app first starts, a new window (`window\main\index.html`) is opened. The main window has a menu with three links. The links can reference other pages within this application (see Link 1 and Link 2) or link outside (see Link 3) 2. When a link is selected from the menu, the window requests the main process to open a new tab with the title and URL parameters. 3. The main process checks if a window with tabs already exists. If it does, it sends a message to the tabbed window to add a tab. If not, it first creates a tabbed window and then sends a message to it to add a tab. 4. The tabbed window listens for requests from the main process, and adds new tabs to the tab group when the new tab events are dispatched from the main process.
评论
    相关推荐
    • electron-test
      电子测试 项目设置 npm install 编译和热重装以进行开发 npm run serve 编译并最小化生产 npm run build 整理和修复文件 npm run lint 自定义配置 请参阅。
    • electron_sample
      电子样品 安装步骤 sudo npm install -g electron-prebuilt
    • electron-boilerplate
      电子样板 具有React + Babel的Electron的模板。 开始项目 npm install npm run init npm run server 包装 npm run release
    • pluggable-electron
      可插拔电子 什么是可插拔电子 可插拔Electron是一个框架,用于构建可以被其他方扩展的Electron应用程序。 :red_exclamation_mark: 注意 :red_exclamation_mark...npm install pluggable-electron 用法 该框架围绕扩展
    • electron-demo
      电子演示 按照安装依赖项以编译串行端口。 npm安装 npm run electronic命令运行该应用程序 npm run dist命令创建dist
    • electron-musicplayer
      安装依赖 npm install 本地运行项目 npm start 项目打包成 App npm run dist
    • productivity-electron
      生产率 桌面生产力经理 构建设置 # install dependencies npm install ...# build electron application for production npm run build 该项目是通过使用 @ 生成的。 关于原始结构的文档可以在找到。
    • vue3-electron
      vue3-电子 项目设置 npm install 编译和热重装以进行开发 npm run serve 编译并最小化生产 npm run build 整理和修复文件 npm run lint 自定义配置 请参阅。
    • electron.zip
      npm install electron安装后报错无法运行的小伙伴,说明electron没下载成功 下载后解压到node_modules目录即可,npm install electron安装后无法运行的小伙伴,下载这个electron压缩包,解压到node_modules
    • electron-remotty
      用法 在OSX中构建应用 npm install -g electron-packager electron-packager . remotty --platform=darwin --arch=x64 --version=0.33.3 --overwrite --icon=images/icon.icns