Why deployment reaches users in Flutter - Test Your Understanding

Practice - 5 Tasks

1fill in blank

easy

Complete the code to show a simple Flutter app with a text widget.

Flutter

import 'package:flutter/material.dart';

void main() {
  runApp([1]);
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Center(
          child: Text('Hello Users!'),
        ),
      ),
    );
  }
}

Drag options to blanks, or click blank then click option'

AScaffold()

BMaterialApp()

CMyApp()

DText('Hello')

Attempts:

3 left

💡 Hint

Common Mistakes

Passing MaterialApp() directly to runApp instead of the root widget.

Passing a widget that is not the app root.

The runApp function needs to receive the root widget of the app, which is MyApp().

2fill in blank

medium

Complete the code to navigate from HomeScreen to DetailScreen when a button is pressed.

Flutter

ElevatedButton(
  onPressed: () {
    Navigator.of(context).[1](
      MaterialPageRoute(builder: (context) => DetailScreen()),
    );
  },
  child: Text('Go to Details'),
)

Drag options to blanks, or click blank then click option'

ApopAndPushNamed

Bpop

Creplace

Dpush

Attempts:

3 left

💡 Hint

Common Mistakes

Using pop instead of push, which goes back instead of forward.

Using replace which is not a Navigator method.

Navigator.push is used to move to a new screen by adding it on top of the stack.

3fill in blank

hard

Fix the error in the code to correctly update the UI when a button is pressed.

Flutter

class CounterWidget extends StatefulWidget {
  @override
  _CounterWidgetState createState() => _CounterWidgetState();
}

class _CounterWidgetState extends State<CounterWidget> {
  int count = 0;

  void increment() {
    [1](() {
      count += 1;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Text('Count: $count'),
        ElevatedButton(onPressed: increment, child: Text('Add')),
      ],
    );
  }
}

Drag options to blanks, or click blank then click option'

AsetState

BupdateUI

Crebuild

Drefresh

Attempts:

3 left

💡 Hint

Common Mistakes

Not calling setState, so UI does not update.

Using a non-existent method like updateUI.

In Flutter, setState tells the framework to redraw the widget with updated data.

4fill in blank

hard

Complete the code to create a map of word lengths for words longer than 3 characters.

Flutter

final words = ['apple', 'bat', 'cat', 'doggy'];
final lengths = {for (final word in words) if (word.length [1] 3) word: word.length};

Drag options to blanks, or click blank then click option'

A:

B>

C<

D=

Attempts:

3 left

💡 Hint

Common Mistakes

Using '=' instead of ':' in map.

Using '<' instead of '>' for filtering.

The map uses ':' to assign keys to values, and the condition filters words longer than 3.

5fill in blank

hard

Fill all three blanks to create a dictionary comprehension filtering positive values and uppercasing keys.

Flutter

final data = {'a': 1, 'b': -2, 'c': 3};
final result = {for (final (k, v) in data.entries) if (v [3] 0) [1]: [2] };

Drag options to blanks, or click blank then click option'

Ak.toUpperCase()

Bv

C>

Dk

Attempts:

3 left

💡 Hint

Common Mistakes

Not uppercasing keys.

Using '<' instead of '>' in condition.

Swapping keys and values.

Keys are uppercased, values kept as is, and only positive values (v > 0) are included.