Classes and objects in Flutter - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ ui_behavior

intermediate

What is the output of this Flutter widget?

Consider this Flutter code defining a class and using it in a widget. What text will appear on the screen?

Flutter

class Person {
  final String name;
  Person(this.name);
}

class MyWidget extends StatelessWidget {
  final Person person = Person('Alice');

  @override
  Widget build(BuildContext context) {
    return Text(person.name);
  }
}

A Alice

B person.name

C null

D Error: name not found

💡 Hint

Look at how the Person class stores the name and how the Text widget uses it.

The Person class stores the name 'Alice'. The Text widget displays person.name, so it shows 'Alice'.

🧠 Conceptual

intermediate

What does this Dart class constructor do?

Look at this Dart class constructor. What is its purpose?

Flutter

class Car {
  String model;
  int year;

  Car(this.model, this.year);
}

A It creates a Car object but leaves model and year null.

B It creates a Car object and sets model and year from parameters.

C It creates a Car object with default model and year values.

D It creates a Car object but requires setters to assign model and year.

💡 Hint

The constructor uses 'this' to assign parameters to fields.

The constructor Car(this.model, this.year) assigns the passed arguments to the object's fields.

❓ lifecycle

advanced

What happens when this Flutter StatefulWidget is created?

Examine this Flutter StatefulWidget code. What is printed when the widget is first inserted into the widget tree?

Flutter

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

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

  @override
  void initState() {
    super.initState();
    print('Init count: $count');
  }

  @override
  Widget build(BuildContext context) {
    return Text('Count: $count');
  }
}

A No output printed

B Count: 0

C Init count: null

D Init count: 0

💡 Hint

initState runs once when the widget is created before build.

initState prints 'Init count: 0' because count is initialized to 0 before build runs.

📝 Syntax

advanced

Which option correctly defines a Dart class with a named constructor?

Select the correct Dart code that defines a class with a named constructor called 'fromJson'.

A

class User {
  String name;
  User.fromJson(Map<String, dynamic> json) {
    name = json['name'];
  }
}

B

class User {
  String name;
  User.fromJson(Map<String, dynamic> json) => name = json['name'];
}

C

class User {
  String name;
  User.fromJson(Map<String, dynamic> json) {
    return name = json['name'];
  }
}

D

class User {
  String name;
  User.fromJson(Map<String, dynamic> json) => {
    name = json['name'];
  };
}

💡 Hint

Named constructors use the class name dot constructor name syntax with a body.

Option A correctly defines a named constructor with a body that assigns the name field.

🔧 Debug

expert

Why does this Flutter code cause a runtime error?

This Flutter code tries to display a person's age but crashes at runtime. Why?

Flutter

class Person {
  int? age;
  Person(this.age);
}

class AgeWidget extends StatelessWidget {
  final Person person = Person(null);

  @override
  Widget build(BuildContext context) {
    return Text('Age: ' + person.age!.toString());
  }
}

A The '+' operator cannot concatenate String and int.

B The Person class must initialize age with a non-null value.

C person.age is null, so person.age!.toString() causes a runtime error.

D StatelessWidget cannot have final fields.

💡 Hint

Consider null safety and the non-null assertion operator when accessing nullable fields.

person.age is null. The expression person.age!.toString() uses the non-null assertion operator '!' on a null value, causing a runtime error: "Null check operator used on a null value".

Practice

1. What is a class in Flutter programming?

easy

A. A type of widget

B. A blueprint to create objects

C. A function that runs the app

D. A variable that stores data

Solution

1. Step 1: Understand the role of a class

   A class defines a template or blueprint for creating objects with properties and behaviors.

2. Step 2: Differentiate from other concepts

   Widgets, functions, and variables serve different purposes; only a class is a blueprint for objects.

3. Final Answer:

   A blueprint to create objects -> Option B

4. Quick Check:

   Class = blueprint for objects [OK]

Hint: Classes define blueprints, not widgets or variables [OK]

Common Mistakes:

• Confusing classes with widgets
• Thinking classes are functions
• Mixing classes with variables

