JavaScript köprü API'si

Pencere

Tam ekran, pencere içinde pencere, sistem çubuğu renkleri, ekran görüntüsü engelleme, derlemede kopyalama korumasının açık olup olmadığı (AppMint.copyProtection), açılış ekranı ve bir pencereyi kapatma.

`AppMint.copyProtection` yardımcı#

AppMint.copyProtection

Örnek

true uygulama Kopyalama koruması açık derlendiğinde; aksi halde yoktur (undefined). Salt okunur - bir sayfa korumayı açıp kapatamaz, yalnızca açık olup olmadığını sorabilir.

Döndürür: true, veya koruma kapalıyken (ve tarayıcıda) undefined. Gerekli: derleme yaparken Adım 3'te (Entegrasyon) Görüntü Seçenekleri altında Kopyalama koruması açık. Varsayılan kapalı.

Koruma açıkken uygulamanın metni seçilemez, kopyalanamaz veya kesilemez; düzenlenebilir alanlar dışında kopyalama / kesme, contextmenu olayı ve Ctrl/Cmd + C, X ve A iptal edilir; uzun basma menüsü de çıkmaz. Girişler, metin alanları, seçim kutuları ve contenteditable bölgeleri tamamen düzenlenebilir kalır, böylece formlar çalışmaya devam eder.

Koruma açıkken kendi "Kopyala" düğmelerinizi gizleyin - hiçbir şey kopyalamaz ve bozuk görünürler:

const protectedApp = !!(window.AppMint && window.AppMint.copyProtection === true);

document.querySelectorAll('[data-copy-button]').forEach((btn) => {
  btn.hidden = protectedApp;
});

Ya da bir ipucunun ifadesini başlangıçta bir kez seçin:

const hint = document.getElementById('share-hint');
hint.textContent = (window.AppMint && window.AppMint.copyProtection === true)
  ? 'Tap Share to send this lesson to a friend.'
  : 'Select any text to copy it, or tap Share.';

Uygulamadan ayrılmaması gereken bir sayfa için bunu ekran görüntüsü kilidiyle birleştirin:

if (window.AppMint && AppMint.copyProtection === true && window.WebToApk && WebToApk.setSecureScreen) {
  WebToApk.setSecureScreen(true);                    // also blocks screenshots and recents thumbnails
  document.body.classList.add('protected');
}

Notlar: Bağlantılar ve görsellerdeki uzun basma menüsü (aç, kopyala, paylaş veya indir) aynı yerdeki ayrı bir derleme anahtarıdır: Bağlantılar ve görsellerde uzun basma menüsü. Varsayılan olarak kapalıdır, bu yüzden açmadıkça bir bağlantıya uzun basmak hiçbir şey yapmaz; kopyalama koruması onu her zaman kapalı tutar. Bir sayfa, contextmenu olayını iptal ederek (el.addEventListener('contextmenu', (e) => e.preventDefault())) menüyü tek bir öğede yine de reddedebilir. Koruma uygulama içinde kopyalamayı durdurur; ekran görüntüsünü durdurmaz - bunun için bkz. WebToApk.setSecureScreen(true).

`navigator.wakeLock` web standardı#

navigator.wakeLock.request('screen')

Örnek

Standart Ekran Uyanık Tutma API'si: bir tarif, bir harita, bir biniş kartı veya bir antrenman zamanlayıcısı ekrandayken ekranın kararmasını önler.

Döndürür: bir WakeLockSentinel {type:'screen', released, release(), onrelease} değerli Promise. Sayfa görünür değilse NotAllowedError ile reddedilir. Gerekli: açılacak bir şey yok, izin yok.

let wakeLock = null;

async function startCooking() {
  try {
    wakeLock = await navigator.wakeLock.request('screen');
    wakeLock.addEventListener('release', () => { wakeLock = null; });
  } catch (e) {
    console.log('Screen may dim:', e.name);
  }
}

async function stopCooking() {
  if (wakeLock) await wakeLock.release();
}

// The lock is dropped when the app goes to the background — take it again on return.
document.addEventListener('visibilitychange', () => {
  if (document.visibilityState === 'visible' && cookingModeOn && !wakeLock) startCooking();
});

Ekranı yalnızca antrenman zamanlayıcısı çalışırken açık tutun ve bitince bırakın:

let lock = null;

async function startTimer(seconds) {
  if ('wakeLock' in navigator) {
    try { lock = await navigator.wakeLock.request('screen'); } catch (e) { lock = null; }
  }
  runCountdown(seconds, async () => {        // your timer; the callback runs at 0
    if (lock && !lock.released) await lock.release();
    lock = null;
    showDone();
  });
}

Kilit kaybolduğunda (örneğin uygulama arka plana gittiğinde) kendiliğinden işaretini kaldıran bir "Ekranı açık tut" anahtarı:

const box = document.getElementById('keep-on');
let sentinel = null;

box.hidden = !('wakeLock' in navigator);
box.addEventListener('change', async () => {
  if (box.checked) {
    try {
      sentinel = await navigator.wakeLock.request('screen');
      sentinel.onrelease = () => { box.checked = false; sentinel = null; };
    } catch (e) {
      box.checked = false;                     // NotAllowedError: page not visible
    }
  } else if (sentinel) {
    await sentinel.release();
  }
});

