It enables communication between your bot and the Flutter-embedded Web App displayed inside Telegram by making use of interoperability between Dart and JavaScript.
🚧🚩This package is still under development, it is not recommended to use it in a production environment.
The package should only be used on the Web platform.
-
Add the following lines to your project dependencies
tele_web_app: git: https://github.com/yeikel16/tele_web_app.git
-
Add to the
index.htmllocated in thewebfolder and put the telegram-web-app.js script in the<head>tag before any other scripts, using this code:<script src="https://telegram.org/js/telegram-web-app.js"></script>
-
Add the following line to indicate to Telegram that our app is ready to be displayed.
window.Telegram.WebApp.ready();
In our case we call it once our custom LoadingIndicator is removed.
<script> window.addEventListener("flutter-first-frame", function () { var loadingIndicator = document.getElementById("loading_indicator"); if (loadingIndicator) { loadingIndicator.remove(); window.Telegram.WebApp.ready(); } }); </script>
You moust get instance from the TeleWebApp singlenton class.
final twa = TeleWebApp();
// Get MainButton intance
final button = twa.mainButton;
// Get if MainButton is visible
final isVisible = button.isVisble; // false
// Use to show the MainButton
...
return InkWell(
onTap: () {
button.show();
},
child: Container(
...
// Get if MainButton is visible
final isVisible = button.isVisble; // trueThis class allows you to change some properties and access the methods so that you can do what you want with your WebApp within Telegram.
If you want to report a problem or would like to add a new feature, feel free to open an issue on GitHub. Pull requests are also welcome.