dynamic calc for web window

This commit is contained in:
2025-01-14 15:28:45 +02:00
parent 6dc7efc753
commit 670042bf50

View File

@@ -52,8 +52,22 @@ class _SimpleCalcState extends State<SimpleCalc> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
double width = MediaQuery.sizeOf(context).width;
double height = MediaQuery.sizeOf(context).height;
var padding = MediaQuery.paddingOf(context);
double newheight = height - padding.top - padding.bottom;
print("width: $width");
print("height: $height");
print("newheight: $newheight");
double calcWidth = 500;
if (MzanziInnovationHub.of(context)!.theme.screenType == "desktop") {
if (height < 700) {
calcWidth = 300;
}
}
return Column( return Column(
mainAxisSize: MainAxisSize.max, mainAxisAlignment: MainAxisAlignment.end,
mainAxisSize: MainAxisSize.min,
children: <Widget>[ children: <Widget>[
Text( Text(
"Simple Calculator", "Simple Calculator",
@@ -91,160 +105,177 @@ class _SimpleCalcState extends State<SimpleCalc> {
fontWeight: FontWeight.bold), fontWeight: FontWeight.bold),
), ),
), ),
GridView.builder( Container(
physics: const NeverScrollableScrollPhysics(), alignment: Alignment.centerRight,
shrinkWrap: true, child: SizedBox(
// padding: EdgeInsets.only( width: calcWidth,
// left: width / 10, child: GridView.builder(
// right: width / 10, physics: const NeverScrollableScrollPhysics(),
// bottom: height / 15, shrinkWrap: true,
// //top: 20, // padding: EdgeInsets.only(
// ), // left: width / 10,
// shrinkWrap: true, // right: width / 10,
itemCount: buttons.length, // bottom: height / 15,
gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount( // //top: 20,
crossAxisCount: 4), // ),
itemBuilder: (context, index) { // shrinkWrap: true,
// Clear Button itemCount: buttons.length,
if (index == 0) { gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
return Padding( crossAxisCount: 4,
padding: const EdgeInsets.all(4.0), //mainAxisExtent: 150,
child: MIHButton( ),
onTap: () { itemBuilder: (context, index) {
setState(() { // Clear Button
userInput = ''; if (index == 0) {
answer = '0'; return Padding(
}); padding: const EdgeInsets.all(4.0),
}, child: MIHButton(
buttonText: buttons[index], onTap: () {
buttonColor: setState(() {
MzanziInnovationHub.of(context)!.theme.messageTextColor(), userInput = '';
textColor: answer = '0';
MzanziInnovationHub.of(context)!.theme.primaryColor(), });
), },
); buttonText: buttons[index],
} buttonColor: MzanziInnovationHub.of(context)!
.theme
.messageTextColor(),
textColor:
MzanziInnovationHub.of(context)!.theme.primaryColor(),
),
);
}
// +/- button // +/- button
else if (index == 1) { else if (index == 1) {
return Padding( return Padding(
padding: const EdgeInsets.all(4.0), padding: const EdgeInsets.all(4.0),
child: MIHButton( child: MIHButton(
onTap: () { onTap: () {
setState(() { setState(() {
userInput += buttons[index]; userInput += buttons[index];
}); });
}, },
buttonText: buttons[index], buttonText: buttons[index],
buttonColor: buttonColor: MzanziInnovationHub.of(context)!
MzanziInnovationHub.of(context)!.theme.messageTextColor(), .theme
textColor: .messageTextColor(),
MzanziInnovationHub.of(context)!.theme.primaryColor(), textColor:
), MzanziInnovationHub.of(context)!.theme.primaryColor(),
); ),
} );
// % Button }
else if (index == 2) { // % Button
return Padding( else if (index == 2) {
padding: const EdgeInsets.all(4.0), return Padding(
child: MIHButton( padding: const EdgeInsets.all(4.0),
onTap: () { child: MIHButton(
setState(() { onTap: () {
userInput += buttons[index]; setState(() {
}); userInput += buttons[index];
}, });
buttonText: buttons[index], },
buttonColor: buttonText: buttons[index],
MzanziInnovationHub.of(context)!.theme.messageTextColor(), buttonColor: MzanziInnovationHub.of(context)!
textColor: .theme
MzanziInnovationHub.of(context)!.theme.primaryColor(), .messageTextColor(),
), textColor:
); MzanziInnovationHub.of(context)!.theme.primaryColor(),
} ),
// Delete Button );
else if (index == 3) { }
return Padding( // Delete Button
padding: const EdgeInsets.all(4.0), else if (index == 3) {
child: MIHButton( return Padding(
onTap: () { padding: const EdgeInsets.all(4.0),
setState(() { child: MIHButton(
userInput = userInput.substring(0, userInput.length - 1); onTap: () {
}); setState(() {
}, userInput =
buttonText: buttons[index], userInput.substring(0, userInput.length - 1);
buttonColor: });
MzanziInnovationHub.of(context)!.theme.errorColor(), },
textColor: buttonText: buttons[index],
MzanziInnovationHub.of(context)!.theme.primaryColor(), buttonColor:
), MzanziInnovationHub.of(context)!.theme.errorColor(),
); textColor:
} MzanziInnovationHub.of(context)!.theme.primaryColor(),
// Equal_to Button ),
else if (index == 18) { );
return Padding( }
padding: const EdgeInsets.all(4.0), // Equal_to Button
child: MIHButton( else if (index == 18) {
onTap: () { return Padding(
setState(() { padding: const EdgeInsets.all(4.0),
equalPressed(); child: MIHButton(
}); onTap: () {
}, setState(() {
buttonText: buttons[index], equalPressed();
buttonColor: });
MzanziInnovationHub.of(context)!.theme.successColor(), },
textColor: buttonText: buttons[index],
MzanziInnovationHub.of(context)!.theme.primaryColor(), buttonColor:
), MzanziInnovationHub.of(context)!.theme.successColor(),
); textColor:
} MzanziInnovationHub.of(context)!.theme.primaryColor(),
// +, -, / x buttons ),
else if (index == 7 || index == 11 || index == 15 || index == 19) { );
return Padding( }
padding: const EdgeInsets.all(4.0), // +, -, / x buttons
child: MIHButton( else if (index == 7 ||
onTap: () { index == 11 ||
if (answer == "0") { index == 15 ||
setState(() { index == 19) {
userInput += buttons[index]; return Padding(
}); padding: const EdgeInsets.all(4.0),
} else { child: MIHButton(
setState(() { onTap: () {
userInput = answer; if (answer == "0") {
answer = "0"; setState(() {
userInput += buttons[index]; userInput += buttons[index];
}); });
} } else {
// setState(() { setState(() {
// userInput += buttons[index]; userInput = answer;
// }); answer = "0";
}, userInput += buttons[index];
buttonText: buttons[index], });
buttonColor: }
MzanziInnovationHub.of(context)!.theme.messageTextColor(), // setState(() {
textColor: // userInput += buttons[index];
MzanziInnovationHub.of(context)!.theme.primaryColor(), // });
), },
); buttonText: buttons[index],
} buttonColor: MzanziInnovationHub.of(context)!
// other buttons .theme
else { .messageTextColor(),
return Padding( textColor:
padding: const EdgeInsets.all(4.0), MzanziInnovationHub.of(context)!.theme.primaryColor(),
child: MIHButton( ),
onTap: () { );
setState(() { }
userInput += buttons[index]; // other buttons
}); else {
}, return Padding(
buttonText: buttons[index], padding: const EdgeInsets.all(4.0),
buttonColor: child: MIHButton(
MzanziInnovationHub.of(context)!.theme.secondaryColor(), onTap: () {
textColor: setState(() {
MzanziInnovationHub.of(context)!.theme.primaryColor(), userInput += buttons[index];
), });
); },
} buttonText: buttons[index],
}, buttonColor: MzanziInnovationHub.of(context)!
.theme
.secondaryColor(),
textColor:
MzanziInnovationHub.of(context)!.theme.primaryColor(),
),
);
}
},
),
),
), ),
], ],
); );