国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

使用 Electron 調(diào)用系統(tǒng)對話框

aristark / 896人閱讀

摘要：使用調(diào)用系統(tǒng)對話框此系列文章的應用示例已發(fā)布于可以或下載后運行查看歡迎中的模塊允許您使用本地系統(tǒng)對話框打開文件或目錄保存文件或顯示信息性消息這是一個主進程模塊因為這個進程對于本地實用程序更有效它允許調(diào)用的同時而不會中斷頁面渲染器進程中

使用 Electron 調(diào)用系統(tǒng)對話框 
此系列文章的應用示例已發(fā)布于 GitHub: electron-api-demos-Zh_CN. 可以 Clone 或下載后運行查看. 歡迎 Star .

Electron 中的 dialog 模塊允許您使用本地系統(tǒng)對話框打開文件或目錄, 保存文件或顯示信息性消息.

這是一個主進程模塊, 因為這個進程對于本地實用程序更有效, 它允許調(diào)用的同時而不會中斷頁面渲染器進程中的可見元素.

在瀏覽器中查看 完整 API 文檔 .

打開文件或目錄 
支持: Win, macOS, Linux | 進程: Main

在本示例中, ipc 模塊用于從渲染器進程發(fā)送一條消息, 指示主進程啟動打開的文件（或目錄）對話框. 如果選擇了文件, 主進程可以將該信息發(fā)送回渲染器進程.

渲染器進程

const ipc = require("electron").ipcRenderer

const selectDirBtn = document.getElementById("select-directory")

selectDirBtn.addEventListener("click", function (event) {
  ipc.send("open-file-dialog")
})

ipc.on("selected-directory", function (event, path) {
  document.getElementById("selected-file").innerHTML = `You selected: ${path}`
})

主進程

const ipc = require("electron").ipcMain
const dialog = require("electron").dialog

ipc.on("open-file-dialog", function (event) {
  dialog.showOpenDialog({
    properties: ["openFile", "openDirectory"]
  }, function (files) {
    if (files) event.sender.send("selected-directory", files)
  })
})
高級技巧

macOS 上的工作表樣式對話框.

在 macOS 上, 您可以在 "工作表" 對話框或默認對話框之間進行選擇. 工作表版本是從窗口頂部滑落. 要使用工作表版本, 請將 window 作為對話框方法中的第一個參數(shù).

const ipc = require("electron").ipcMain
const dialog = require("electron").dialog
const BrowserWindow = require("electron").BrowserWindow


ipc.on("open-file-dialog-sheet", function (event) {
  const window = BrowserWindow.fromWebContents(event.sender)
  const files = dialog.showOpenDialog(window, { properties: [ "openFile" ]})
})
錯誤對話框 
支持: Win, macOS, Linux | 進程: Main

在本示例中, ipc 模塊用于從渲染器進程發(fā)送一條消息, 指示主進程啟動錯誤對話框.

您可以在應用程序的 ready 事件之前使用錯誤對話框, 這對于在啟動時顯示錯誤很有用.

渲染器進程

const ipc = require("electron").ipcRenderer

const errorBtn = document.getElementById("error-dialog")

errorBtn.addEventListener("click", function (event) {
  ipc.send("open-error-dialog")
})

主進程

const ipc = require("electron").ipcMain
const dialog = require("electron").dialog

ipc.on("open-error-dialog", function (event) {
  dialog.showErrorBox("一條錯誤信息", "錯誤消息演示.")
})
信息對話框 
支持: Win, macOS, Linux | 進程: Main

在本示例中, ipc 模塊用于從渲染器進程發(fā)送一條消息, 指示主進程啟動信息對話框. 可以提供用于響應的選項, 響應會被返回到渲染器進程中.

注意：title 屬性不會顯示在 macOS 中.

一個信息對話框可以包含圖標, 選擇的按鈕, 標題和消息.

渲染器進程

const ipc = require("electron").ipcRenderer

const informationBtn = document.getElementById("information-dialog")

informationBtn.addEventListener("click", function (event) {
  ipc.send("open-information-dialog")
})

ipc.on("information-dialog-selection", function (event, index) {
  let message = "你選擇了 "
  if (index === 0) message += "是."
  else message += "否."
  document.getElementById("info-selection").innerHTML = message
})

主進程

const ipc = require("electron").ipcMain
const dialog = require("electron").dialog

