From 670042bf50a84b26e8d356fd3bddc53abf119800 Mon Sep 17 00:00:00 2001 From: yaso Date: Tue, 14 Jan 2025 15:28:45 +0200 Subject: [PATCH] dynamic calc for web window --- .../mih_packages/calculator/simple_calc.dart | 339 ++++++++++-------- 1 file changed, 185 insertions(+), 154 deletions(-) diff --git a/Frontend/lib/mih_packages/calculator/simple_calc.dart b/Frontend/lib/mih_packages/calculator/simple_calc.dart index 4e580be9..24bc2f15 100644 --- a/Frontend/lib/mih_packages/calculator/simple_calc.dart +++ b/Frontend/lib/mih_packages/calculator/simple_calc.dart @@ -52,8 +52,22 @@ class _SimpleCalcState extends State { @override 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( - mainAxisSize: MainAxisSize.max, + mainAxisAlignment: MainAxisAlignment.end, + mainAxisSize: MainAxisSize.min, children: [ Text( "Simple Calculator", @@ -91,160 +105,177 @@ class _SimpleCalcState extends State { fontWeight: FontWeight.bold), ), ), - GridView.builder( - physics: const NeverScrollableScrollPhysics(), - shrinkWrap: true, - // padding: EdgeInsets.only( - // left: width / 10, - // right: width / 10, - // bottom: height / 15, - // //top: 20, - // ), - // shrinkWrap: true, - itemCount: buttons.length, - gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount( - crossAxisCount: 4), - itemBuilder: (context, index) { - // Clear Button - if (index == 0) { - return Padding( - padding: const EdgeInsets.all(4.0), - child: MIHButton( - onTap: () { - setState(() { - userInput = ''; - answer = '0'; - }); - }, - buttonText: buttons[index], - buttonColor: - MzanziInnovationHub.of(context)!.theme.messageTextColor(), - textColor: - MzanziInnovationHub.of(context)!.theme.primaryColor(), - ), - ); - } + Container( + alignment: Alignment.centerRight, + child: SizedBox( + width: calcWidth, + child: GridView.builder( + physics: const NeverScrollableScrollPhysics(), + shrinkWrap: true, + // padding: EdgeInsets.only( + // left: width / 10, + // right: width / 10, + // bottom: height / 15, + // //top: 20, + // ), + // shrinkWrap: true, + itemCount: buttons.length, + gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount( + crossAxisCount: 4, + //mainAxisExtent: 150, + ), + itemBuilder: (context, index) { + // Clear Button + if (index == 0) { + return Padding( + padding: const EdgeInsets.all(4.0), + child: MIHButton( + onTap: () { + setState(() { + userInput = ''; + answer = '0'; + }); + }, + buttonText: buttons[index], + buttonColor: MzanziInnovationHub.of(context)! + .theme + .messageTextColor(), + textColor: + MzanziInnovationHub.of(context)!.theme.primaryColor(), + ), + ); + } - // +/- button - else if (index == 1) { - return Padding( - padding: const EdgeInsets.all(4.0), - child: MIHButton( - onTap: () { - setState(() { - userInput += buttons[index]; - }); - }, - buttonText: buttons[index], - buttonColor: - MzanziInnovationHub.of(context)!.theme.messageTextColor(), - textColor: - MzanziInnovationHub.of(context)!.theme.primaryColor(), - ), - ); - } - // % Button - else if (index == 2) { - return Padding( - padding: const EdgeInsets.all(4.0), - child: MIHButton( - onTap: () { - setState(() { - userInput += buttons[index]; - }); - }, - buttonText: buttons[index], - buttonColor: - MzanziInnovationHub.of(context)!.theme.messageTextColor(), - textColor: - MzanziInnovationHub.of(context)!.theme.primaryColor(), - ), - ); - } - // Delete Button - else if (index == 3) { - return Padding( - padding: const EdgeInsets.all(4.0), - child: MIHButton( - onTap: () { - setState(() { - userInput = userInput.substring(0, userInput.length - 1); - }); - }, - buttonText: buttons[index], - 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), - child: MIHButton( - onTap: () { - setState(() { - equalPressed(); - }); - }, - buttonText: buttons[index], - 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), - child: MIHButton( - onTap: () { - if (answer == "0") { - setState(() { - userInput += buttons[index]; - }); - } else { - setState(() { - userInput = answer; - answer = "0"; - userInput += buttons[index]; - }); - } - // setState(() { - // userInput += buttons[index]; - // }); - }, - buttonText: buttons[index], - buttonColor: - MzanziInnovationHub.of(context)!.theme.messageTextColor(), - textColor: - MzanziInnovationHub.of(context)!.theme.primaryColor(), - ), - ); - } - // other buttons - else { - return Padding( - padding: const EdgeInsets.all(4.0), - child: MIHButton( - onTap: () { - setState(() { - userInput += buttons[index]; - }); - }, - buttonText: buttons[index], - buttonColor: - MzanziInnovationHub.of(context)!.theme.secondaryColor(), - textColor: - MzanziInnovationHub.of(context)!.theme.primaryColor(), - ), - ); - } - }, + // +/- button + else if (index == 1) { + return Padding( + padding: const EdgeInsets.all(4.0), + child: MIHButton( + onTap: () { + setState(() { + userInput += buttons[index]; + }); + }, + buttonText: buttons[index], + buttonColor: MzanziInnovationHub.of(context)! + .theme + .messageTextColor(), + textColor: + MzanziInnovationHub.of(context)!.theme.primaryColor(), + ), + ); + } + // % Button + else if (index == 2) { + return Padding( + padding: const EdgeInsets.all(4.0), + child: MIHButton( + onTap: () { + setState(() { + userInput += buttons[index]; + }); + }, + buttonText: buttons[index], + buttonColor: MzanziInnovationHub.of(context)! + .theme + .messageTextColor(), + textColor: + MzanziInnovationHub.of(context)!.theme.primaryColor(), + ), + ); + } + // Delete Button + else if (index == 3) { + return Padding( + padding: const EdgeInsets.all(4.0), + child: MIHButton( + onTap: () { + setState(() { + userInput = + userInput.substring(0, userInput.length - 1); + }); + }, + buttonText: buttons[index], + 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), + child: MIHButton( + onTap: () { + setState(() { + equalPressed(); + }); + }, + buttonText: buttons[index], + 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), + child: MIHButton( + onTap: () { + if (answer == "0") { + setState(() { + userInput += buttons[index]; + }); + } else { + setState(() { + userInput = answer; + answer = "0"; + userInput += buttons[index]; + }); + } + // setState(() { + // userInput += buttons[index]; + // }); + }, + buttonText: buttons[index], + buttonColor: MzanziInnovationHub.of(context)! + .theme + .messageTextColor(), + textColor: + MzanziInnovationHub.of(context)!.theme.primaryColor(), + ), + ); + } + // other buttons + else { + return Padding( + padding: const EdgeInsets.all(4.0), + child: MIHButton( + onTap: () { + setState(() { + userInput += buttons[index]; + }); + }, + buttonText: buttons[index], + buttonColor: MzanziInnovationHub.of(context)! + .theme + .secondaryColor(), + textColor: + MzanziInnovationHub.of(context)!.theme.primaryColor(), + ), + ); + } + }, + ), + ), ), ], );