Flutter deeplink Enhance | Go Router

Flutter deeplink :

Flutter deeplink, A deeplink point’s to a specific page in website or mobile app rather than opening up the basic home page or initial screen in mobile app.

We have seen few tutorials previously based on deeplink integration in flutter may visit them for getting in depth knowledge on implementation in your flutter app.

These deeplinks are mostly used to redirect users to a specific page within an app, such as a product page or a specific article, bypassing the need to navigate through multiple pages to find the desired content. Deeplinks are commonly used in mobile apps to provide a more seamless user experience and to increase engagement with specific features or content.

Complete playlist for deeplink :

 

 

Flutter deeplink Enhance ?

In this part of the tutorial we will make it much easier to redirect user within app and from deeplinks as well yes, this gonna be much more easier now.

We will be creating links within app screens i.e, pages and can easily move between them with a simple trigger.

 

pubspec.yaml

Add go router plugin to make our work much more simpler.

dependencies:
  flutter:
    sdk: flutter

  go_router: 6.2.0

 

main.dart :

import 'package:flutter/material.dart';
import 'package:flutter_basics/home.dart';
import 'package:flutter_basics/profile.dart';
import 'package:go_router/go_router.dart';

import 'help.dart';

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

GoRouter _appRoute = GoRouter(routes: <RouteBase>[
  GoRoute(
    path: "/",
    builder: (BuildContext context, GoRouterState state) {
      return const HomeScreen();
    },
  ),
  GoRoute(
    path: "/profile",
    builder: (BuildContext context, GoRouterState state) {
      return const Profile();
    },
  ),
  GoRoute(
    path: "/help",
    builder: (BuildContext context, GoRouterState state) {
      return const Help();
    },
  ),
]);

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp.router(
      routerConfig: _appRoute,
    );
  }
}

 

home.dart :

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

class HomeScreen extends StatelessWidget {
  const HomeScreen({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return  Scaffold(
      body: Center(
        child: TextButton(onPressed: (){
          context.go('/profile');
        }, child: Text("Move to profile screen")),
      ),
    );
  }
}

 

help.dart :

import 'package:flutter/material.dart';

class Help extends StatelessWidget {
  const Help({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return const Scaffold(
      body: Center(
        child: Text("Help"),
      ),
    );
  }
}

 

profile.dart :

import 'package:flutter/material.dart';

class Profile extends StatelessWidget {
  const Profile({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return const Scaffold(
      body: Center(
        child: Text("Profile"),
      ),
    );
  }
}

 

Configuring Manifest For deeplinking

Add the below code in MainActivity tags in Manifest file.

<meta-data android:name="flutter_deeplinking_enabled" android:value="true" />
<intent-filter android:autoVerify="true">
    <action android:name="android.intent.action.VIEW" />
    <category android:name="android.intent.category.DEFAULT" />
    <category android:name="android.intent.category.BROWSABLE" />
    <data android:scheme="http" android:host="example.com" />
    <data android:scheme="https" />
</intent-filter>

 

For testing run this below command in terminal

adb shell 'am start -a android.intent.action.VIEW -c android.intent.category.BROWSABLE -d "http://example.com/“’profile com.example.flutter_basics