ipc.on("open-information-dialog", function (event) {
  const options = {
    type: "info",
    title: "信息",
    message: "這是一個信息對話框. 很不錯吧？",
    buttons: ["是", "否"]
  }
  dialog.showMessageBox(options, function (index) {
    event.sender.send("information-dialog-selection", index)
  })
})
保存對話框 
支持: Win, macOS, Linux | 進程: Main

在本示例中, ipc 模塊用于從渲染器進程發(fā)送一條消息, 指示主進程啟動保存對話框. 它返回由用戶選擇的路徑, 并可以將其路由回渲染器進程.

渲染器進程

const ipc = require("electron").ipcRenderer

const saveBtn = document.getElementById("save-dialog")

saveBtn.addEventListener("click", function (event) {
  ipc.send("save-dialog")
})

ipc.on("saved-file", function (event, path) {
  if (!path) path = "無路徑"
  document.getElementById("file-saved").innerHTML = `選擇的路徑: ${path}`
})

主進程

const ipc = require("electron").ipcMain
const dialog = require("electron").dialog

ipc.on("save-dialog", function (event) {
  const options = {
    title: "保存圖片",
    filters: [
      { name: "Images", extensions: ["jpg", "png", "gif"] }
    ]
  }
  dialog.showSaveDialog(options, function (filename) {
    event.sender.send("saved-file", filename)
  })
})
如果這邊文章對您有幫助, 感謝 下方點贊 或 Star  GitHub: electron-api-demos-Zh_CN 支持, 謝謝.

文章版權歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://specialneedsforspecialkids.com/yun/81828.html

相關文章

  • Electron選擇文件、文件夾對話框(非原創(chuàng)，傳播)

    摘要：文章轉(zhuǎn)載自，感謝文章作者，成功完成選擇文件夾的功能第一種方法，純代碼其原理是利用標簽的類別，打開選擇文件對話框通過標簽的事件，將選擇的文件返回。通過標簽對象的屬性獲得選中的文件名。 文章轉(zhuǎn)載自：https://www.jianshu.com/p/e71...，感謝文章作者，成功完成選擇文件夾 的功能 1.第一種方法，純js代碼其原理是：利用input標簽的file類別，打開選擇文件對話...

    Clect 評論0 收藏0

  • 如何使用前端技術開發(fā)一個桌面跨端應用

    摘要：使用實現(xiàn)桌面應用實現(xiàn)離線可用很多方法，比如使用技術。還有一個好處，因為它完全基于來實現(xiàn)可以使用的一些新功能，那我們理論上可以在做桌面應用時順手把應用也做了。 本文將會講述一個完整的跨端桌面應用?代碼畫板?的構建，會涉及到整個軟件開發(fā)流程，從開始的設計、編碼、到最后產(chǎn)品成型、包裝等。 本文不僅僅是一篇技術方面的專業(yè)文章，更會有很多產(chǎn)品方面的設計思想和將技術轉(zhuǎn)換成生產(chǎn)力的思考，我將結合我自...

    shixinzhang 評論0 收藏0

  • electronjs 入門_2019年2月14日

    electronjs 是什么?可以用javascript寫，windows / mac / linux 界面程序的開發(fā)框架。參看:https://electronjs.org/ https://electronjs.org/docs 快速開始必備的條件: nodejs的安裝 git git clone https://github.com/electron/e...cd electron-q...

    yanwei 評論0 收藏0

  • electronjs 入門_2019年2月14日

    electronjs 是什么?可以用javascript寫，windows / mac / linux 界面程序的開發(fā)框架。參看:https://electronjs.org/ https://electronjs.org/docs 快速開始必備的條件: nodejs的安裝 git git clone https://github.com/electron/e...cd electron-q...

    SnaiLiu 評論0 收藏0

  • 如何從0開發(fā)一個Atom組件

    摘要：將剪切板中的數(shù)據(jù)轉(zhuǎn)換為然后暫存到本地，通過本地文件的方式來進行上傳七牛。以上，就是開發(fā)一個插件的完整流程咯。 最近用Atom寫博客比較多，然后發(fā)現(xiàn)一個很嚴重的問題。。沒有一個我想要的上傳圖片的方式，比如某乎上邊就可以直接copy/paste文件，然后進行上傳。然而在Atom上沒有找到類似的插件，最接近的一個，也還是需要手動選擇文件，然后進行上傳。這個操作流程太繁瑣，索性自己寫一個插件用...

    lauren_liuling 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<