Skip to content

Latest commit

 

History

History
102 lines (71 loc) · 3.11 KB

README.md

File metadata and controls

102 lines (71 loc) · 3.11 KB

tele_web_app

style: very good analysis License: MIT

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.

Install

  1. Add the following lines to your project dependencies

    tele_web_app:
        git: https://github.com/yeikel16/tele_web_app.git
  2. Add to the index.html located in the web folder 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>
  3. 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>

Usege

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; // true

This class allows you to change some properties and access the methods so that you can do what you want with your WebApp within Telegram.

Bugs or Requests

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.