chrome.app.window

Descripción

Usa la API de chrome.app.window para crear ventanas. Las ventanas tienen un marco opcional con barra de título y controles de tamaño. No están asociadas con ninguna ventana del navegador Chrome. Consulta la Muestra del estado de la ventana para ver una demostración de estas opciones.

Tipos

AppWindow

Propiedades

  • contentWindow

    Ventana

    La "ventana" de JavaScript para el elemento secundario que se creó.

  • id

    string

    El ID con el que se creó la ventana.

  • innerBounds

    Límites

    La posición, el tamaño y las restricciones del contenido de la ventana, que no incluye las decoraciones de la ventana. Esta propiedad es nueva en Chrome 36.

  • outerBounds

    Límites

    La posición, el tamaño y las restricciones de la ventana, incluidas sus decoraciones, como la barra de título y el marco Esta propiedad es nueva en Chrome 36.

  • clearAttention

    void

    Presta atención a la ventana.

    La función clearAttention se ve de la siguiente manera: 

    () => {...}

  • cerrar

    void

    Cierre la ventana.

    La función close se ve de la siguiente manera: 

    () => {...}

  • drawAttention

    void

    Destaca la ventana.

    La función drawAttention se ve de la siguiente manera: 

    () => {...}

  • enfoque

    void

    Enfoca la ventana.

    La función focus se ve de la siguiente manera: 

    () => {...}

  • pantalla completa

    void

    Pantalla completa de la ventana.

    El usuario podrá restaurar la ventana presionando ESC. Una aplicación puede evitar que quede el estado de pantalla completa cuando se presiona ESC, para lo cual solicita el permiso app.window.fullscreen.overrideEsc y cancela el evento llamando a .preventDefault(), en los controladores keydown y keyup, de la siguiente manera:

    window.onkeydown = window.onkeyup = function(e) { if (e.keyCode == 27 /* ESC *\/) { e.preventDefault(); } };

    Ten en cuenta que window.fullscreen() hará que toda la ventana se muestre en pantalla completa y no requerirá un gesto del usuario. La API de pantalla completa de HTML5 también se puede utilizar para entrar al modo de pantalla completa (consulta API web para obtener más información).

    La función fullscreen se ve de la siguiente manera: 

    () => {...}

  • getBounds

    void

    Obsoleto

    Usa InternalBounds o outerBounds.

    Obtén los límites internos de la ventana como un objeto ContentBounds.

    La función getBounds se ve de la siguiente manera: 

    () => {...}

  • ocultar

    void

    Ocultar la ventana. No hace nada si la ventana ya está oculta.

    La función hide se ve de la siguiente manera: 

    () => {...}

  • isAlwaysOnTop

    void

    ¿La ventana siempre está en la parte superior?

    La función isAlwaysOnTop se ve de la siguiente manera: 

    () => {...}

    • muestra

      boolean

  • isFullscreen

    void

    ¿La ventana está en pantalla completa? Esto será así si la ventana se creó en pantalla completa o se configuró en pantalla completa mediante las APIs de pantalla completa de AppWindow o HTML5.

    La función isFullscreen se ve de la siguiente manera: 

    () => {...}

    • muestra

      boolean

  • isMaximized

    void

    ¿La ventana está maximizada?

    La función isMaximized se ve de la siguiente manera: 

    () => {...}

    • muestra

      boolean

  • isMinimized

    void

    ¿La ventana está minimizada?

    La función isMinimized se ve de la siguiente manera: 

    () => {...}

    • muestra

      boolean

  • maximizar

    void

    Maximiza la ventana.

    La función maximize se ve de la siguiente manera: 

    () => {...}

  • minimizar

    void

    Minimiza la ventana.

    La función minimize se ve de la siguiente manera: 

    () => {...}

  • moveTo

    void

    Obsoleto desde Chrome 43

    Usa outerBounds.

    Mueve la ventana a la posición (left, top).

    La función moveTo se ve de la siguiente manera: 

    (left: number, top: number) => {...}

    • izquierda

      número

    • superior

      número

  • resizeTo

    void

    Obsoleto desde Chrome 43

    Usa outerBounds.

    Cambia el tamaño de la ventana a width x height píxeles.

    La función resizeTo se ve de la siguiente manera: 

    (width: number, height: number) => {...}

    • ancho

      número

    • alto

      número

  • restore

    void

    Restaurar la ventana, saliendo de un estado maximizado, minimizado o de pantalla completa

    La función restore se ve de la siguiente manera: 

    () => {...}

  • setAlwaysOnTop

    void

    Establece si la ventana debe permanecer por encima de la mayoría de las demás. Requiere el permiso alwaysOnTopWindows.

    La función setAlwaysOnTop se ve de la siguiente manera: 

    (alwaysOnTop: boolean) => {...}

    • alwaysOnTop

      boolean

  • setBounds

    void

    Obsoleto

    Usa InternalBounds o outerBounds.

    Configura los límites internos de la ventana.

    La función setBounds se ve de la siguiente manera: 

    (bounds: ContentBounds) => {...}

  • setVisibleOnAllWorkspaces

    void

    Establece si la ventana es visible en todos los lugares de trabajo. (Solo para plataformas compatibles).

    La función setVisibleOnAllWorkspaces se ve de la siguiente manera: 

    (alwaysVisible: boolean) => {...}

    • alwaysVisible

      boolean

  • mostrar

    void

    Muestra la ventana. No hace nada si la ventana ya está visible. Enfoca la ventana si focused se establece como verdadero o se omite.

    La función show se ve de la siguiente manera: 

    (focused?: boolean) => {...}

    • enfocados

      booleano opcional

Bounds

Propiedades

  • alto

    número

    Esta propiedad se puede usar para leer o escribir la altura actual del contenido o la ventana.

  • izquierda

    número

    Esta propiedad se puede usar para leer o escribir la coordenada X actual del contenido o la ventana.

  • maxHeight

    número opcional

    Esta propiedad se puede usar para leer o escribir la altura máxima actual del contenido o la ventana. Un valor de null indica "sin especificar".

  • maxWidth

    número opcional

    Esta propiedad se puede usar para leer o escribir el ancho máximo actual del contenido o la ventana. Un valor de null indica "sin especificar".

  • minHeight

    número opcional

    Esta propiedad se puede usar para leer o escribir la altura mínima actual del contenido o la ventana. Un valor de null indica "sin especificar".

  • minWidth

    número opcional

    Esta propiedad se puede usar para leer o escribir el ancho mínimo actual del contenido o la ventana. Un valor de null indica "sin especificar".

  • superior

    número

    Esta propiedad se puede usar para leer o escribir la coordenada Y actual del contenido o la ventana.

  • ancho

    número

    Esta propiedad se puede usar para leer o escribir el ancho actual del contenido o la ventana.

  • setMaximumSize

    void

    Establece las restricciones de tamaño máximo del contenido o la ventana. El ancho o la altura máximos se pueden establecer en null para quitar la restricción. Un valor de undefined no modificará la restricción.

    La función setMaximumSize se ve de la siguiente manera: 

    (maxWidth: number, maxHeight: number) => {...}

    • maxWidth

      número

    • maxHeight

      número

  • setMinimumSize

    void

    Establece las restricciones de tamaño mínimo del contenido o la ventana. El ancho o la altura mínimos se pueden establecer en null para quitar la restricción. Un valor de undefined no modificará la restricción.

    La función setMinimumSize se ve de la siguiente manera: 

    (minWidth: number, minHeight: number) => {...}

    • minWidth

      número

    • minHeight

      número

  • setPosition

    void

    Establece la posición superior o izquierda del contenido o la ventana.

    La función setPosition se ve de la siguiente manera: 

    (left: number, top: number) => {...}

    • izquierda

      número

    • superior

      número

  • setSize

    void

    Establece el ancho y el alto del contenido o la ventana.

    La función setSize se ve de la siguiente manera: 

    (width: number, height: number) => {...}

    • ancho

      número

    • alto

      número

BoundsSpecification

Propiedades

  • alto

    número opcional

    La altura del contenido o la ventana.

  • izquierda

    número opcional

    Es la coordenada X del contenido o la ventana.

  • maxHeight

    número opcional

    Es la altura máxima del contenido o la ventana.

  • maxWidth

    número opcional

    Es el ancho máximo del contenido o la ventana.

  • minHeight

    número opcional

    Es la altura mínima del contenido o la ventana.

  • minWidth

    número opcional

    Es el ancho mínimo del contenido o la ventana.

  • superior

    número opcional

    Es la coordenada Y del contenido o la ventana.

  • ancho

    número opcional

    Es el ancho del contenido o la ventana.

ContentBounds

Propiedades

  • alto

    número opcional

  • izquierda

    número opcional

  • superior

    número opcional

  • ancho

    número opcional

CreateWindowOptions

Propiedades

  • alwaysOnTop

    booleano opcional

    Si es "true", la ventana se mantendrá por encima de la mayoría de las demás ventanas. Si hay varias ventanas de este tipo, la ventana enfocada actualmente se mostrará en primer plano. Requiere el permiso alwaysOnTopWindows. La configuración predeterminada es "false".

    Llama a setAlwaysOnTop() en la ventana para cambiar esta propiedad después de la creación.

  • límites

    ContentBounds opcional

    Obsoleto

    Usa InternalBounds o outerBounds.

    Es el tamaño y la posición del contenido en la ventana (sin incluir la barra de título). Si también se especifica un ID y se mostró antes una ventana con un ID coincidente, se usarán en su lugar los límites recordados de la ventana.

  • enfocados

    booleano opcional

    Si es verdadero, la ventana se enfocará cuando se cree. El valor predeterminado es verdadero.

  • marco

    string | FrameOptions opcional

    Tipo de marco: none o chrome (el valor predeterminado es chrome). En el caso de none, se puede usar la propiedad de CSS -webkit-app-region para aplicar la capacidad de arrastrar a la ventana de la app. Se puede utilizar -webkit-app-region: drag para marcar las regiones que son arrastrables. Se puede usar no-drag para inhabilitar este estilo en los elementos anidados.

    El uso de FrameOptions es nuevo en M36.

  • oculta

    booleano opcional

    Si es verdadero, la ventana se creará en un estado oculto. Llama a show() en la ventana para mostrarla cuando se haya creado. La configuración predeterminada es "false".

  • ícono

    string opcional

    Chrome 54 y versiones posteriores

    URL del ícono de la ventana. Una ventana puede tener su propio ícono cuando showInShelf está configurado como verdadero. La URL debe ser una URL global o una URL local de extensión.

  • id

    string opcional

    Es el ID para identificar la ventana. Se usará para recordar el tamaño y la posición de la ventana, y restablecer esa geometría cuando más adelante se abra una ventana con el mismo ID. Si se crea una ventana con un ID determinado mientras ya existe otra con el mismo ID, se enfocará la ventana abierta actualmente en lugar de crear una ventana nueva.

  • innerBounds

    BoundsSpecification opcional

    Se usa para especificar la posición inicial, el tamaño inicial y las restricciones del contenido de la ventana (excluyendo las decoraciones de la ventana). Si también se especifica un id y se mostró antes una ventana con un id coincidente, se usarán los límites recordados en su lugar.

    Ten en cuenta que el SO determina el padding entre los límites internos y externos. Por lo tanto, configurar la misma propiedad de límites para innerBounds y outerBounds generará un error.

    Esta propiedad es nueva en Chrome 36.

  • maxHeight

    número opcional

    Obsoleto

    Usa InternalBounds o outerBounds.

    Altura máxima de la ventana.

  • maxWidth

    número opcional

    Obsoleto

    Usa InternalBounds o outerBounds.

    Ancho máximo de la ventana.

  • minHeight

    número opcional

    Obsoleto

    Usa InternalBounds o outerBounds.

    Altura mínima de la ventana.

  • minWidth

    número opcional

    Obsoleto

    Usa InternalBounds o outerBounds.

    Ancho mínimo de la ventana.

  • outerBounds

    BoundsSpecification opcional

    Se usa para especificar la posición inicial, el tamaño inicial y las restricciones de la ventana (incluidas las decoraciones, como la barra de título y el marco). Si también se especifica un id y se mostró antes una ventana con un id coincidente, se usarán los límites recordados en su lugar.

    Ten en cuenta que el SO determina el padding entre los límites internos y externos. Por lo tanto, configurar la misma propiedad de límites para innerBounds y outerBounds generará un error.

    Esta propiedad es nueva en Chrome 36.

  • redimensionable

    booleano opcional

    Si es verdadero, el usuario podrá cambiar el tamaño de la ventana. El valor predeterminado es verdadero.

  • showInShelf

    booleano opcional

    Chrome 54 y versiones posteriores

    Si esta preferencia se establece como "true", la ventana tendrá su propio ícono de barra. De lo contrario, la ventana se agrupará en la barra con otras ventanas asociadas a la app. La configuración predeterminada es "false". Si showInShelf está configurado como true, debes especificar un ID para la ventana.

  • singleton

    booleano opcional

    Obsoleto

    Ya no se admiten varias ventanas con el mismo ID.

    De forma predeterminada, si especificas un ID para la ventana, la ventana solo se creará si no existe otra con el mismo ID. Si ya existe una ventana con el mismo ID, esa ventana se activa en su lugar. Si deseas crear varias ventanas con el mismo ID, puedes establecer esta propiedad como falsa.

  • state

    Estado opcional

    El estado inicial de la ventana, lo que permite que se cree en pantalla completa, maximizada o minimizada. La configuración predeterminada es “normal”.

  • tipo

    WindowType opcional

    Chrome 45 y versiones posteriores Obsoleto desde Chrome 69

    Todas las ventanas de la app usan la "shell" tipo de ventana

    Tipo de ventana para crear.

  • visibleOnAllWorkspaces

    booleano opcional

    Si es verdadera y es compatible con la plataforma, la ventana será visible en todos los lugares de trabajo.

FrameOptions

Propiedades

  • activeColor

    string opcional

    Permite establecer el color del marco de la ventana cuando está activa. El coloreado de marcos solo está disponible si el tipo de marco es chrome.

    El coloreado de marcos solo está disponible si el tipo de marco es chrome.

    El color de marcos es una novedad en Chrome 36.

  • color

    string opcional

    Permite establecer el color del marco. El coloreado de marcos solo está disponible si el tipo de marco es chrome.

    El color de marcos es una novedad en Chrome 36.

  • inactiveColor

    string opcional

    Permite que el color del marco de la ventana cuando está inactivo se configure de manera diferente al color activo. El coloreado de marcos solo está disponible si el tipo de marco es chrome.

    inactiveColor debe usarse junto con color.

    El color de marcos es una novedad en Chrome 36.

  • tipo

    string opcional

    Tipo de marco: none o chrome (el valor predeterminado es chrome).

    En el caso de none, se puede usar la propiedad de CSS -webkit-app-region para aplicar la capacidad de arrastrar a la ventana de la app.

    Se puede utilizar -webkit-app-region: drag para marcar las regiones que son arrastrables. Se puede usar no-drag para inhabilitar este estilo en los elementos anidados.

State

Estado de una ventana: normal, pantalla completa, maximizada, minimizada

Enum

“normal”

"pantalla completa"

"maximized"

“minimizado”

WindowType

Chrome 45 y versiones posteriores

Especifica el tipo de ventana que se creará.

Enum

"shell"
Tipo de ventana predeterminado.

"panel"
Ventana administrada del SO (obsoleta).

Métodos

canSetVisibleOnAllWorkspaces()

chrome.app.window.canSetVisibleOnAllWorkspaces()

Indica si la plataforma actual admite que las ventanas sean visibles en todos los lugares de trabajo.

Muestra

  • boolean

create()

Promesa 
chrome.app.window.create(
  url: string,
  options?: CreateWindowOptions,
  callback?: function,
)

El tamaño y la posición de una ventana se pueden especificar de varias maneras diferentes. La opción más simple consiste en no especificar nada. En ese caso, se usará un tamaño predeterminado y una posición que dependa de la plataforma.

Para establecer la posición, el tamaño y las restricciones de la ventana, usa las propiedades innerBounds o outerBounds. Los límites internos no incluyen decoraciones de la ventana. Los límites externos incluyen la barra de título y el marco de la ventana. Ten en cuenta que el SO determina el padding entre los límites internos y externos. Por lo tanto, configurar la misma propiedad para los límites internos y externos se considera un error (por ejemplo, configurar innerBounds.left y outerBounds.left).

Para recordar automáticamente las posiciones de las ventanas, puedes asignarles IDs. Si una ventana tiene un ID, este se usa para recordar el tamaño y la posición de la ventana cada vez que se la mueve o se cambia su tamaño. Este tamaño y posición se usan en lugar de los límites especificados en la apertura posterior de una ventana con el mismo ID. Si necesitas abrir una ventana con un ID en una ubicación que no sea la predeterminada recordada, puedes ocultarla, moverla a la ubicación deseada y luego mostrarla.

Parámetros

  • url

    string

  • opciones

    CreateWindowOptions opcional

  • callback

    función opcional

    El parámetro callback se ve de la siguiente manera: 

    (createdWindow: AppWindow) => void

Muestra

  • Promise<AppWindow>

    Chrome 117 y versiones posteriores

    Las promesas solo son compatibles con Manifest V3 y versiones posteriores; otras plataformas deben usar devoluciones de llamada.

current()

chrome.app.window.current()

Muestra un objeto AppWindow para el contexto de la secuencia de comandos actual (es decir, el objeto "window" de JavaScript). También se puede llamar a esto en un controlador para un contexto de secuencia de comandos de otra página, por ejemplo: otherWindow.chrome.app.window.current().

Muestra

get()

chrome.app.window.get(
  id: string,
)

Obtiene un AppWindow con el ID proporcionado. Si no existe ninguna ventana con el ID proporcionado, se muestra un valor nulo. Este método es nuevo en Chrome 33.

Parámetros

  • id

    string

Muestra

getAll()

chrome.app.window.getAll()

Obtiene un array de todas las ventanas de apps creadas actualmente. Este método es nuevo en Chrome 33.

Muestra

Eventos

onBoundsChanged

chrome.app.window.onBoundsChanged.addListener(
  callback: function,
)

Se activa cuando se cambia el tamaño de la ventana.

Parámetros

  • callback

    función

    El parámetro callback se ve de la siguiente manera: 

    () => void

onClosed

chrome.app.window.onClosed.addListener(
  callback: function,
)

Se activa cuando se cierra la ventana. Ten en cuenta que se debe escuchar desde una ventana que no sea la que se cierra, por ejemplo, desde la página en segundo plano. Esto se debe a que la ventana que se cierra estará en proceso de eliminación cuando se active el evento, lo que significa que no todas las APIs del contexto de secuencias de comandos de la ventana funcionarán.

Parámetros

  • callback

    función

    El parámetro callback se ve de la siguiente manera: 

    () => void

onFullscreened

chrome.app.window.onFullscreened.addListener(
  callback: function,
)

Se activa cuando la ventana entra en pantalla completa (ya sea mediante las APIs de AppWindow o HTML5).

Parámetros

  • callback

    función

    El parámetro callback se ve de la siguiente manera: 

    () => void

onMaximized

chrome.app.window.onMaximized.addListener(
  callback: function,
)

Se activa cuando se maximiza la ventana.

Parámetros

  • callback

    función

    El parámetro callback se ve de la siguiente manera: 

    () => void

onMinimized

chrome.app.window.onMinimized.addListener(
  callback: function,
)

Se activa cuando la ventana está minimizada.

Parámetros

  • callback

    función

    El parámetro callback se ve de la siguiente manera: 

    () => void

onRestored

chrome.app.window.onRestored.addListener(
  callback: function,
)

Se activa cuando se restablece la ventana minimizada o maximizada.

Parámetros

  • callback

    función

    El parámetro callback se ve de la siguiente manera: 

    () => void