Notlar: spesifikasyonun dediği gibi, sayfa gizlendiğinde (uygulama arka plana gittiğinde veya başka yere gittiğinde) her kilit bırakılır; her sentinel'in release olayı tetiklenir. Aynı anda birden fazla sentinel tutulabilir - ekran sonuncusu bırakılana kadar açık kalır. Yapay zekayla oluşturulan uygulamalar @/lib/appmintNative içinden keepAwake(true/false) kullanır. Arkasındaki olay: appmint:wakelock-lost.

`screen.orientation` web standardı#

screen.orientation.lock(type) / unlock()

Örnek

Düz bir WebView'ın reddettiği standart Ekran Yönelimi kilidi: uygulamayı bir video veya oyun için yatay çevirir ve geri döndürür.

Döndürür: lock(type) → yönelim istendiğinde tamamlanan bir Promise; bilinmeyen tür için TypeError ile, Android TV'de NotSupportedError ile reddedilir. unlock() uygulamayı derlendiği yönelime döndürür. Gerekli: hiçbir şey.

const player = document.getElementById('player');

document.getElementById('fullscreen').addEventListener('click', async () => {
  try {
    await screen.orientation.lock('landscape');       // either landscape, follows the sensor
  } catch (e) {
    console.log('Could not rotate:', e.name);
  }
  player.classList.add('wide');
});

document.getElementById('done').addEventListener('click', () => {
  screen.orientation.unlock();
  player.classList.remove('wide');
});

screen.orientation.addEventListener('change', () => console.log(screen.orientation.type));

Bir oyun başladığında yatay çevirin; Android TV'de ekran zaten yataydır, bu yüzden devam edin:

async function startGame() {
  try {
    await screen.orientation.lock('landscape');
  } catch (e) {
    if (e.name !== 'NotSupportedError') console.log('Could not rotate:', e.name);
  }
  runGame();
}

function quitGame() {
  screen.orientation.unlock();   // back to the orientation the app was built with
  showMenu();
}

Oynatılan videonun biçimini izleyin ve bittiğinde geri dönün:

const video = document.getElementById('clip');

video.addEventListener('play', () => {
  const wide = video.videoWidth >= video.videoHeight;
  screen.orientation.lock(wide ? 'landscape' : 'portrait').catch((e) => console.log(e.name));
});

video.addEventListener('ended', () => screen.orientation.unlock());

Notlar: türler: any, natural, portrait, portrait-primary, portrait-secondary, landscape, landscape-primary, landscape-secondary. Chrome'dan farklı olarak sayfanın önce tam ekranda olması gerekmez. Yapay zekayla oluşturulan uygulamalar şunun lockOrientation() özelliğini kullanır: @/lib/appmintNative.

`window.close` web standardı#

window.close()

Örnek

Uygulamanın ana ekranını kapatır. Kabuk window.close() işlevini değiştirir; böylece sayfanızdaki bir "Kapat" veya "Çıkış" düğmesi uygulama içinde çalışır.

Döndürür: hiçbir şey. Gerekenler: hiçbir şey.

document.getElementById('exit-btn').onclick = function () {
  saveDraft();          // anything unsaved — the screen closes at once
  window.close();       // in the app: WebToApk.closeWindow(); in a browser: normal behaviour
};

Kullanıcının açtığı bir sekmede window.close() genellikle bir şey yapmadığı tarayıcıda düğmeyi gizleyin:

if (!window.WebToApk) document.getElementById('exit-btn').hidden = true;

Önce sorun, çünkü window.close() çalıştığı anda uygulama kapanır:

document.getElementById('quit').addEventListener('click', function () {
  if (hasUnsavedChanges() && !confirm('You have unsaved changes. Close the app anyway?')) {
    return;
  }
  window.close();
});

Notlar: Yerine koyma, her sayfa yüklemesi bittikten sonra kurulur; bu yüzden sayfanın ilk betik çalışması sırasındaki bir çağrı WebView'ın kendi window.close() işlevini kullanır (bu hiçbir şey yapmaz). Bu yolda çıkış onayı yoktur. window.close() çağıran bir oturum açma pop-up'ı ayrıca ele alınır: uygulamayı değil pop-up'ı kapatır.

`__lockOrientation` köprü#

window.WebToApk.__lockOrientation(type: String): String

screen.orientation.lock(type): "ok", OrientationLockType olmayan bir metin için "type", ya da "unsupported" (Android TV her zaman yataydır).

Örnek

screen.orientation.lock(type) arkasındaki dahili aktarım. Sayfalar standart API'yi kullanır; bunu asla doğrudan çağırmayın - __ yöntemleri haber verilmeden değişebilir.

Döndürür: 'ok', bir yönelim kilit türü olmayan metin için 'type', ya da 'unsupported' (Android TV). Gerekli: açılacak bir şey yok.

Genel API'yi kullanın:

document.getElementById('play').addEventListener('click', async () => {
  try { await screen.orientation.lock('landscape'); } catch (e) { /* NotSupportedError on TV */ }
});
document.getElementById('exit').addEventListener('click', () => screen.orientation.unlock());

Hatalı bir kilit türünü, dönemeyen bir cihazdan ayırt edin:

