Paketler
@lia-labs/elements
Sayfayı kopyala
The Lia SDK özel öğeler olarak, her sayfa ve her çerçeve için. Sayfaya bir öğe koyun ve orada olduğu sürece işini yapar.
npm install @lia-labs/elementsYapı adımını olmadan da:
<script src="https://unpkg.com/@lia-labs/elements/dist/auto.global.js"></script>Script derlemesi, yüklenirken öğeleri kaydeder ve tüm SDK'ı üzerine koyar window.liaElements. Bir paketleyiciyle, onları bir kez kaydet:
import { defineLiaElements } from '@lia-labs/elements';
defineLiaElements();#Bir uygulama
<lia-app auto-ready></lia-app>
<lia-main-button text="Buy extra lives"></lia-main-button>
<button id="play">Play</button>
<div id="game"></div>
<script>
document.querySelector('lia-main-button').addEventListener('lia-click', function () {
liaElements.pay('extra-lives');
});
document.querySelector('lia-app').addEventListener('lia-ready', function (event) {
console.log('Hello, @' + event.detail.player.name);
});
// While a game runs: a back button and closing confirmation, gone when the game ends.
var game = document.getElementById('game');
document.getElementById('play').onclick = function () {
game.innerHTML = '<lia-back-button></lia-back-button><lia-closing-confirmation></lia-closing-confirmation>';
game.querySelector('lia-back-button').addEventListener('lia-click', function () { game.innerHTML = ''; });
};
</script>Öğeler, sayfanızda hiçbir şey çekmez: her biri Lia'ın bir kısmını kontrol ederken's belgede. Bunu kaldırın (veya ebeveynini) düğmeyi gizler veya tutmayı sonlandırır. Birinin içindeki öğeler hidden ebeveyn hâlâ sayılır: bunları ekleyin ve kaldırın.
#Elemanlar
| Eleman | İşte'sayfada | Özellikler | Olaylar |
|---|---|---|---|
<lia-app> | Çağrılar init(), sonra ayarlar ready (veya error) kendi içinde | auto-ready çağrılar ready() ilk kare sonra; no-css-vars | lia-ready (detay: başlatma sonucu), lia-error |
<lia-main-button> | Lia'ana düğme | text, color, text-color, disabled, progress, shine | lia-click |
<lia-secondary-button> | İkinci düğme | Aynı, ve position | lia-click |
<lia-back-button> | Başlık'u geri düğmesi | lia-click | |
<lia-settings-button> | ⋯ menüsündeki ayarlar | lia-click | |
<lia-closing-confirmation> | Lia kapatmadan önce sorar | ||
<lia-swipe-lock> | Aşağıya kaydırma kazandı'sayfayı kapat | ||
<lia-banner> | Bir Lia bülteni kenara yaslanırken'sayfada (sizin sayfanız onu sığdırmak için daha kısa olur) | position: bottom (varsayılan) veya top |
Bir öznitelik değiştiğinde düğme güncellenir: button.setAttribute('progress', '') çarkını gösterir, button.toggleAttribute('disabled', true) grileştirir.
Otomatik çeviri. İngilizce, doğru kaynaktır. İngilizce olarak oku