【问题标题】:how to adjust height and width of an app according to screen resolution如何根据屏幕分辨率调整应用程序的高度和宽度
【发布时间】:2021-07-06 13:23:27
【问题描述】:

我需要简化应用程序的电子显示,如果显示器较小,例如笔记本电脑显示器或 iMac 等大尺寸显示器,应用程序将缩小其尺寸。如果应用程序在笔记本电脑上运行,则大小应小于应用程序的实际大小。我从webPreference API 尝试了ZoomFactor,但它没有按我的预期工作。

任何帮助将不胜感激,在此先感谢。

【问题讨论】:

    标签: electron electron-builder


    【解决方案1】:

    创建BrowserWindow 后,您应该调用maximize()

    mainWindow1 = new BrowserWindow();
    mainWindow1.loadFile(htmlPath);
    mainWindow1.maximize();
    

    https://electronjs.org/docs/api/browser-window#winmaximize

    取自 - How to make window size responsive in Electron. (On the opening of the app)

    【讨论】:

    • 这不是我真正想要的我的应用程序是一个固定大小的应用程序并且不可最大化。所以,它位于屏幕的固定部分。所以,当我在较小的显示器中打开它或者我可以说较小的分辨率显示器时,它会从顶部被切掉。
    • 似乎您需要针对不同屏幕尺寸的不同固定尺寸。获取屏幕大小并根据宽度/高度进行一些逻辑并调整应用程序大小。您的应用程序大小需要最小大小和理想大小,但应该可以在其他分辨率下使用,可能是屏幕大小的百分比或最小值(其中的最大值) )
    【解决方案2】:

    对于您的用例(如果我理解的话),您可以使用screen 确定启动时的屏幕大小,然后适当调整窗口大小。

    const { app, BrowserWindow, screen } = require('electron')
    
    let win
    app.whenReady().then(() => {
      const { width, height } = screen.getPrimaryDisplay().workAreaSize
      win = new BrowserWindow({ width, height })
      win.loadURL('https://github.com')
    })
    

    【讨论】:

    • 我有固定宽度和高度的应用程序窗口。所以,它在我的情况下不起作用。当它在低分辨率系统中运行时,我需要将应用程序窗口大小缩小。
    • @HarshMakwana - 我想我当时不明白。在调整大小时,您可以通过做一些数学运算来保持纵横比,以使窗口比例保持不变。 FWIW - 还有一个“resizeWindowContents”功能(不是它的确切名称,但它就是这样做的。)。无论如何,祝你好运。
    猜你喜欢
    • 2012-04-17
    • 2010-11-19
    • 1970-01-01
    • 1970-01-01
    • 2014-08-24
    • 1970-01-01
    • 2023-03-03
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多