async function lockTo(type) {
  if (!screen.orientation || typeof screen.orientation.lock !== 'function') return 'unsupported';
  try {
    await screen.orientation.lock(type);
    return 'ok';
  } catch (e) {
    if (e instanceof TypeError) return 'bad-type';   // not an OrientationLockType string
    return 'unsupported';                            // NotSupportedError (Android TV)
  }
}

lockTo('portrait-primary').then((r) => console.log('orientation lock:', r));

Kullanıcı imza atarken ekranı tuttuğu şekilde dondurun, sonra döndürmeyi geri verin:

async function startSigning() {
  const current = screen.orientation.type;   // e.g. 'landscape-primary'
  try { await screen.orientation.lock(current); } catch (e) { /* keep going unlocked */ }
  showSignaturePad();
}

function finishSigning() {
  hideSignaturePad();
  screen.orientation.unlock();
}

Notlar: Uygulama kabuğunda uygulanmıştır (WebApiPolyfills.kt). Aynı sayfa kodu Chrome'da da değişmeden çalışır.

`__unlockOrientation` köprü#

window.WebToApk.__unlockOrientation()

screen.orientation.unlock(): oluşturucunun derlediği yönelime geri döner.

Örnek

screen.orientation.unlock() arkasındaki dahili aktarım. Sayfalar standart API'yi kullanır; bunu asla doğrudan çağırmayın - __ yöntemleri haber verilmeden değişebilir.

Döndürür: hiçbir şey; uygulama derleme sırasında seçilen yönelime döner. Gerekli: açılacak bir şey yok.

Genel API'yi kullanın:

document.getElementById('play').addEventListener('click', async () => {
  try { await screen.orientation.lock('landscape'); } catch (e) { /* NotSupportedError on TV */ }
});
document.getElementById('exit').addEventListener('click', () => screen.orientation.unlock());

Yalnızca oyun rotası yataydır; diğer her rota uygulamanın kendi yönelimine döner:

function onRouteChange(path) {
  if (path.startsWith('/play')) {
    screen.orientation.lock('landscape').catch(() => {});
  } else if (screen.orientation && typeof screen.orientation.unlock === 'function') {
    screen.orientation.unlock();       // menus, settings and the store
  }
}

window.addEventListener('popstate', () => onRouteChange(location.pathname));
onRouteChange(location.pathname);

Karşılama slaytlarını dik tutun, bitince kilidi açın:

async function showOnboarding() {
  try { await screen.orientation.lock('portrait'); } catch (e) { /* TV: no lock */ }
  await runOnboardingSlides();         // your own flow
  screen.orientation.unlock();         // back to the orientation the app was built with
}

Notlar: Uygulama kabuğunda uygulanmıştır (WebApiPolyfills.kt). Aynı sayfa kodu Chrome'da da değişmeden çalışır.

`__wakeLock` köprü#

window.WebToApk.__wakeLock(docId: String, held: Boolean): Boolean

Ekran Uyanık Tutma Kilidi: [held] true ise [docId] belgesi bir sentinel tuttuğu sürece ekranı açık tutar. Kilit alınamadıysa false döndürür.

Örnek

navigator.wakeLock.request('screen') ve WakeLockSentinel.release() arkasındaki dahili aktarım. Sayfalar standart API'yi kullanır; bunu asla doğrudan çağırmayın - __ yöntemleri haber verilmeden değişebilir.

Döndürür: ekranı açık tutma bayrağı o belge için uygulandığında true. Gerekli: açılacak bir şey yok.

Genel API'yi kullanın:

let lock = null;
async function keepScreenOn() {
  if (!('wakeLock' in navigator)) return;
  lock = await navigator.wakeLock.request('screen');
  lock.addEventListener('release', () => { lock = null; });
}

Kullanıcı arka planda bir dakikadan fazla kaldıktan sonra uygulamaya döndüğünde kilidi yeniden alın; çünkü arka planda her kilit bırakılır:

let lock = null;
let wantLock = false;

async function acquire() {
  if (!('wakeLock' in navigator)) return;
  try {
    lock = await navigator.wakeLock.request('screen');
    lock.addEventListener('release', () => { lock = null; });
  } catch (e) {
    lock = null;                       // NotAllowedError: the page was not visible
  }
}

function startRecipeMode() { wantLock = true; acquire(); }
function stopRecipeMode()  { wantLock = false; if (lock) lock.release(); }

document.addEventListener('visibilitychange', () => {
  if (wantLock && !lock && document.visibilityState === 'visible') acquire();
});

Ekranı yalnızca antrenman zamanlayıcısı çalışırken açık tutun ve zamanlayıcı bitince yeniden uyumasına izin verin:

async function runTimer(seconds) {
  const lock = ('wakeLock' in navigator)
    ? await navigator.wakeLock.request('screen').catch(() => null)
    : null;
  try {
    for (let left = seconds; left > 0; left--) {
      showRemaining(left);
      await new Promise((r) => setTimeout(r, 1000));
    }
  } finally {
    if (lock && !lock.released) await lock.release();
  }
}

Notlar: Uygulama arka plana gittiğinde tüm kilitleri bırakır ve sentinel'leri serbest bırakan appmint:wakelock-lost olayını tetikler (release olayları tetiklenir).

`closeWindow` köprü#

window.WebToApk.closeWindow()

