I encountered 2 most important issues when theming the scaffold of my app:
Look first on the app bar and you’ll see it is a colour completely different from the scaffold (one thing like my major colour with opacity) though I designed it to be just like the scaffold. The second drawback is that on the backside of the scaffold there’s a part not styled (possibly as a result of I am utilizing a SafeArea idk).
Right here is the Theme knowledge I am utilizing:
last theme = ThemeData(
useMaterial3: true,
colorScheme: const ColorScheme(
brightness: Brightness.gentle,
major: Coloration.fromRGBO(248, 95, 106, 1),
onPrimary: Colours.white,
secondary: Coloration.fromRGBO(167, 183, 216, 1),
onSecondary: Colours.white,
error: Colours.purple,
onError: Colours.white,
background: Coloration.fromARGB(240, 252, 251, 244),
onBackground: Colours.black,
floor: Colours.black45,
onSurface: Colours.black,
),
);
And right here is the code of the display screen:
import 'bundle:flutter/materials.dart';
import 'bundle:jimprova/fashions/workout_model.dart';
import 'bundle:jimprova/widgets/coaching/exercise_training_card.dart';
class TrainingScreen extends StatefulWidget {
const TrainingScreen({
tremendous.key,
required this.exercise,
});
last Exercise exercise;
@override
State<TrainingScreen> createState() => _TrainingScreenState();
}
class _TrainingScreenState extends State<TrainingScreen> {
int indexEx = 0;
@override
Widget construct(BuildContext context) {
return Scaffold(
appBar: AppBar(
backgroundColor: Theme.of(context).colorScheme.background,
title: Textual content(
widget.exercise.title,
type: Theme.of(context).textTheme.titleLarge!.copyWith(
colour: Theme.of(context).colorScheme.onBackground,
fontWeight: FontWeight.daring,
),
),
),
physique: SafeArea(
baby: Stack(
kids: [
SingleChildScrollView(
// rest of the code... (there are only rows, columns and a listview.builder)
],
),
),
),
],
),
),
);
}
}