How to Convert Url to APK in Flutter

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.