Flutter Navigator 2.0

Nov 8 2022 · Dart 2.17.3, Flutter 3.0.2, Android Studio 2020.3

Part 4: Deep Links & Web Urls

23. Check the Deep Links & Remove # Symbol

Episode complete

About this episode
Leave a rating/review
See forum comments
Cinema mode Mark complete Download course materials
Previous episode: 22. Support Web Url

Get immediate access to this and 4,000+ other videos and books.

Take your career further with a Kodeco Personal Plan. With unlimited access to over 40+ books and 4,000+ professional videos in a single subscription, it's simply the best investment you can make in your development career.

Learn more Already a subscriber? Sign in.

Notes: 23. Check the Deep Links & Remove # Symbol

Where to Go From Here?

  • go_route - with flutter 3.3.0 update, flutter now officially supports the go_route package.
  • Beamer and auto_route are two other packages that can be used to manage the navigation in flutter. Beamer is a package that is used to manage the navigation in flutter web. Auto_route is a package that is used to manage the navigation in flutter web and mobile.
  • Flutter Official Docs for Route and navigation- https://flutter.dev/docs/development/ui/navigation.

Heads up... You've reached locked video content where the transcript will be shown as obfuscated text.

Now that our app is ready and working as expected on Android, iOS, and web platforms, let us check if our deep links are working. Let us run our application. Our application is running, now let us check if deep links are working. Now we have opened our terminal and we're going to write a command and go to the settings page of our application. So the command is xcor run, short form for xcor run, simulator, open URL, booted. And then we are going to pass our CF bundle URL scheme that is RW book, and our domain. And after domain, now we will pass the screen that we have to go to. So let's say settings. Let me bring my simulator at this site and if I'll hit enter, I want our app to go to the settings page. You can see now our app has gone to the settings page. I'll hit logout, and again, instead of settings what we will do is we will go to the card screen. And our app is on card screen. We can do one more thing. Let me minimize our application the command in our terminal. I will use settings if our app opens and directly goes to the setting screen, and it does, now. Okay, we can directly go to the detail screen as well. Let me change the book from here and I can go directly to our third book. So our deep links are working in iOS. Now let us check for Android. So I'll close my simulator and I will open my amulator and run the application on that. And we will check the deep links on our Android phone as well. Okay, our application is booted on Android and let me open my terminal and I will pass a command. And let's see if we go to the settings screen. And yes, we can go to the settings screen. As you can see, you might get a warning saying activity not started, intent has been delivered to currently running top-most instance. But it is fine. You can ignore that warning. And I will also want to go to our second book in a details page. So book question mark ID is equal to two and if I'll hit enter, I want to go to our details screen of letter apprentice. I'll page both these commands in our main dot file so you can download the project and you can get these commands. Let me run this application one more time on web. I can see our project is running on Chrome and I can go to homepage and you can see we have a small hash project over here and it doesn't look right for our url. So let us remove that hash. So I come to our pub spec dot yaml file and you can see we have already added a dependency called as URL strategy. We will use this to remove hash symbol. Come to our main dot file, and scroll to the top at our void main function. And I've created a tool which says add path url strategy to remove hash from url. So let us do that change. So just call set path url strategy. I'll refresh our application in Chrome and you can see now we don't have that hash symbol and our application is working perfectly fine.