Tag: dart

Interactive example import ‘package:flutter/material.dart’; void main() {  runApp(const MaterialApp(   title: ‘Navigation Basics’,   home: FirstRoute(),  )); } class FirstRoute extends StatelessWidget {  const FirstRoute({super.key});  @override  Widget build(BuildContext context) {   return Scaffold(    appBar: AppBar(     title: const Text(‘First Route’),    ),    body: Center(     child: ElevatedButton(      child: const Text(‘Open route’),      onPressed: () {       Navigator.push(        context,        MaterialPageRoute(builder: (context) => const SecondRoute()),… Continue reading Navigate to a new screen and back :

How do you close the second route and return to the first? By using the Navigator.pop() method. The pop() method removes the current Route from the stack of routes managed by the Navigator. To implement a return to the original route, update the onPressed() callback in the SecondRoute widget: // Within the SecondRoute widget onPressed:… Continue reading Navigate to a new screen and back : Return to the first route using Navigator.pop() #

To switch to a new route, use the Navigator.push() method. The push() method adds a Route to the stack of routes managed by the Navigator. Where does the Route come from? You can create your own, or use a MaterialPageRoute, which is useful because it transitions to the new route using a platform-specific animation. In… Continue reading Navigate to a new screen and back : Navigate to the second route using Navigator.push()

First, create two routes to work with. Since this is a basic example, each route contains only a single button. Tapping the button on the first route navigates to the second route. Tapping the button on the second route returns to the first route. class FirstRoute extends StatelessWidget {  const FirstRoute({super.key});  @override  Widget build(BuildContext context)… Continue reading Navigate to a new screen and back : Create two routes

In addition to an opacity parameter, AnimatedOpacity requires a duration to use for its animation. AnimatedOpacity(  duration: const Duration(seconds: 2),  opacity: opacity,  child: const Column(

update your android and ios configurations to ensure that your app has the correct permissions to stream videos from the internet. Add the following permission to the AndroidManifest.xml file just after the <application> definition. The AndroidManifest.xml file is found at <project root>/android/app/src/main/AndroidManifest.xml. <manifest xmlns:android=”http://schemas.android.com/apk/res/android”>   <application …>   </application>   <uses-permission android:name=”android.permission.INTERNET”/> </manifest> content_copy iOS For iOS, add… Continue reading Add permissions to your app

This recipe depends on one Flutter plugin: video_player. First, add this dependency to your project. To add the video_player package as a dependency, run flutter pub add: $ flutter pub add video_player

playing videos is a common task in app development, and Flutter apps are no exception. To play videos, the Flutter team provides the video_player plugin. You can use the video_player plugin to play videos stored on the file system, as an asset, or from the internet. This recipe demonstrates how to use the video_player package… Continue reading Play and pause a video

When displaying images using the default Image widget, you might notice they simply pop onto the screen as they’re loaded. This might feel visually jarring to your users. Instead, wouldn’t it be nice to display a placeholder at first, and images would fade in as they’re loaded? Use the FadeInImage widget for exactly this purpose.… Continue reading Fade in images with a placeholder

Create a list that scrolls horizontally rather than vertically. The ListView widget supports horizontal lists. Use the standard ListView constructor, passing in a horizontal scrollDirection, which overrides the default vertical direction. ListView(  // This next line does the trick.  scrollDirection: Axis.horizontal,  children: <Widget>[   Container(    width: 160,    color: Colors.red,   ),   Container(    width: 160,    color: Colors.blue,   ),… Continue reading Create a horizontal list