I have a row that contains children of
- custom checkbox widget
- text widget
I wish for the text to be aligned with the checkbox so that the centre of the letters aligns with the centre of the checkbox, however no matter what I try it seems that centre alignment on cross axis or with the Align function just centres the bottom of the letters with the centre of the checkbox how can I resolve this?:
my row in the body:
Row(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
CustomCheckbox(
value: _check,
onChanged: (value) {
print(_check)
},
),
const SizedBox(width: 10),
Container(
height: MediaQuery.of(context).size.width * .06,
alignment: Alignment.center,
child: Text(
textAlign: TextAlign.center,
'Check Here',
),
),
],
),
my custom widget:
import ‘package:flutter/material.dart’;
import ‘package:scytale_controls_app/classes/custom_theme_extension.dart’;
class CustomCheckbox extends StatelessWidget {
final bool value;
final ValueChanged<bool?> onChanged;
const CustomCheckbox({
Key? key,
required this.value,
required this.onChanged,
}) : super(key: key);
@override
Widget build(BuildContext context) {
final customThemeElements = Theme.of(context).extension<CustomThemeElements>();
final double screenSize = MediaQuery.of(context).size.width;
return GestureDetector(
onTap: () {
onChanged(!value);
},
child: Container(
width: screenSize * 0.05,
height: screenSize * 0.05,
child: value
? Center(
child: Image.asset(
checkMark!,
width: screenSize * 0.03,
),
)
: null,
),
);
}
}