Promise sarmalayıcısını kullanın: const r = await AppMint.requestReview(); // {result, openedStore} const r = await AppMint.requestReview({ openStore: true }); // sayfa yoksa mağaza sayfası r.result: 'shown' | 'not_from_play' | 'quota' | 'error'. Bkz. RatePrompt.

Tek başına değil, grubu olan Google Play'in uygulama içi değerlendirme sayfası altında açıklanmıştır.

Örnek

Uygulamanın ana ekranını kapatır (son sayfada Geri'ye basmakla aynı). Sayfalar normalde kabuğun buraya yönlendirdiği standart window.close() işlevini çağırır.

Döndürür: hiçbir şey. Gerekenler: hiçbir şey.

document.getElementById('quit').onclick = function () {
  if (confirm('Close the app?')) window.close();   // in the app: the screen closes
};

Ham çağrı aynı şeyi yapar:

if (window.WebToApk && typeof window.WebToApk.closeWindow === 'function') {
  window.WebToApk.closeWindow();
}

Önce kaydeden ve kapatılacak uygulama ekranı olmayan bir tarayıcıda gizlenen bir "Çıkış" düğmesi:

var exitBtn = document.getElementById('exit-btn');

if (!(window.WebToApk && typeof window.WebToApk.closeWindow === 'function')) {
  exitBtn.hidden = true;
} else {
  exitBtn.onclick = async function () {
    exitBtn.disabled = true;
    await saveDraft();                 // your own save; closing does not wait for anything
    window.WebToApk.closeWindow();
  };
}

Notlar: Uygulamanın ekranını hemen kapatır - derlemede olsa bile çıkış onayı yoktur. Önce kaydedilmemiş her şeyi kaydedin. Tarayıcıda window.close() yalnızca betiğin kendi açtığı bir sekmeyi kapatır.

`enterPip` köprü#

window.WebToApk.enterPip(): Boolean

Tüm uygulamayı şimdi yüzen bir pencere içinde pencere haline getirir - kullanıcının ayrılırken izlemeye devam etmek istediği bir video veya görüşme. Android 8+ ve yalnızca derleme PiP'yi etkinleştirdiyse (gereken manifest bayrağı); pencerenin açılıp açılmadığını döndürür. PiP etkinken uygulamadan ayrılmak bunu kendiliğinden yapar; bu, açık "küçült" düğmesidir.

Örnek

Tüm uygulamayı şimdi küçük, yüzen bir pencere içinde pencere (picture-in-picture) haline getirir - bir video veya görüşme için "küçült" düğmesi.

Döndürür: yüzen pencere açıldıysa true, aksi halde false (eşzamanlı). Gerekli: derleme yaparken Adım 3 (Entegrasyon) içinde Görüntü Seçenekleri altında Pencere İçinde Pencere (PiP) açık. Android 8+.

var pipBtn = document.getElementById('pip-btn');
pipBtn.onclick = function () {
  if (!(window.WebToApk && typeof window.WebToApk.enterPip === 'function')) return;
  var ok = window.WebToApk.enterPip();
  if (!ok) pipBtn.hidden = true;   // PiP not enabled in this build, or Android 7 and older
};

Sayfayı küçük pencereye uydurun: pencere çok daralır, bu yüzden bir resize dinleyicisi videodan başka her şeyi gizleyebilir.

window.addEventListener('resize', function () {
  var small = window.innerWidth < 300;
  document.querySelector('nav').style.display = small ? 'none' : '';
});

Yüzen pencerenin açılıp kapanmasını appmint:pip olayıyla (detail.inPip) izleyin; örneğin bir görüşmenin kontrollerini gizlemek için:

window.addEventListener('appmint:pip', function (e) {
  var inPip = !!(e.detail && e.detail.inPip);
  document.body.classList.toggle('pip', inPip);   // CSS: .pip .call-controls { display: none; }
  if (!inPip) {
    document.getElementById('chat-panel').hidden = false;   // back to the full-size screen
  }
});

document.getElementById('minimise').onclick = function () {
  if (window.WebToApk && typeof window.WebToApk.enterPip === 'function') {
    document.getElementById('chat-panel').hidden = true;
    window.WebToApk.enterPip();
  }
};

Notlar: PiP etkinken Ana Sayfa'ya basmak zaten kendiliğinden yüzen pencereye geçer; bu yöntem yalnızca açık bir düğme içindir. PiP anahtarı olmayan bir derlemede false döndürür, çünkü gereken manifest bayrağı eksiktir. PiP pencere boyutunu Android seçer. Yapay zekayla oluşturulan uygulamalar şunun pip özelliğini kullanabilir: @/lib/appmintNative.

`isFullscreen` köprü#

window.WebToApk.isFullscreen(): Boolean

Sayfanın durum çubuğunu (saat/pil) ve gezinme çubuğunu kendisinin gizlemesini sağlar - örn. oynama ekranına giren bir oyun: WebToApk.setFullscreen(true) // sistem çubuklarını gizle WebToApk.setFullscreen(false) // geri getir WebToApk.toggleFullscreen() WebToApk.isFullscreen() Seçim açılışlar arasında hatırlanır. Oluşturucunun zaten tam ekrana/kioska kilitlediği uygulamalarda etkisizdir - orada geri dönülecek bir şey yoktur. Yan menüdeki "Tam ekran" öğesi son kullanıcılar için eşdeğeridir ve oluşturucunun enableFullscreenToggle seçeneğiyle kontrol edilir; bu köprü uygulamanın kendi sayfası için her zaman kullanılabilir.

Tek başına değil, grubu olan Tam ekran köprüsü altında açıklanmıştır.

Örnek

Android durum ve gezinme çubuklarının şu an gizli olup olmadığını söyler.

Döndürür: true / false, eşzamanlı olarak. Gerekli: hiçbir şey.

function barsHidden() {
  if (window.WebToApk && typeof window.WebToApk.isFullscreen === 'function') {
    return window.WebToApk.isFullscreen();
  }
  return false;   // in a browser
}

if (barsHidden()) {
  document.getElementById('fs-btn').textContent = 'Exit fullscreen';
}

Sayfayı, yeniden başlatmalardan sonra da kalan hatırlanmış seçime göre başlangıçta düzenleyin:

document.addEventListener('DOMContentLoaded', function () {
  var hidden = !!(window.WebToApk && typeof window.WebToApk.isFullscreen === 'function' &&
                  window.WebToApk.isFullscreen());
  document.documentElement.classList.toggle('bars-hidden', hidden);
  // CSS: .bars-hidden header { padding-top: env(safe-area-inset-top); }
});

Uygulama tam ekran derlendiyse ve çubuklar geri gelemiyorsa bir "çubukları göster" düğmesi koyun:

function showBars() {
  var W = window.WebToApk;
  if (!(W && typeof W.isFullscreen === 'function')) return;
  W.setFullscreen(false);
  setTimeout(function () {             // the change is applied on the UI thread
    if (W.isFullscreen()) {
      document.getElementById('bars-btn').hidden = true;
    }
  }, 100);
}

Notlar: Oluşturucu uygulamayı Tam ekran veya Sürükleyici Kiosk Modu ile derlediyse VEYA sayfa setFullscreen(true) / toggleFullscreen() çağırdıysa true döndürür. İlk durumda setFullscreen(false) çubukları geri getiremez.

`isSecureScreen` köprü#

window.WebToApk.isSecureScreen(): Boolean

WebToApk.setSecureScreen(true) // BU sayfada ekran görüntülerini engelle WebToApk.setSecureScreen(false) // korumayı erken bırak WebToApk.isSecureScreen() // -> boolean Koruma onu isteyen sayfaya aittir. Uygulama başka bir yere gittiği anda - yeni bir belge, bir pushState rotası, bir #hash rotası - bırakılır; böylece korumalı bir ekran uygulamanın geri kalanını kilitli bırakamaz ve yeniden yüklemeden sonra korumayı isteyen sayfa yeniden ister. Ne yapar: açıkken ekran görüntüleri, ekran kaydı, yayınlama ve son uygulamalar ekranı küçük resmi durur. Ne yapamaz: ekrana tutulan bir kamerayı durduramaz. Android'de hiçbir şey bunu yapamaz ve buradaki hiçbir köprü aksini iddia etmez.

Tek başına değil, grubu olan Ekran yakalama koruması altında açıklanmıştır.

Örnek

Ekran görüntüsü korumasının (setSecureScreen) şu an açık olup olmadığını söyler.

Döndürür: hemen bir boolean. Gerekli: hiçbir şey.

function updateLockIcon() {
  var on = !!window.WebToApk &&
    typeof window.WebToApk.isSecureScreen === 'function' &&
    window.WebToApk.isSecureScreen();
  document.getElementById('shield').hidden = !on;
}

Bir kart numarası göstermeden önce kontrol edin; bu sayfa henüz istemediyse önce korumayı açın:

function revealCardNumber(full) {
  var W = window.WebToApk;
  if (W && typeof W.isSecureScreen === 'function' && !W.isSecureScreen()) {
    W.setSecureScreen(true);   // the new state is committed when this returns
  }
  document.getElementById('card-number').textContent = full;
}

Gerçek durumdan başlayıp onu çeviren bir "Ekran görüntülerinden gizle" anahtarı:

var toggle = document.getElementById('privacy-toggle');
var W = window.WebToApk;

if (!W || typeof W.isSecureScreen !== 'function') {
  toggle.hidden = true;
} else {
  toggle.checked = W.isSecureScreen();
  toggle.addEventListener('change', function () {
    toggle.checked = W.setSecureScreen(!W.isSecureScreen());
  });
}

Notlar: Uygulama başka bir sayfaya veya rotaya gittiğinde kendiliğinden false değerine döner, çünkü koruma onu isteyen sayfaya aittir.

`setFullscreen` köprü#

window.WebToApk.setFullscreen(enabled: Boolean)

Tek başına değil, grubu olan Tam ekran köprüsü altında açıklanmıştır.

Örnek

Android durum çubuğunu ve gezinme çubuğunu gizler (true) veya gösterir (false); örneğin bir oyun oynama ekranına girdiğinde.

Döndürür: hiçbir şey. Gerekli: hiçbir şey - sayfanız için her zaman kullanılabilir. Seçim açılışlar arasında hatırlanır.

function enterPlayScreen() {
  if (window.WebToApk && typeof window.WebToApk.setFullscreen === 'function') {
    window.WebToApk.setFullscreen(true);    // hide clock/battery and the nav bar
  }
}
function leavePlayScreen() {
  if (window.WebToApk && window.WebToApk.setFullscreen) {
    window.WebToApk.setFullscreen(false);   // bring the bars back
  }
}

Çubuklar gizliyken içeriğinizi kamera çentiğinin altından uzak tutun:

document.body.style.paddingTop = 'env(safe-area-inset-top)';
document.body.style.paddingBottom = 'env(safe-area-inset-bottom)';

Video oynarken çubukları gizleyin; durduğunda veya bittiğinde geri getirin:

var video = document.getElementById('movie');

function hideBars(hidden) {
  if (window.WebToApk && typeof window.WebToApk.setFullscreen === 'function') {
    window.WebToApk.setFullscreen(hidden);
  }
}

video.addEventListener('play', function () { hideBars(true); });
video.addEventListener('pause', function () { hideBars(false); });
video.addEventListener('ended', function () { hideBars(false); });

Notlar: Adım 3'te (Entegrasyon) Tam ekran (veya Sürükleyici Kiosk Modu) açık derlenen bir uygulamada hiçbir şey yapmaz - oluşturucu bu seçimi kilitlemiştir. Yalnızca Android çubuklarını gizler; uygulamanın kendi üst çubuğu (yan menü düğmesi olan) Üst Çubuğu Göster anahtarıdır. Açıldığında kabuk, sayfanın tam ekrana yerleşmesi için viewport meta'nıza viewport-fit=cover ekler. Bkz. toggleFullscreen ve isFullscreen. Yapay zekayla oluşturulan uygulamalar şunun fullscreen özelliğini kullanabilir: @/lib/appmintNative.

`setSecureScreen` köprü#

window.WebToApk.setSecureScreen(enabled: Boolean): Boolean

GEÇERLİ sayfa için korumayı ayarlar ve yürürlükteki durumu döndürür. Pencere bayrağının kendisi arayüz iş parçacığında uygulanır, ancak bunun döndürdüğü durum zaten kesinleşmiştir; bu yüzden sayfa bunu çağırıp bir geri çağrıyı beklemeden hassas içeriğini hemen gösterebilir.

Örnek

GEÇERLİ sayfa özel bir şey gösterirken ekran görüntülerini, ekran kaydını, yayınlamayı ve son uygulamalar ekranı önizlemesini engeller.

Döndürür: hemen bir boolean - yürürlükteki durum (verdiğiniz değer). Çağrıdan hemen sonra özel içeriği gösterebilirsiniz. Gerekli: hiçbir şey.

function showStatement() {
  if (window.WebToApk && typeof window.WebToApk.setSecureScreen === 'function') {
    window.WebToApk.setSecureScreen(true);
  }
  render(statementView);
}

Özel içeriği gezinmeden GİZLEDİĞİNİZDE (bir modal kapanır, tek sayfa içinde bir sekme değişir) kilidi yalnızca kendiniz bırakın:

function closeCardDetails() {
  hide(cardDetailsModal);
  if (window.WebToApk && typeof window.WebToApk.setSecureScreen === 'function') {
    window.WebToApk.setSecureScreen(false);
  }
}

Bir kerelik kurtarma kodunu yalnızca yakalama engellendikten sonra gösterin; çünkü çağrı yürürlükteki durumla yanıt verir:

function revealRecoveryCode(code) {
  var W = window.WebToApk;
  if (!(W && typeof W.setSecureScreen === 'function')) {
    alert('Open the app to see your recovery code.');
    return;
  }
  if (W.setSecureScreen(true)) {
    document.getElementById('recovery-code').textContent = code;
  }
}

Notlar: Koruma onu isteyen sayfaya aittir. Uygulama başka bir yere gittiği anda - yeni sayfa, bir pushState rotası veya bir #hash rotası - bırakılır; bu yüzden çıkarken temizlenecek bir şey yoktur ve yeniden yüklemeden sonra sayfa yeniden istemelidir. Bunu bir zamanlayıcıyla yeniden uygulamayın: kullanıcı ekran görüntüsü düğmelerine bastığında bayrak zaten açık olmalıdır. Ekrana tutulan bir kamerayı hiçbir şey durduramaz.

`setStatusBarColor` köprü#

window.WebToApk.setStatusBarColor(color: String, style: String): Boolean

Durum ve gezinme çubuklarını [color] ile boyar ve simge rengini seçer: [style] 'light' koyu çubukta açık simgeler, 'dark' tersi, '' ise parlaklığın karar vermesi demektir. [color] `#RGB`, `#RGBA`, `#RRGGBB`, `#AARRGGBB` (alfa ÖNCE - CSS'in `#RRGGBBAA` sırası da alfa önce olarak okunur) veya temel bir renk adıdır ('black', 'navy'…); `rgb()`/`hsl()` okunmaz. Renk ayrıştırılamazsa false döndürür.

Örnek

Android durum çubuğunu bir renge boyar ve üzerinde açık veya koyu simgeler seçer.

Döndürür: true, veya renk ayrıştırılamazsa false (eşzamanlı). Gerekli: hiçbir şey.

style 'light' (koyu çubuk için açık simgeler), 'dark' (açık çubuk için koyu simgeler) veya '' (kabuk rengin parlaklığına göre seçer) olur:

function paintBar(color, style) {
  if (window.WebToApk && typeof window.WebToApk.setStatusBarColor === 'function') {
    return window.WebToApk.setStatusBarColor(color, style);
  }
  return false;   // in a browser
}

paintBar('#0B0F1A', 'light');   // dark bar, light icons
paintBar('#FFFFFF', 'dark');    // white bar, dark icons
paintBar('#0E7C86', '');        // icons chosen automatically

Çubuğu her ekrana uydurun:

function showScreen(name) {
  var colors = { home: '#0B0F1A', settings: '#FFFFFF' };
  paintBar(colors[name] || '#0B0F1A', name === 'settings' ? 'dark' : 'light');
}

Telefonun açık veya koyu temasını izleyin; uygulama açıkken bir anahtar da dahil:

var darkTheme = window.matchMedia('(prefers-color-scheme: dark)');

function matchTheme() {
  if (!(window.WebToApk && typeof window.WebToApk.setStatusBarColor === 'function')) return;
  if (darkTheme.matches) {
    window.WebToApk.setStatusBarColor('#121212', 'light');
  } else {
    window.WebToApk.setStatusBarColor('#F5F5F5', 'dark');
  }
}

matchTheme();
darkTheme.addEventListener('change', matchTheme);

Notlar: Renkler Android renk metinleridir: #RRGGBB veya #AARRGGBB (ve red gibi adlar). rgb(...) veya #RGB gibi CSS biçimleri false döndürür. Capacitor'ın StatusBar eklentisinin çubuğu boyayamadığı Android 15+ üzerinde de çalışır. Çubuklar gizliyken (tam ekran) renk, geri geldiklerinde kullanılmak üzere saklanır. Yapay zekayla oluşturulan uygulamalar şunun setStatusBar özelliğini kullanabilir: @/lib/appmintNative.

`splashHold` köprü#

window.WebToApk.splashHold()

[splashReady] çağrılana kadar markalı açılış ekranını görünür tutar. Varsayılan olarak açılış ekranı, gövdede yerleşmiş öğeler olur olmaz gizlenir; bu, bir iskelet çizip sonra ilk ekranını getiren uygulama için "açılış ekranı, sonra iskelet" demektir. Bitmiş bir ilk ekranı göstermeyi tercih eden uygulama bunu içe aktarma sırasında, ekran hazır olunca da [splashReady] işlevini çağırır. Boyama yoklamasıyla aynı 6 sn güvenlik sınırı uygulanır; bu yüzden hiç hazır bildirmeyen sayfa da yine açılır.

Örnek

splashReady() çağırana kadar uygulamanın açılış ekranını görünür tutar - böylece kullanıcı "açılış ekranı, sonra yükleme iskeleti" yerine bitmiş ilk ekranınızı görür.

Döndürür: hiçbir şey. Gerekenler: hiçbir şey.

Mümkün olduğunca erken (ilk betiğinizin en üstünde) çağırın, sonra ilk ekran çizildiğinde splashReady() çağırın:

if (window.WebToApk && typeof window.WebToApk.splashHold === 'function') {
  window.WebToApk.splashHold();
}

loadFirstScreen()                      // your own async start-up (fetch data, render)
  .catch(function (err) { showError(err); })
  .then(function () {
    if (window.WebToApk && window.WebToApk.splashReady) window.WebToApk.splashReady();
  });

İlk ekranın ana görseli yüklenene kadar açılış ekranını bekletin; böylece uygulama bitmiş bir resimle açılır:

if (window.WebToApk && typeof window.WebToApk.splashHold === 'function') {
  window.WebToApk.splashHold();
}

function releaseSplash() {
  if (window.WebToApk && window.WebToApk.splashReady) window.WebToApk.splashReady();
}

var hero = document.getElementById('hero');
if (hero.complete) {
  releaseSplash();
} else {
  hero.addEventListener('load', releaseSplash);
  hero.addEventListener('error', releaseSplash);   // a broken image must not keep the splash up
}

Yalnızca ilk ekranın veriye ihtiyacı olduğunda bekletin; hemen çizilen bir ekran normal açılsın:

var signedIn = !!localStorage.getItem('session');

if (signedIn && window.WebToApk && typeof window.WebToApk.splashHold === 'function') {
  window.WebToApk.splashHold();        // the dashboard needs its data before it looks right
}

if (signedIn) {
  loadDashboard().finally(function () {
    if (window.WebToApk && window.WebToApk.splashReady) window.WebToApk.splashReady();
  });
} else {
  showLoginScreen();                   // paints at once; the splash hides by itself
}

Notlar: splashHold() olmadan açılış ekranı, sayfa gövdesinde görünür öğeler olur olmaz gizlenir. Bekletilen bir açılış ekranı da birkaç saniye sonra kendiliğinden gizlenir (normal boyama kontrolüyle aynı güvenlik sınırı); bu yüzden hiç splashReady() çağırmayan bir sayfa yine açılır. Hata yolunda da her zaman splashReady() çağırın. Oluşturucunun en kısa açılış ekranı süresi yine geçerlidir. Yapay zekayla oluşturulan uygulamalar şunun splash özelliğini kullanabilir: @/lib/appmintNative.

`splashReady` köprü#

window.WebToApk.splashReady()

İlk ekran açık - açılış ekranını şimdi gizle (oluşturucunun en kısa açılış ekranı süresine tabi). Tekrar çağırmak zararsızdır; hiçbir şey tutulmadıysa da zararsızdır.

Örnek

Kabuğa ilk ekranınızın açık olduğunu bildirir; böylece açılış ekranı şimdi gizlenir.

Döndürür: hiçbir şey. Gerekli: hiçbir şey. Birden fazla çağırmak güvenlidir ve hiçbir şey tutulmadıysa zararsızdır.

Şununla eşleşir: splashHold():

if (window.WebToApk && window.WebToApk.splashHold) window.WebToApk.splashHold();

async function start() {
  try {
    var res = await fetch('/api/today');
    renderToday(await res.json());
  } catch (e) {
    renderOfflineMessage();
  } finally {
    if (window.WebToApk && typeof window.WebToApk.splashReady === 'function') {
      window.WebToApk.splashReady();   // hide the splash in every case
    }
  }
}
start();

Ekranı yalnızca tarayıcı az önce oluşturduğunuz şeyi çizdikten sonra (iki animasyon karesi) gösterin:

renderApp(document.getElementById('root'));

requestAnimationFrame(function () {
  requestAnimationFrame(function () {
    if (window.WebToApk && typeof window.WebToApk.splashReady === 'function') {
      window.WebToApk.splashReady();
    }
  });
});

Birkaç başlangıç işini bekleyin ve biri başarısız olsa bile açılış ekranını gizleyin:

if (window.WebToApk && window.WebToApk.splashHold) window.WebToApk.splashHold();

Promise.allSettled([
  loadProfile(),          // your own start-up requests
  loadFeed(),
  document.fonts.ready    // no flash of the wrong font
]).then(function (results) {
  results.forEach(function (r) { if (r.status === 'rejected') console.warn(r.reason); });
  if (window.WebToApk && typeof window.WebToApk.splashReady === 'function') {
    window.WebToApk.splashReady();
  }
});

Notlar: Oluşturucunun en kısa açılış ekranı süresi yine geçerlidir. Hiç splashHold() çağırmazsanız açılış ekranı sayfa çizildiğinde kendiliğinden gizlenir ve splashReady() fazladan bir şey yapmaz.

`toggleFullscreen` köprü#

window.WebToApk.toggleFullscreen()

Tek başına değil, grubu olan Tam ekran köprüsü altında açıklanmıştır.

Örnek

Android durum ve gezinme çubuklarını gizli ile görünür arasında değiştirir.

Döndürür: hiçbir şey. Gerekli: hiçbir şey. Yeni durum açılışlar arasında hatırlanır.

Kendi etiketini de güncelleyen bir "tam ekran" düğmesi:

var btn = document.getElementById('fs-btn');
if (window.WebToApk && typeof window.WebToApk.toggleFullscreen === 'function') {
  btn.onclick = function () {
    window.WebToApk.toggleFullscreen();
    // The change is applied on the UI thread; read the state a moment later.
    setTimeout(function () {
      btn.textContent = window.WebToApk.isFullscreen() ? 'Exit fullscreen' : 'Fullscreen';
    }, 100);
  };
} else {
  btn.hidden = true;   // in a browser
}

Çubukları gizlemek veya göstermek için bir fotoğrafa ya da okuma görünümüne çift dokunun:

var viewer = document.getElementById('photo-viewer');

viewer.addEventListener('dblclick', function () {
  if (window.WebToApk && typeof window.WebToApk.toggleFullscreen === 'function') {
    window.WebToApk.toggleFullscreen();
  }
});

Donanım klavyesinde F tuşuyla değiştirin, ancak kullanıcı bir alana yazarken değil:

document.addEventListener('keydown', function (e) {
  if (e.key !== 'f' || e.target.closest('input, textarea, [contenteditable]')) return;
  if (window.WebToApk && typeof window.WebToApk.toggleFullscreen === 'function') {
    e.preventDefault();
    window.WebToApk.toggleFullscreen();
  }
});

Notlar: Tam ekran veya Sürükleyici Kiosk Modu açık derlenen bir uygulamada hiçbir şey yapmaz (çubuklar gizli kalır). Son kullanıcılar için yan menüdeki "Tam ekran" öğesi ayrı bir derleme anahtarıdır (Adım 3'te Görüntü Seçenekleri altında Tam Ekran Düğmesi); bu köprü yöntemi o olmadan da çalışır.

AppMint.copyProtection yardımcı#

navigator.wakeLock web standardı#

screen.orientation web standardı#

window.close web standardı#

__lockOrientation köprü#

__unlockOrientation köprü#

__wakeLock köprü#

closeWindow köprü#

enterPip köprü#

isFullscreen köprü#

isSecureScreen köprü#

setFullscreen köprü#

setSecureScreen köprü#

setStatusBarColor köprü#

splashHold köprü#

splashReady köprü#

toggleFullscreen köprü#

`AppMint.copyProtection` yardımcı#

`navigator.wakeLock` web standardı#

`screen.orientation` web standardı#

`window.close` web standardı#

`__lockOrientation` köprü#

`__unlockOrientation` köprü#

`__wakeLock` köprü#

`closeWindow` köprü#

`enterPip` köprü#

`isFullscreen` köprü#

`isSecureScreen` köprü#

`setFullscreen` köprü#

`setSecureScreen` köprü#

`setStatusBarColor` köprü#

`splashHold` köprü#

`splashReady` köprü#

`toggleFullscreen` köprü#