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 de estado de la ventana para ver una demostración de estas opciones.

Tipos

AppWindow

Propiedades

  • contentWindow

    Ventana

    Es el objeto "window" de JavaScript para el elemento secundario creado.

  • id

    string

    Es 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, que incluye decoraciones de la ventana, 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

    Atraer la atención a 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

    Muestra la ventana en pantalla completa.

    El usuario podrá restablecer la ventana presionando ESC. Una aplicación puede evitar que se salga del estado de pantalla completa cuando se presiona ESC solicitando el permiso app.window.fullscreen.overrideEsc y cancelando 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 requiere un gesto del usuario. La API de pantalla completa de HTML5 también se puede usar para ingresar al modo de pantalla completa (consulta APIs web para obtener más detalles).

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

    () => {...}

  • getBounds

    void

    Obsoleto

    Usa innerBounds o outerBounds.

    Obtiene 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

      booleano

  • isFullscreen

    void

    ¿La ventana está en pantalla completa? Esto será verdadero si la ventana se creó en pantalla completa o se puso en pantalla completa a través de las APIs de pantalla completa de AppWindow o HTML5.

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

    () => {...}

    • muestra

      booleano

  • isMaximized

    void

    ¿La ventana está maximizada?

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

    () => {...}

    • muestra

      booleano

  • isMinimized

    void

    ¿La ventana está minimizada?

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

    () => {...}

    • muestra

      booleano

  • maximizar

    void

    Maximizar la ventana

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

    () => {...}

  • minimizar

    void

    Minimizar 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 × height píxeles.

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

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

    • ancho

      número

    • alto

      número

  • restablecer

    void

    Restablece la ventana y sal del 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 ventanas. Requiere el permiso alwaysOnTopWindows.

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

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

    • alwaysOnTop

      booleano

  • setBounds

    void

    Obsoleto

    Usa innerBounds o outerBounds.

    Establece 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 espacios de trabajo. (solo para plataformas que admiten esta opción)

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

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

    • alwaysVisible

      booleano

  • 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 de la ventana.

  • izquierda

    número

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

  • maxHeight

    number opcional

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

  • maxWidth

    number 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

    number 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

    number 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 de la ventana.

  • setMaximumSize

    void

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

    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 dejará una restricción sin cambios.

    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 izquierda y superior 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 la altura 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

    number opcional

    Es la altura del contenido o de la ventana.

  • izquierda

    number opcional

    Es la coordenada X del contenido o la ventana.

  • maxHeight

    number opcional

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

  • maxWidth

    number opcional

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

  • minHeight

    number opcional

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

  • minWidth

    number opcional

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

  • superior

    number opcional

    Es la coordenada Y del contenido o la ventana.

  • ancho

    number opcional

    Es el ancho del contenido o de la ventana.

ContentBounds

Propiedades

  • alto

    number opcional

  • izquierda

    number opcional

  • superior

    number opcional

  • ancho

    number opcional

CreateWindowOptions

