Opis
Do tworzenia okien używaj interfejsu API chrome.app.window
. Windows ma opcjonalną ramkę z paskiem tytułu i elementami sterującymi rozmiaru. Nie są one powiązane z żadnymi oknami przeglądarki Chrome. Przykład znajdziesz w przykładzie stanu okna.
Typy
AppWindow
Właściwości
-
contentWindow
Okno
Obiekt JavaScript „window” dla utworzonego elementu podrzędnego.
-
id
string,
Identyfikator, za pomocą którego utworzono okno.
-
innerBounds
Położenie, rozmiar i ograniczenia zawartości okna, które nie obejmują dekoracji okien. Ta usługa jest nowa w Chrome 36.
-
outerBounds
Położenie, rozmiar i ograniczenia okna, w tym jego dekoracje, takie jak pasek tytułu i ramka. Ta usługa jest nowa w Chrome 36.
-
clearAttention
void
Ukierunkuj uwagę na okno.
Funkcja
clearAttention
wygląda tak:() => {...}
-
zamknij
void
Zamknij okno.
Funkcja
close
wygląda tak:() => {...}
-
drawAttention
void
Przyciągnij uwagę do okna.
Funkcja
drawAttention
wygląda tak:() => {...}
-
ostrość
void
Zaznacz okno.
Funkcja
focus
wygląda tak:() => {...}
-
pełny ekran
void
Wyświetla okno na pełnym ekranie.
Użytkownik będzie mógł przywrócić okno, naciskając Esc. Aplikacja może zapobiec zamknięciu stanu pełnego ekranu po naciśnięciu klawisza ESC. W tym celu zażądaj uprawnienia
app.window.fullscreen.overrideEsc
i anuluj zdarzenie, wywołując metodę .preventDefault() w modułach obsługi keydown i keyup w ten sposób:window.onkeydown = window.onkeyup = function(e) { if (e.keyCode == 27 /* ESC *\/) { e.preventDefault(); } };
Uwaga:
window.fullscreen()
powoduje, że całe okno staje się pełnoekranowe. Nie wymaga gestu użytkownika. Do włączania trybu pełnoekranowego można też używać pełnoekranowego interfejsu API HTML5 (więcej informacji znajdziesz w artykule Internetowe interfejsy API).Funkcja
fullscreen
wygląda tak:() => {...}
-
getBounds
void
WycofanoUżyj atrybutów innerBounds (wewnętrzne) lub outerBounds (outerBounds)
Pobierz wewnętrzne granice okna jako obiekt
ContentBounds
.Funkcja
getBounds
wygląda tak:() => {...}
-
returns
-
-
ukryj
void
Ukryj okno. Nic nie ma, jeśli okno jest już ukryte.
Funkcja
hide
wygląda tak:() => {...}
-
isAlwaysOnTop
void
Czy okno zawsze znajduje się na górze?
Funkcja
isAlwaysOnTop
wygląda tak:() => {...}
-
returns
boolean
-
-
isFullscreen
void
Czy okno jest wyświetlane na pełnym ekranie? Dzieje się tak, jeśli okno zostało utworzone na pełnym ekranie lub przełączone na pełny ekran za pomocą pełnoekranowego interfejsu API
AppWindow
lub HTML5.Funkcja
isFullscreen
wygląda tak:() => {...}
-
returns
boolean
-
-
isMaximized
void
Czy okno jest zmaksymalizowane?
Funkcja
isMaximized
wygląda tak:() => {...}
-
returns
boolean
-
-
isMinimized
void
Czy okno jest zminimalizowane?
Funkcja
isMinimized
wygląda tak:() => {...}
-
returns
boolean
-
-
maksymalizuj
void
Zmaksymalizuj okno.
Funkcja
maximize
wygląda tak:() => {...}
-
minimalizuj
void
Zminimalizuj okno.
Funkcja
minimize
wygląda tak:() => {...}
-
moveTo
void
Wycofane od Chrome 43Użyj obiektu outerBounds.
Przesuń okno w wybrane miejsce (
left
,top
).Funkcja
moveTo
wygląda tak:(left: number, top: number) => {...}
-
lewa
Liczba
-
góra
Liczba
-
-
resizeTo
void
Wycofane od Chrome 43Użyj obiektu outerBounds.
Zmień rozmiar okna na
width
xheight
pikseli.Funkcja
resizeTo
wygląda tak:(width: number, height: number) => {...}
-
szerokość
Liczba
-
wysokość
Liczba
-
-
przywróć
void
Przywróć okno, wychodząc ze stanu zmaksymalizowanego, zminimalizowanego lub pełnego ekranu.
Funkcja
restore
wygląda tak:() => {...}
-
setAlwaysOnTop
void
Określ, czy okno powinno znajdować się nad większością innych okien. Wymaga uprawnienia
alwaysOnTopWindows
.Funkcja
setAlwaysOnTop
wygląda tak:(alwaysOnTop: boolean) => {...}
-
alwaysOnTop
boolean
-
-
setBounds
void
WycofanoUżyj atrybutów innerBounds (wewnętrzne) lub outerBounds (outerBounds)
Ustaw wewnętrzne granice okna.
Funkcja
setBounds
wygląda tak:(bounds: ContentBounds) => {...}
-
granica
-
-
setVisibleOnAllWorkspaces
void
Określ, czy okno ma być widoczne we wszystkich obszarach roboczych. (Tylko w przypadku platform, które to obsługują).
Funkcja
setVisibleOnAllWorkspaces
wygląda tak:(alwaysVisible: boolean) => {...}
-
alwaysVisible
boolean
-
-
pokaż
void
Pokaż okno. Nic nie dzieje się, gdy okno jest już widoczne. Zaznacz okno, jeśli zasada
focused
ma wartość Prawda lub jest pomijana.Funkcja
show
wygląda tak:(focused?: boolean) => {...}
-
skupione
wartość logiczna opcjonalna
-
Bounds
Właściwości
-
wysokość
Liczba
Ta właściwość może służyć do odczytywania i zapisywania bieżącej wysokości zawartości lub okna.
-
lewa
Liczba
Ta właściwość może służyć do odczytywania lub zapisywania bieżącej współrzędnych X treści lub okna.
-
maxHeight
Liczba opcjonalnie
Ta właściwość może służyć do odczytywania lub zapisywania bieżącej maksymalnej wysokości zawartości lub okna. Wartość
null
oznacza „nieokreślony”. -
maxWidth
Liczba opcjonalnie
Ta właściwość może służyć do odczytywania i zapisywania bieżącej maksymalnej szerokości treści lub okna. Wartość
null
oznacza „nieokreślony”. -
minHeight
Liczba opcjonalnie
Tej właściwości można używać do odczytu lub zapisu bieżącej minimalnej wysokości zawartości lub okna. Wartość
null
oznacza „nieokreślony”. -
minWidth
Liczba opcjonalnie
Ta właściwość może służyć do odczytywania lub zapisywania bieżącej minimalnej szerokości zawartości lub okna. Wartość
null
oznacza „nieokreślony”. -
góra
Liczba
Ta właściwość może służyć do odczytywania lub zapisywania bieżącej współrzędnej Y treści bądź okna.
-
szerokość
Liczba
Ta właściwość może służyć do odczytywania i zapisywania bieżącej szerokości treści lub okna.
-
setMaximumSize
void
Ustaw ograniczenia maksymalnego rozmiaru treści lub okna. Aby usunąć ograniczenie, maksymalna szerokość lub wysokość może wynosić
null
. Wartośćundefined
pozostawia ograniczenie bez zmian.Funkcja
setMaximumSize
wygląda tak:(maxWidth: number, maxHeight: number) => {...}
-
maxWidth
Liczba
-
maxHeight
Liczba
-
-
setMinimumSize
void
Ustaw ograniczenia dotyczące minimalnego rozmiaru treści lub okna. Aby usunąć ograniczenie, można ustawić minimalną szerokość lub wysokość na
null
. Wartośćundefined
pozostawia ograniczenie bez zmian.Funkcja
setMinimumSize
wygląda tak:(minWidth: number, minHeight: number) => {...}
-
minWidth
Liczba
-
minHeight
Liczba
-
-
setPosition
void
Ustaw lewą i górną pozycję zawartości lub okna.
Funkcja
setPosition
wygląda tak:(left: number, top: number) => {...}
-
lewa
Liczba
-
góra
Liczba
-
-
setSize
void
Ustaw szerokość i wysokość zawartości lub okna.
Funkcja
setSize
wygląda tak:(width: number, height: number) => {...}
-
szerokość
Liczba
-
wysokość
Liczba
-
BoundsSpecification
Właściwości
-
wysokość
Liczba opcjonalnie
Wysokość treści lub okna.
-
lewa
Liczba opcjonalnie
Współrzędna X treści lub okna.
-
maxHeight
Liczba opcjonalnie
Maksymalna wysokość treści lub okna.
-
maxWidth
Liczba opcjonalnie
Maksymalna szerokość treści lub okna.
-
minHeight
Liczba opcjonalnie
Minimalna wysokość treści lub okna.
-
minWidth
Liczba opcjonalnie
Minimalna szerokość treści lub okna.
-
góra
Liczba opcjonalnie
Współrzędna Y treści lub okna.
-
szerokość
Liczba opcjonalnie
Szerokość treści lub okna.
ContentBounds
Właściwości
-
wysokość
Liczba opcjonalnie
-
lewa
Liczba opcjonalnie
-
góra
Liczba opcjonalnie
-
szerokość
Liczba opcjonalnie
CreateWindowOptions
Właściwości
-
alwaysOnTop
wartość logiczna opcjonalna
Jeśli ma wartość prawda, okno pozostanie nad większością innych okien. Jeśli takich okien jest wiele, aktualnie aktywne okno będzie widoczne na pierwszym planie. Wymaga uprawnienia
alwaysOnTopWindows
. Wartość domyślna to fałsz.Wywołaj
setAlwaysOnTop()
w oknie, aby zmienić tę właściwość po utworzeniu. -
granica
ContentBounds – opcjonalny
WycofanoUżyj atrybutów innerBounds (wewnętrzne) lub outerBounds (outerBounds)
Rozmiar i położenie treści w oknie (z wyłączeniem paska tytułu). Jeśli podany jest także identyfikator, a okno o pasującym identyfikatorze zostało już wyświetlone, zostaną użyte zapamiętane granice okna.
-
skupione
wartość logiczna opcjonalna
Jeśli ma wartość prawda, okno będzie aktywne po utworzeniu. Wartość domyślna to true.
-
ramka
string | FrameOptions opcjonalnie
Typ ramki:
none
lubchrome
(wartość domyślna tochrome
). W przypadku elementunone
za pomocą właściwości CSS-webkit-app-region
można zastosować przeciąganie do okna aplikacji.-webkit-app-region: drag
służy do oznaczania regionów, które można przeciągać. Za pomocąno-drag
możesz wyłączyć ten styl w elementach zagnieżdżonych.Korzystanie z usługi
FrameOptions
jest nowością w wersji M36. -
wartość logiczna opcjonalna
Jeśli ma wartość true, okno zostanie utworzone w stanie ukrytym. Wywołaj polecenie show() w oknie, aby wyświetlić je po utworzeniu. Wartość domyślna to fałsz.
-
ikona
ciąg znaków opcjonalny
Chrome w wersji 54 i nowszychAdres URL ikony okna. Okno może mieć własną ikonę, gdy zasada showInShelf ma wartość Prawda. Adres URL powinien być globalnym lub lokalnym adresem URL z rozszerzeniem.
-
id
ciąg znaków opcjonalny
Identyfikator okna. Służy ona do zapamiętania rozmiaru i położenia okna oraz przywrócenia tej geometrii, gdy okno o tym samym identyfikatorze zostanie później otwarte. Jeśli okno o danym identyfikatorze zostanie utworzone, gdy istnieje już inne okno o tym samym identyfikatorze, aktualnie otwarte okno będzie aktywne, a nie nowe okno.
-
innerBounds
BoundsSpecification (opcjonalnie)
Służy do określania pozycji początkowej, początkowego rozmiaru i ograniczeń zawartości okna (z wyjątkiem dekoracji okien). Jeśli określono również
id
, a wcześniej zostało wyświetlone okno z pasującym wartościąid
, zamiast niego zostaną użyte zapamiętane progi.Pamiętaj, że dopełnienie między wewnętrzną a zewnętrzną granicą jest określane przez system operacyjny. Dlatego ustawienie tej samej właściwości granic zarówno w przypadku
innerBounds
, jak iouterBounds
spowoduje błąd.Ta usługa jest nowa w Chrome 36.
-
maxHeight
Liczba opcjonalnie
WycofanoUżyj atrybutów innerBounds (wewnętrzne) lub outerBounds (outerBounds)
Maksymalna wysokość okna.
-
maxWidth
Liczba opcjonalnie
WycofanoUżyj atrybutów innerBounds (wewnętrzne) lub outerBounds (outerBounds)
Maksymalna szerokość okna.
-
minHeight
Liczba opcjonalnie
WycofanoUżyj atrybutów innerBounds (wewnętrzne) lub outerBounds (outerBounds)
Minimalna wysokość okna.
-
minWidth
Liczba opcjonalnie
WycofanoUżyj atrybutów innerBounds (wewnętrzne) lub outerBounds (outerBounds)
Minimalna szerokość okna.
-
outerBounds
BoundsSpecification (opcjonalnie)
Służy do określania pozycji początkowej, początkowego rozmiaru i ograniczeń okna (w tym dekoracji okien, takich jak pasek tytułu i ramka). Jeśli określono również
id
, a wcześniej zostało wyświetlone okno z pasującym wartościąid
, zamiast niego zostaną użyte zapamiętane progi.Pamiętaj, że dopełnienie między wewnętrzną a zewnętrzną granicą jest określane przez system operacyjny. Dlatego ustawienie tej samej właściwości granic zarówno w przypadku
innerBounds
, jak iouterBounds
spowoduje błąd.Ta usługa jest nowa w Chrome 36.
-
resizable
wartość logiczna opcjonalna
Jeśli ma wartość true, użytkownik może zmieniać rozmiar okna. Wartość domyślna to true.
-
showInShelf
wartość logiczna opcjonalna
Chrome w wersji 54 i nowszychJeśli ma wartość true (prawda), okno będzie miało własną ikonę półki. W przeciwnym razie okno zostanie zgrupowane na półce z innymi oknami powiązanymi z aplikacją. Wartość domyślna to fałsz. Jeśli parametr showInShelf ma wartość Prawda, musisz określić identyfikator okna.
-
singleton
wartość logiczna opcjonalna
WycofanoNie można już korzystać z wielu okien o tym samym identyfikatorze.
Domyślnie, jeśli określisz identyfikator okna, zostanie ono utworzone tylko wtedy, gdy nie istnieje jeszcze inne okno o tym samym identyfikatorze. Jeśli istnieje już okno o tym samym identyfikatorze, zostanie ono aktywowane. Jeśli chcesz utworzyć wiele okien o tym samym identyfikatorze, możesz ustawić tę właściwość na false.
-
state
Stan opcjonalny
Początkowy stan okna, który pozwala na tworzenie go w trybie pełnoekranowym, zmaksymalizowanym lub zminimalizowanym. Wartość domyślna to „normalny”.
-
Niestandardowy typ treści
WindowType opcjonalnie
Chrome 45 i nowszy Wycofane od Chrome 69Wszystkie okna aplikacji używają typu okna „powłoka”
Typ okna do utworzenia.
-
visibleOnAllWorkspaces
wartość logiczna opcjonalna
Jeśli ma wartość prawda i jest obsługiwana przez platformę, okno będzie widoczne we wszystkich obszarach roboczych.
FrameOptions
Właściwości
-
activeColor
ciąg znaków opcjonalny
Pozwala ustawić kolor ramki okna, gdy jest ono aktywne. Kolory ramki są dostępne tylko wtedy, gdy typ ramki to
chrome
.Kolory ramki są dostępne tylko wtedy, gdy typ ramki to
chrome
.Kolory ramek to nowość w Chrome 36.
-
kolor
ciąg znaków opcjonalny
Umożliwia ustawienie koloru ramki. Kolory ramki są dostępne tylko wtedy, gdy typ ramki to
chrome
.Kolory ramek to nowość w Chrome 36.
-
inactiveColor
ciąg znaków opcjonalny
Pozwala na zmianę koloru ramki okna, gdy jest nieaktywne, na inny kolor niż aktywny. Kolory ramki są dostępne tylko wtedy, gdy typ ramki to
chrome
.Typu
inactiveColor
należy używać w połączeniu zcolor
.Kolory ramek to nowość w Chrome 36.
-
Niestandardowy typ treści
ciąg znaków opcjonalny
Typ ramki:
none
lubchrome
(wartość domyślna tochrome
).W przypadku
none
można użyć właściwości CSS-webkit-app-region
, aby zastosować przeciąganie do okna aplikacji.-webkit-app-region: drag
służy do oznaczania regionów, które można przeciągać. Za pomocąno-drag
możesz wyłączyć ten styl w elementach zagnieżdżonych.
State
Stan okna: normalny, pełnoekranowy, zmaksymalizowany, zminimalizowany.
Typ wyliczeniowy
WindowType
Określa typ okna do utworzenia.
Typ wyliczeniowy
"shell"
Domyślny typ okna.
"panel"
Okno zarządzane przez system operacyjny (wycofane).
Metody
canSetVisibleOnAllWorkspaces()
chrome.app.window.canSetVisibleOnAllWorkspaces()
Określa, czy bieżąca platforma obsługuje okna widoczne we wszystkich obszarach roboczych.
Zwroty
-
boolean
create()
chrome.app.window.create(
url: string,
options?: CreateWindowOptions,
callback?: function,
)
Rozmiar i położenie okna można określić na wiele różnych sposobów. Najprostszym sposobem jest nieokreślanie niczego. W takim przypadku używany jest rozmiar domyślny i położenie zależne od platformy.
Aby ustawić pozycję, rozmiar i ograniczenia okna, użyj właściwości innerBounds
lub outerBounds
. Granice wewnętrzne nie obejmują dekoracji okien. Granice zewnętrzne obejmują pasek tytułu i ramkę okna. Pamiętaj, że dopełnienie między wewnętrzną a zewnętrzną granicą jest określane przez system operacyjny. Dlatego ustawienie tej samej właściwości zarówno dla granic wewnętrznych, jak i zewnętrznych jest uznawane za błąd (np. ustawienie zarówno innerBounds.left
, jak i outerBounds.left
).
Aby automatycznie zapamiętywać położenie okien, możesz nadać im identyfikatory. Jeśli okno ma identyfikator, identyfikator ten służy do zapamiętywania rozmiaru i położenia okna przy jego przenoszeniu lub zmianie rozmiaru. Te rozmiary i pozycje są używane zamiast określonych granic przy kolejnym otwarciu okna o tym samym identyfikatorze. Jeśli chcesz otworzyć okno z identyfikatorem w innej lokalizacji niż zapamiętana domyślna, możesz je ukryć, przenieść w wybrane miejsce, a następnie je wyświetlić.
Parametry
-
URL
string,
-
Opcje
Opcjonalnie CreateWindowOptions
-
wywołanie zwrotne
funkcja opcjonalnie
Parametr
callback
wygląda tak:(createdWindow: AppWindow) => void
-
createdWindow
-
Zwroty
-
Promise<AppWindow>
Chrome 117 i nowsze wersjeObietnice są obsługiwane tylko w przypadku platformy Manifest V3 i nowszych platform. Inne platformy muszą używać wywołań zwrotnych.
current()
chrome.app.window.current()
Zwraca obiekt AppWindow
dla bieżącego kontekstu skryptu (np. obiekt „window” w języku JavaScript). Można ją też wywołać w uchwycie kontekstu skryptu dla innej strony, np. otherWindow.chrome.app.window.current().
Zwroty
-
AppWindow | undefined
get()
chrome.app.window.get(
id: string,
)
Pobiera element AppWindow
o podanym identyfikatorze. Jeśli nie ma okna o podanym identyfikatorze, zwracana jest wartość null. Jest to nowość w Chrome 33.
Parametry
-
id
string,
Zwroty
-
AppWindow | undefined
getAll()
chrome.app.window.getAll()
Pobiera tablicę wszystkich aktualnie utworzonych okien aplikacji. Jest to nowość w Chrome 33.
Zwroty
Wydarzenia
onBoundsChanged
chrome.app.window.onBoundsChanged.addListener(
callback: function,
)
Uruchamiane po zmianie rozmiaru okna.
Parametry
-
wywołanie zwrotne
funkcja
Parametr
callback
wygląda tak:() => void
onClosed
chrome.app.window.onClosed.addListener(
callback: function,
)
Uruchamiane, gdy okno jest zamknięte. Pamiętaj, że tę informację należy odsłuchać z innego okna niż zamykane, na przykład ze strony w tle. Dzieje się tak, ponieważ zamykane okno jest w trakcie usuwania po uruchomieniu zdarzenia, co oznacza, że nie wszystkie interfejsy API w kontekście skryptu w oknie będą działać.
Parametry
-
wywołanie zwrotne
funkcja
Parametr
callback
wygląda tak:() => void
onFullscreened
chrome.app.window.onFullscreened.addListener(
callback: function,
)
Uruchamiane, gdy okno wyświetli się na pełnym ekranie (przez interfejs API AppWindow
lub HTML5).
Parametry
-
wywołanie zwrotne
funkcja
Parametr
callback
wygląda tak:() => void
onMaximized
chrome.app.window.onMaximized.addListener(
callback: function,
)
Uruchamiane, gdy okno jest zmaksymalizowane.
Parametry
-
wywołanie zwrotne
funkcja
Parametr
callback
wygląda tak:() => void
onMinimized
chrome.app.window.onMinimized.addListener(
callback: function,
)
Uruchamiane, gdy okno jest zminimalizowane.
Parametry
-
wywołanie zwrotne
funkcja
Parametr
callback
wygląda tak:() => void
onRestored
chrome.app.window.onRestored.addListener(
callback: function,
)
Uruchamiane, gdy okno zostało przywrócone po zminimalizowaniu lub zmaksymalizowaniu.
Parametry
-
wywołanie zwrotne
funkcja
Parametr
callback
wygląda tak:() => void