How to Convert Url to APK in Flutter

flutter web development tutorial flutter web development tutorial

Url to APK in Flutter

In flutter we can easily convert Web Url to APK , below are the steps which execute smoothly:

Step 1: Add package in your project pubspec.yaml file

 webview_flutter: 3.0.4

Step 2 : Now Update the main.dart file and add Url, here in this we are using researchthinker.com, you can use own url


import 'package:flutter/material.dart';
import 'package:webview_flutter/webview_flutter.dart';
import 'package:permission_handler/permission_handler.dart';
import 'dart:async';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: SplashScreen(),
    );
  }
}

class SplashScreen extends StatefulWidget {
  @override
  _SplashScreenState createState() => _SplashScreenState();
}

class _SplashScreenState extends State<SplashScreen> {
  @override
  void initState() {
    super.initState();
    _navigateToNextScreen();
  }

  Future<void> _navigateToNextScreen() async {
    await Future.delayed(Duration(seconds: 2)); // Duration of the splash screen
    Navigator.pushReplacement(
      context,
      MaterialPageRoute(builder: (context) =>
         WebViewScreen()

      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      body: Center(
        child: Image.asset('assets/splashIcon.png'), // Incase you want splash screen
      ),
    );
  }
}


class WebViewScreen extends StatefulWidget {
  const WebViewScreen({Key? key}) : super(key: key);

  @override
  State<WebViewScreen> createState() => _WebViewScreenState();
}

class _WebViewScreenState extends State<WebViewScreen> {
  late WebViewController _controller;
  bool _isLoading = true;
  final _key = UniqueKey();

  @override
  void initState() {
    super.initState();
 
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Padding(
        padding: const EdgeInsets.fromLTRB(0, 0, 0, 0),
        child: Stack(
          children: [
            WebView(
              key: _key,
              initialUrl:'https://researchthinker.com',  // Adding a unique query parameter
              javascriptMode: JavascriptMode.unrestricted,
              zoomEnabled: true,
              onWebViewCreated: (controller) async {
                _controller = controller;
                await _controller.clearCache();
                _controller.reload();  // Reload the page to ensure fresh content
              },
              onProgress: (progress) {
                print("Progress: $progress%");
              },
              onPageFinished: (url) {
                setState(() {
                  _isLoading = false;
                });
              },
              onWebResourceError: (error) {
                if (error.errorCode == -2 || error.errorType == WebResourceErrorType.connect) {
                  _controller.reload();  // Reload on error
                }
                setState(() {
                  _isLoading = false;
                });
                ScaffoldMessenger.of(context).showSnackBar(
                  SnackBar(content: Text('Failed to load page: ${error.description}')),
                );
              },
            ),
            if (_isLoading)
              const Center(
                child: CircularProgressIndicator(),
              ),
          ],
        ),
      ),
    );
  }
}



Step 3: Now run below commands to make Apk

flutter build apk

Leave a Reply

Your email address will not be published. Required fields are marked *

web_horizontal
About Us ♢ Disclaimer ♢ Privacy Policy ♢ Terms & Conditions ♢ Contact Us

Copyright © 2023 ResearchThinker.com. All rights reserved.