Within the app I am constructing, you may select the kind of exercise set through modal backside sheet, nevertheless, it is inflicting some visible issues (the debug console is empty). Listed here are the screenshots earlier than I do one thing, once I click on the IconButton and once I’m scrolling the listView.builder.
The code of this part just isn’t sophisticated: there’s a button that opens the modal backside sheet which incorporates a listView.builder. Its baby is a row and the row’s kids are an inkwell row (with two items of textual content) and an icon button (the query mark).
Right here is the code of the primary button:
Expanded(
baby: InkWell(
onTap: () {
showModalBottomSheet(
backgroundColor: Theme.of(context)
.colorScheme
.background
.withOpacity(.8),
context: context,
builder: (context) {
return SetTypeSelect(
voidCallback: () {
setState(() {});
},
set: set);
});
},
baby: Textual content(
widget.exercise.exerciseList[widget.exerciseIndex]
.setList[widget.index].setType.title.characters.first
.toUpperCase(),
fashion: Theme.of(context).textTheme.bodyLarge!.copyWith(
colour: setP
.getTextStyle(
widget.exercise.exerciseList[widget.exerciseIndex]
.setList[widget.index].setType.class,
context)
.colour,
fontWeight: FontWeight.daring,
),
textAlign: TextAlign.heart,
),
),
),
And the code within the modal backside sheet:
class SetTypeSelect extends StatefulWidget {
const SetTypeSelect({
tremendous.key,
required this.voidCallback,
required this.set,
});
closing VoidCallback voidCallback;
closing SetW set;
@override
State<SetTypeSelect> createState() => _SetTypeSelectState();
}
class _SetTypeSelectState extends State<SetTypeSelect> {
closing Listing<String> explText = [
'Normal Set',
'Failure Set',
'Drop Set',
'Klauster Set',
'Rest Pause',
'Warmup Set',
];
@override
Widget construct(
BuildContext context,
) {
return Container(
padding: const EdgeInsets.all(12),
baby: ListView.builder(
itemCount: setTypes.size,
itemBuilder: (context, index) => Container(
padding: const EdgeInsets.all(15),
baby: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
kids: [
InkWell(
onTap: () {
setState(() {
widget.set.setType = SetType(
title: setTypes[index],
class: SetTypes.values[index],
);
widget.voidCallback();
Navigator.of(context).pop();
});
},
baby: Row(
kids: [
SizedBox(
width: 50,
child: Text(
setTypes[index].characters.first.toUpperCase(),
fashion: fashion(context).values.elementAt(index),
textAlign: TextAlign.begin,
),
),
Textual content(
explText[index],
fashion: Theme.of(context).textTheme.bodyMedium!.copyWith(
colour: Theme.of(context).colorScheme.onBackground,
fontWeight: FontWeight.w600),
),
],
),
),
IconButton(
onPressed: () {
print('cia');
}, icon: Icon(CupertinoIcons.question_circle))
],
),
),
),
);
}
}