0
0
Fluttermobile~20 mins

ThemeData configuration in Flutter - Practice Problems & Coding Challenges

Choose your learning style9 modes available
LearnWhyDeepUITryChallengeBuildRecallPublish
Challenge - 5 Problems
🎖️
ThemeData Master
Get all challenges correct to earn this badge!
Test your skills under time pressure!
❓ ui_behavior
intermediate
2:00remaining
What color will the AppBar background be?
Given this Flutter ThemeData configuration, what color will the AppBar background show?
Flutter
ThemeData(
  primaryColor: Colors.green,
  appBarTheme: AppBarTheme(
    backgroundColor: Colors.red,
  ),
)
AGreen
BRed
CBlue
DDefault grey
Attempts:
2 left
💡 Hint
AppBarTheme backgroundColor overrides primaryColor for AppBar.
📝 Syntax
intermediate
2:00remaining
Identify the syntax error in ThemeData usage
Which option contains a syntax error in ThemeData configuration?
AThemeData(primaryColor: Colors.blue, brightness: Brightness.dark)
BThemeData(primaryColor: Colors.blue, textTheme: TextTheme(bodyText1: TextStyle(fontSize: 16)))
CThemeData(primaryColor Colors.blue, accentColor: Colors.amber)
DThemeData(primaryColor: Colors.blue, accentColor: Colors.amber)
Attempts:
2 left
💡 Hint
Check for missing colons between property names and values.
❓ lifecycle
advanced
2:00remaining
When does ThemeData update take effect in Flutter?
If you change ThemeData in a Flutter app's MaterialApp dynamically, when will the new theme apply?
AAfter hot reload but not hot restart
BOnly after app restart
COnly after navigating to a new screen
DImmediately after setState triggers rebuild
Attempts:
2 left
💡 Hint
ThemeData is part of widget tree and rebuilds with setState.
🔧 Debug
advanced
2:00remaining
Why does the Text color not change with ThemeData?
You set ThemeData with primaryColor: Colors.red and textTheme with bodyText1 color blue, but Text widgets still show black. Why?
Flutter
ThemeData(
  primaryColor: Colors.red,
  textTheme: TextTheme(
    bodyText1: TextStyle(color: Colors.blue),
  ),
)

// Text widget:
Text('Hello World')
AText widget must specify style: Theme.of(context).textTheme.bodyText1 explicitly
BText widget uses default style, ignoring textTheme.bodyText1
CprimaryColor overrides textTheme colors always
DText color is black because ThemeData is not applied
Attempts:
2 left
💡 Hint
Text widget uses default style unless told to use theme style.
🧠 Conceptual
expert
2:00remaining
What is the effect of brightness in ThemeData?
What does setting brightness: Brightness.dark in ThemeData do in a Flutter app?
AIt switches the app to use dark mode colors and adjusts default widget colors accordingly
BIt only changes the background color to black but leaves other colors unchanged
CIt has no effect unless combined with primaryColor
DIt disables all colors and makes the app grayscale
Attempts:
2 left
💡 Hint
Brightness controls overall light or dark theme mode.