Propiedades

  • alwaysOnTop

    booleano opcional

    Si es verdadero, la ventana permanecerá por encima de la mayoría de las demás ventanas. Si hay varias ventanas de este tipo, la ventana enfocada actualmente estará 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.

  • bounds

    ContentBounds opcional

    Obsoleto

    Usa innerBounds 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 ya se mostró una ventana con un ID coincidente, se usarán 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). Para none, se puede usar la propiedad de CSS -webkit-app-region para aplicar la capacidad de arrastrar a la ventana de la app. -webkit-app-region: drag se puede usar para marcar regiones arrastrables. Se puede usar no-drag para inhabilitar este estilo en los elementos anidados.

    El uso de FrameOptions es nuevo en M36.

  • oculto

    booleano opcional

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

  • ícono

    string opcional

    Chrome 54 y versiones posteriores

    Es la URL del ícono de la ventana. Una ventana puede tener su propio ícono cuando showInShelf se establece como verdadero. La URL debe ser global o 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 se abra una ventana con el mismo ID más adelante. Si se crea una ventana con un ID determinado mientras ya existe otra ventana con el mismo ID, se enfocará la ventana abierta actualmente en lugar de crear una nueva.

  • innerBounds

    BoundsSpecification opcional

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

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

    Esta propiedad es nueva en Chrome 36.

  • maxHeight

    number opcional

    Obsoleto

    Usa innerBounds o outerBounds.

    Es la altura máxima de la ventana.

  • maxWidth

    number opcional

    Obsoleto

    Usa innerBounds o outerBounds.

    Es el ancho máximo de la ventana.

  • minHeight

    number opcional

    Obsoleto

    Usa innerBounds o outerBounds.

    Es la altura mínima de la ventana.

  • minWidth

    number opcional

    Obsoleto

    Usa innerBounds o outerBounds.

    Es el 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 de la ventana, como la barra de título y el marco). Si también se especifica un id y ya se mostró una ventana con un id coincidente, se usarán los límites recordados.

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

    Esta propiedad es nueva en Chrome 36.

  • resizable

    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 es verdadero, la ventana tendrá su propio ícono de la barra lateral. De lo contrario, la ventana se agrupará en la biblioteca con otras ventanas asociadas a la app. El valor predeterminado es falso. Si showInShelf se establece como verdadero, 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, esta solo se creará si no existe otra ventana con el mismo ID. Si ya existe una ventana con el mismo ID, se activará esa ventana. Si quieres crear varias ventanas con el mismo ID, puedes establecer esta propiedad como falsa.

  • state

    State opcional

    Es 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 el tipo de ventana "shell"

    Es el tipo de ventana que se creará.

  • visibleOnAllWorkspaces

    booleano opcional

    Si es verdadero y la plataforma lo admite, la ventana será visible en todos los espacios de trabajo.

FrameOptions

Propiedades

  • activeColor

    string opcional

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

    El color del marco solo está disponible si el tipo de marco es chrome.

    La coloración de marcos es una función nueva de Chrome 36.

  • color

    string opcional

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

    El coloreado de marcos es una función nueva de Chrome 36.

  • inactiveColor

    string opcional

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

    inactiveColor se debe usar junto con color.

    El coloreado de marcos es una función nueva de Chrome 36.

  • tipo

    string opcional

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

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

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

State

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

Enum

"normal"

"fullscreen"

"maximized"

"minimized"

WindowType

Chrome 45 y versiones posteriores

Especifica el tipo de ventana que se creará.

Enum

"shell"
Tipo de ventana predeterminado.

"panel"
Ventana administrada por el SO (obsoleta).

Métodos

canSetVisibleOnAllWorkspaces()

chrome.app.window.canSetVisibleOnAllWorkspaces(): boolean

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

Muestra

  • booleano

create()

Promise 
chrome.app.window.create(
  url: string,
  options?: CreateWindowOptions,
  callback?: function,
): Promise<AppWindow>

El tamaño y la posición de una ventana se pueden especificar de varias maneras diferentes. La opción más sencilla es no especificar nada, en cuyo caso se usarán un tamaño predeterminado y una posición que dependerá 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 las decoraciones de la ventana. Los límites exteriores 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, establecer la misma propiedad para los límites internos y externos se considera un error (por ejemplo, establecer 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 mueve o se cambia de tamaño. Luego, se usan este tamaño y esta posición en lugar de los límites especificados cuando se vuelve a abrir una ventana con el mismo ID. Si necesitas abrir una ventana con un ID en una ubicación que no sea la predeterminada, puedes crearla oculta, 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 se admiten en Manifest V3 y versiones posteriores. Otras plataformas deben usar devoluciones de llamada.

current()

chrome.app.window.current(): AppWindow | undefined

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

Muestra

get()

chrome.app.window.get(
  id: string,
): AppWindow | undefined

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

Parámetros

  • id

    string

Muestra

getAll()

chrome.app.window.getAll(): AppWindow[]

Obtiene un array de todas las ventanas de la app 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 esto se debe escuchar desde una ventana que no sea la que se está cerrando, por ejemplo, desde la página en segundo plano. Esto se debe a que la ventana que se cierra estará en proceso de destrucción cuando se active el evento, lo que significa que no todas las APIs en el contexto de la secuencia de comandos de la ventana serán funcionales.

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 se muestra en pantalla completa (ya sea a través de 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 se minimiza la ventana.

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 después de haberla minimizado o maximizado.

Parámetros

  • callback

    función

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

    () => void