Building an Android App with WebView Using URLs

WebView is a powerful component in Android development that allows developers to embed web content directly into their applications. While initially loading a static URL is straightforward, there are scenarios where developers might need to dynamically change the website URL during runtime. In this blog post, we’ll explore how to achieve this functionality effectively.

Using WebView to Display Websites: WebView is commonly used in Android apps to display web content, such as websites, within the app’s user interface. Typically, developers initialize a WebView with a specific URL using the loadUrl() method.

Example:-

 ..loadRequest(Uri.parse('https://www.wizbrand.com/tools/all-in-one'));

Step 1:- Import Dependencies in main.dart

Step 2:- Import from https://pub.dev/packages/webview_flutter/install

Step 3:- If the import dependencies file is not found in main.dart
Mouse Hover on the package and then click on Quick Fix-> Add’webview_flutter’ to dependencies

Step 4:- Write a code in main.dart

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

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

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'All In One',
      theme: ThemeData(
        primarySwatch: Colors.amber,
      ),
    home: const WebViewDemo(),
    );
  }
}

class WebViewDemo extends StatefulWidget {
  const WebViewDemo({super.key});

  @override
  State<WebViewDemo> createState() => _MyWidgetState();
}

class _MyWidgetState extends State<WebViewDemo> {
  WebViewController controller = WebViewController();
  @override
void initState(){
  super.initState();
  controller
  ..setJavaScriptMode(JavaScriptMode.unrestricted)
  ..setBackgroundColor(const Color(0x00000000))
  ..setNavigationDelegate(NavigationDelegate(
     onProgress: (progress) => {},
     onPageStarted: (url) => {},
     onPageFinished: (url) => {},
  ))
  ..loadRequest(Uri.parse('https://www.wizbrand.com/tools/all-in-one'));
}

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      appBar: AppBar(
        title: const Text('Tools')
      ),
body: WebViewWidget(controller: controller),
    );
  }
}

Output:- Refresh the Emulator

Hopefully, It will help you…!!

Related Posts

AI Software Development Guide for Startups and Enterprise Teams

Introduction Engineering executives, CTOs, and technical directors face a common operational dilemma: engineering headcount grows, but feature velocity steadily drops. As application architectures expand into distributed services,…

Read More

Website Development Services: What Businesses Should Evaluate Before Hiring

Introduction Most website failures do not start in the design mockups; they originate deep within the backend infrastructure. When leadership teams treat web builds as purely visual…

Read More

A Practical Guide to Exploring Amaravati and Its Historic Attractions

Introduction Amaravati stands out as one of the most culturally layered regions in southern India. Situated along the banks of the Krishna River, this historic town brings…

Read More

DataOps Training for Scalable Pipelines and Efficient Data Management

Introduction Enterprise cloud migrations frequently stumble when transitioning analytical workflows. IT leadership invests heavily in premier hyperscalers, migrating petabytes of historical records to modern object stores and…

Read More

Analyzing Open-Source Package Risks with Modern Software Composition Tools

Introduction Engineering teams release code multiple times a day across modern cloud environments, but traditional, late-stage security audits cannot keep up. When vulnerability scanning and compliance checks…

Read More

The Strategic Guide to Engaging a DevOps Freelancer for Infrastructure Automation

Introduction Scaling an engineering team often exposes infrastructure bottlenecks. Feature releases slow down, builds fail intermittently, cloud environments drift out of sync, and core developers spend hours…

Read More
Subscribe
Notify of
guest
0 Comments
Oldest
Newest Most Voted
Inline Feedbacks
View all comments
0
Would love your thoughts, please comment.x
()
x