2. Which of the following is the correct way to define a simple class named Car in Dart?

easy

A. function Car() { }

B. Car class { }

C. def Car() { }

D. class Car { }

Solution

1. Step 1: Recall Dart class syntax

   In Dart, classes are defined using the keyword class followed by the class name and curly braces.

2. Step 2: Check each option

   Only class Car { } uses the correct Dart syntax: class Car { }. Others use incorrect keywords or syntax.

3. Final Answer:

   class Car { } -> Option D

4. Quick Check:

   Dart class syntax = class Name { } [OK]

Hint: Use 'class' keyword followed by name and braces [OK]

Common Mistakes:

• Using 'def' or 'function' instead of 'class'
• Placing 'class' after the name
• Missing curly braces

3. What will be the output of this Dart code?

class Dog {
  String name;
  Dog(this.name);
  void bark() {
    print('Woof! My name is $name');
  }
}

void main() {
  var dog = Dog('Buddy');
  dog.bark();
}

medium

A. Woof! My name is Buddy

B. Woof! My name is dog

C. Error: Missing constructor

D. Nothing is printed

Solution

1. Step 1: Understand the class and constructor

   The class Dog has a constructor that sets the name property to 'Buddy'.

2. Step 2: Analyze the bark method call

   The bark() method prints 'Woof! My name is ' followed by the dog's name, which is 'Buddy'.

3. Final Answer:

   Woof! My name is Buddy -> Option A

4. Quick Check:

   dog.bark() prints name set by constructor [OK]

Hint: Constructor sets name; bark prints it [OK]

Common Mistakes:

• Assuming default constructor without parameters
• Forgetting string interpolation syntax
• Expecting no output without main()

4. Identify the error in this Dart class definition:

class Person {
  String name
  int age;

  Person(this.name, this.age);
}

medium

A. Missing semicolon after 'String name'

B. Constructor syntax is wrong

C. Class name should be lowercase

D. No error, code is correct

Solution

1. Step 1: Check property declarations

   The line String name is missing a semicolon at the end, which is required in Dart.

2. Step 2: Verify constructor and class name

   The constructor syntax is correct, and class names start with uppercase by convention, so no error there.

3. Final Answer:

   Missing semicolon after 'String name' -> Option A

4. Quick Check:

   Every property line needs a semicolon [OK]

Hint: Check each line ends with a semicolon [OK]

Common Mistakes:

• Ignoring missing semicolons
• Thinking constructor syntax is wrong
• Confusing naming conventions with errors

5. You want to create a class Book that stores a title and author, and has a method describe() that returns a string like "Title by Author". Which code correctly implements this?

hard

A. class Book {
String title, author;
Book(this.title, this.author);
String describe() {
print('$title by $author');
}
}

B. class Book {
String title, author;
Book(this.title, this.author);
void describe() {
print('$title by $author');
}
}

C. class Book {
String title, author;
Book(this.title, this.author);
String describe() {
return '$title by $author';
}
}

D. class Book {
String title, author;
Book(this.title, this.author);
describe() {
print('$title by $author');
}
}

Solution

1. Step 1: Check method return type and behavior

   The method describe() should return a string, so its return type must be String and it must use return.

2. Step 2: Analyze each option

   class Book { String title, author; Book(this.title, this.author); String describe() { return '$title by $author'; } } correctly returns the string. class Book { String title, author; Book(this.title, this.author); void describe() { print('$title by $author'); } } returns void and prints instead of returning. class Book { String title, author; Book(this.title, this.author); String describe() { print('$title by $author'); } } returns String but uses print, which returns void. class Book { String title, author; Book(this.title, this.author); describe() { print('$title by $author'); } } omits return type and prints instead of returning a string.

3. Final Answer:

   class Book { String title, author; Book(this.title, this.author); String describe() { return '$title by $author'; } } -> Option C

4. Quick Check:

   Method returns string with return keyword [OK]

Hint: Use return with correct type for methods [OK]

Common Mistakes:

• Using print instead of return
• Omitting return type
• Returning void when string expected