0
163
VistasVentana personalizada con (min, max, botones de cierre) en la aplicación Electron.Net con Asp.net o Blazor
He convertido mi aplicación Asp.Net Core / Blazor a la aplicación Electron. Pero necesito Windows sin marco para poder personalizar la ventana de mi aplicación
Estoy usando este código para hacerlo sin marco
public async void Bootstrap() { var options = new BrowserWindowOptions { //Width = 1200, //Height = 600, //MinWidth = 940, //MinHeight = 560, Frame = false, WebPreferences = new WebPreferences { ContextIsolation = true, DevTools = true, WebSecurity = false, } }; await Electron.WindowManager.CreateWindowAsync(options); }Ahora he creado un archivo Html personalizado aquí
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>My Electron Frameless Window</title> <style> body { padding: 0px; margin: 0px; } #title-bar { -webkit-app-region: drag; height: 40px; text-align: center; line-height: 40px; vertical-align: middle; background-color: #B4C4C7; padding: none; margin: 0px; } #title { position: fixed; top: 0px; left: 6px; color: white; } #title-bar-btns { -webkit-app-region: no-drag; position: fixed; top: 0px; right: 6px; } </style> </head> <body> <div id="title-bar"> <div id="title"> <span style="vertical-align: middle;">Menu</span> Title Bar </div> <div id="title-bar-btns"> <button id="min-btn">-</button> <button id="max-btn">+</button> <button id="close-btn">x</button> </div> </div> <div style="text-align:center;"> <h4>Page Data Will Be Loaded Here</h4> </div> </body> </html> 
Pero no entiendo cómo agregar funcionalidad a estos botones, ayúdenme a resolver mi problema.
·
Juan Pablo Isaza
1 Respuestas
Responde la pregunta0
Use la última versión de ElectronNet desde aquí o desde Nuget luego
public async void Bootstrap() { var options = new BrowserWindowOptions { Frame = false, WebPreferences = new WebPreferences { ContextIsolation = true, DevTools = false, WebSecurity = false, EnableRemoteModule = true } }; await Electron.WindowManager.CreateWindowAsync(options); }Luego, en su diseño. Cshtml Crear tres botones
<button id="minimize" onclick="minimizeWindow()">Min Window</button> <button id="maximize" onclick="maximizeWindow()">Max Window</button> <button id="close" onclick="closeWindow()">Close Window</button>y usar código JavaScript
const {remote} = require('electron'); const getWindow = () => remote.BrowserWindow.getFocusedWindow(); function closeWindow () { getWindow().close(); } function minimizeWindow () { getWindow().minimize(); } function maximizeWindow () { const window = getWindow(); window.isMaximized() ? window.unmaximize() : window.maximize(); }Cree la aplicación, es decir.
·
Juan Pablo Isaza
Denunciar
Responde la pregunta