diff --git a/lib/main.dart b/lib/main.dart index 9379fdf..3ecf36a 100644 --- a/lib/main.dart +++ b/lib/main.dart @@ -5,6 +5,8 @@ import 'package:neucalcu/models/record.dart'; import 'package:neucalcu/pages/calculator_page.dart'; import 'package:neucalcu/pages/records_page.dart'; import 'package:neucalcu/providers/calculate.dart'; +import 'package:neucalcu/themes/colors.dart'; +import 'package:neucalcu/themes/dimensions.dart'; import 'package:path_provider/path_provider.dart' as path; import 'package:provider/provider.dart'; @@ -30,15 +32,43 @@ class MyApp extends StatelessWidget { return MaterialApp( title: 'Calculator', debugShowCheckedModeBanner: false, - theme: ThemeData( - textTheme: GoogleFonts.montserratTextTheme(Theme.of(context).textTheme), - visualDensity: VisualDensity.adaptivePlatformDensity, - ), + theme: _buildAppTheme(context), initialRoute: CalculatorPage.id, routes: { - CalculatorPage.id : (context) => CalculatorPage(), - RecordsPage.id : (context) => RecordsPage(), + CalculatorPage.id: (context) => CalculatorPage(), + RecordsPage.id: (context) => RecordsPage(), }, ); } + + ThemeData _buildAppTheme(BuildContext context) { + final ThemeData base = ThemeData.light(); + + return base.copyWith( + textTheme: _appTextTheme( + GoogleFonts.montserratTextTheme(base.textTheme), + ), + visualDensity: VisualDensity.adaptivePlatformDensity); + } + + TextTheme _appTextTheme(TextTheme base) { + return base + .copyWith( + headline1: base.headline1.copyWith(fontSize: sizeHeadline1), + headline2: base.headline2.copyWith(fontSize: sizeHeadline2), + headline3: base.headline3.copyWith(fontSize: sizeHeadline3), + headline4: base.headline4.copyWith(fontSize: sizeHeadline4), + headline5: base.headline5.copyWith(fontSize: sizeHeadline5), + headline6: base.headline6.copyWith(fontSize: sizeHeadline6), + subtitle1: base.subtitle1.copyWith(fontSize: sizeSubtitle1), + subtitle2: base.subtitle2.copyWith(fontSize: sizeSubtitle2), + bodyText1: base.bodyText1.copyWith(fontSize: sizeBody1), + bodyText2: base.bodyText2.copyWith(fontSize: sizeBody2), + caption: base.caption.copyWith(fontSize: sizeCaption), + ) + .apply( + bodyColor: AppColors.primaryText, + displayColor: AppColors.secondaryText, + ); + } } diff --git a/lib/pages/calculator_page.dart b/lib/pages/calculator_page.dart index 593daff..108d041 100644 --- a/lib/pages/calculator_page.dart +++ b/lib/pages/calculator_page.dart @@ -24,11 +24,11 @@ class _CalculatorPageState extends State { return AnnotatedRegion( value: SystemUiOverlayStyle.light.copyWith( statusBarColor: Colors.transparent, - systemNavigationBarColor: AppColors.darkShadow), + systemNavigationBarColor: AppColors.primaryDark), child: Scaffold( - backgroundColor: AppColors.baseColor, + backgroundColor: AppColors.primary, body: Padding( - padding: EdgeInsets.all(16.0), + padding: EdgeInsets.all(sizeBody1), child: Column( crossAxisAlignment: CrossAxisAlignment.end, children: [ @@ -41,7 +41,7 @@ class _CalculatorPageState extends State { 'NeuCalcu', style: TextStyle( color: Colors.white54, - fontSize: sizeSubHead2, + fontSize: sizeSubtitle1, ), ), CustomIconButton( diff --git a/lib/pages/records_page.dart b/lib/pages/records_page.dart index d0bb0e1..d28b536 100644 --- a/lib/pages/records_page.dart +++ b/lib/pages/records_page.dart @@ -4,10 +4,9 @@ import 'package:neucalcu/models/record.dart'; import 'package:neucalcu/themes/colors.dart'; import 'package:neucalcu/themes/dimensions.dart'; import 'package:neucalcu/widgets/custom_icon_button.dart'; -import 'package:neucalcu/widgets/empty_data.dart'; import 'package:neucalcu/widgets/record_container.dart'; -const double _padding = 16.0; +const double _padding = sizeBody1; class RecordsPage extends StatelessWidget { static const String id = '/records'; @@ -17,7 +16,7 @@ class RecordsPage extends StatelessWidget { @override Widget build(BuildContext context) { return Scaffold( - backgroundColor: AppColors.baseColor, + backgroundColor: AppColors.primary, body: Column( children: [ SizedBox(height: 25.0), @@ -40,10 +39,7 @@ class RecordsPage extends StatelessWidget { ), Text( 'Record History', - style: TextStyle( - color: AppColors.primaryText, - fontSize: sizeSubHead2, - ), + style: Theme.of(context).textTheme.subtitle2 ), Positioned( right: 0, @@ -76,15 +72,12 @@ class RecordListViewBuilder extends StatelessWidget { @override Widget build(BuildContext context) { return Expanded( - child: ListView.builder( + child: ListView.separated( + padding: EdgeInsets.all(sizeBody1), physics: BouncingScrollPhysics(), - padding: EdgeInsets.only( - left: _padding, - right: _padding, - bottom: _padding, - ), itemCount: box.length, - itemBuilder: (context, index) { + separatorBuilder: (_, index) => SizedBox(height: 24.0), + itemBuilder: (_, index) { final Record record = box.get(index); return RecordContainer(record: record); }, @@ -92,3 +85,17 @@ class RecordListViewBuilder extends StatelessWidget { ); } } + +class EmptyData extends StatelessWidget { + @override + Widget build(BuildContext context) { + return Expanded( + child: Center( + child: Text( + 'Empty Data', + style: Theme.of(context).textTheme.headline3, + ), + ), + ); + } +} diff --git a/lib/themes/colors.dart b/lib/themes/colors.dart index 79fcd2f..3cd162e 100644 --- a/lib/themes/colors.dart +++ b/lib/themes/colors.dart @@ -6,14 +6,14 @@ class AppColors { static const int _blue = 33; static const int _brightness = 25; - static const Color baseColor = Color.fromRGBO(_red, _green, _blue, 1); - static const Color lightShadow = Color.fromRGBO( + static const Color primary = Color.fromRGBO(_red, _green, _blue, 1); + static const Color primaryLight = Color.fromRGBO( (_red + _brightness), (_green + _brightness), (_blue + _brightness), 1); - static const Color darkShadow = Color.fromRGBO( + static const Color primaryDark = Color.fromRGBO( (_red - _brightness), (_green - _brightness), (_blue - _brightness), 1); static const Color primaryText = Colors.white; static const Color secondaryText = Colors.white38; static const Color accent = Colors.amberAccent; static const Color danger = Colors.redAccent; -} \ No newline at end of file +} diff --git a/lib/themes/dimensions.dart b/lib/themes/dimensions.dart index 25dab65..b3470e8 100644 --- a/lib/themes/dimensions.dart +++ b/lib/themes/dimensions.dart @@ -1,10 +1,11 @@ -const double sizeCustom1 = 76.29; -const double sizeCustom2 = 61.04; -const double sizeDisplay = 48.83; -const double sizeHeadline1 = 39.06; -const double sizeHeadline2 = 31.25; -const double sizeSubHead1 = 25.00; -const double sizeSubHead2 = 20.00; -const double sizeBody = 16.0; -const double sizeDefault = 14.0; +const double sizeHeadline1 = 76.29; +const double sizeHeadline2 = 61.04; +const double sizeHeadline3 = 48.83; +const double sizeHeadline4 = 39.06; +const double sizeHeadline5 = 31.25; +const double sizeHeadline6 = 25.0; +const double sizeSubtitle1 = 20.0; +const double sizeSubtitle2 = 16.0; +const double sizeBody1 = 16.0; +const double sizeBody2 = 14.0; const double sizeCaption = 12.80; diff --git a/lib/themes/shadows.dart b/lib/themes/shadows.dart index e31f446..6d9c35f 100644 --- a/lib/themes/shadows.dart +++ b/lib/themes/shadows.dart @@ -1,5 +1,5 @@ import 'package:flutter/material.dart'; -import 'package:neucalcu/widgets/concave_decoration.dart'; +import 'file:///C:/AppFlutter/LuhLuh/neumorphic_calculator/lib/widgets/concave_decoration.dart'; import 'colors.dart'; @@ -12,7 +12,7 @@ ConcaveDecoration getInnerShadow({double radius = _radius}) { shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular(radius), ), - colors: [AppColors.lightShadow, AppColors.darkShadow], + colors: [AppColors.primaryLight, AppColors.primaryDark], depth: 6.0, ); } @@ -20,17 +20,17 @@ ConcaveDecoration getInnerShadow({double radius = _radius}) { BoxDecoration getOuterShadow({double radius = _radius}) { return BoxDecoration( borderRadius: BorderRadius.circular(radius), - color: AppColors.baseColor, + color: AppColors.primary, boxShadow: [ BoxShadow( blurRadius: _blurRadius, offset: -_offset, - color: AppColors.lightShadow, + color: AppColors.primaryLight, ), BoxShadow( blurRadius: _blurRadius, offset: _offset, - color: AppColors.darkShadow, + color: AppColors.primaryDark, ), ], ); diff --git a/lib/utils/formats.dart b/lib/utils/formats.dart new file mode 100644 index 0000000..e7b5936 --- /dev/null +++ b/lib/utils/formats.dart @@ -0,0 +1,9 @@ +import 'package:intl/intl.dart'; + +String getFormattedDate({String date}) { + DateTime dateTime = DateTime.parse(date); + DateFormat formatter = new DateFormat('MMMM dd, yyyy K:mm a'); + String formattedDate = formatter.format(dateTime); + + return formattedDate; +} \ No newline at end of file diff --git a/lib/widgets/button_container.dart b/lib/widgets/button_container.dart index 5365544..ca06357 100644 --- a/lib/widgets/button_container.dart +++ b/lib/widgets/button_container.dart @@ -31,12 +31,12 @@ class ButtonContainer extends StatelessWidget { CalculatorButton( text: '×', color: AppColors.accent, - fontSize: sizeHeadline1, + fontSize: sizeHeadline4, ), CalculatorButton( text: '÷', color: AppColors.accent, - fontSize: sizeHeadline1, + fontSize: sizeHeadline4, ), ], ), @@ -48,12 +48,12 @@ class ButtonContainer extends StatelessWidget { CalculatorButton( text: '+', color: AppColors.accent, - fontSize: sizeHeadline1, + fontSize: sizeHeadline4, ), CalculatorButton( text: '-', color: AppColors.accent, - fontSize: sizeHeadline1, + fontSize: sizeHeadline4, ), ], ), @@ -63,22 +63,22 @@ class ButtonContainer extends StatelessWidget { CalculatorButton( text: '(', color: AppColors.accent, - fontSize: sizeSubHead1, + fontSize: sizeHeadline6, ), CalculatorButton( text: ')', color: AppColors.accent, - fontSize: sizeSubHead1, + fontSize: sizeHeadline6, ), CalculatorButton( text: '.', color: AppColors.accent, - fontSize: sizeDisplay, + fontSize: sizeHeadline3, ), CalculatorButton( text: '=', - color: AppColors.accent, - fontSize: sizeHeadline1, + color: AppColors.danger, + fontSize: sizeHeadline4, ), ], ), diff --git a/lib/widgets/calculator_button.dart b/lib/widgets/calculator_button.dart index 11c7dd4..d4e82f2 100644 --- a/lib/widgets/calculator_button.dart +++ b/lib/widgets/calculator_button.dart @@ -14,7 +14,7 @@ class CalculatorButton extends StatefulWidget { CalculatorButton({ this.text, this.color = AppColors.primaryText, - this.fontSize = sizeSubHead2, + this.fontSize = sizeSubtitle1, }); @override diff --git a/lib/widgets/display_screen.dart b/lib/widgets/display_screen.dart index e4c9e0c..60a6bc5 100644 --- a/lib/widgets/display_screen.dart +++ b/lib/widgets/display_screen.dart @@ -10,9 +10,9 @@ class DisplayScreen extends StatelessWidget { DisplayScreen({ this.leadingText, - this.fontSizeLeading = sizeCustom1, + this.fontSizeLeading = sizeHeadline1, this.trailingText, - this.fontSizeTrailing = sizeSubHead2, + this.fontSizeTrailing = sizeSubtitle1, }); @override diff --git a/lib/widgets/empty_data.dart b/lib/widgets/empty_data.dart deleted file mode 100644 index 0e172dc..0000000 --- a/lib/widgets/empty_data.dart +++ /dev/null @@ -1,20 +0,0 @@ -import 'package:flutter/material.dart'; -import 'package:neucalcu/themes/colors.dart'; -import 'package:neucalcu/themes/dimensions.dart'; - -class EmptyData extends StatelessWidget { - @override - Widget build(BuildContext context) { - return Expanded( - child: Center( - child: Text( - 'Empty Data', - style: TextStyle( - color: AppColors.primaryText, - fontSize: sizeHeadline1, - ), - ), - ), - ); - } -} diff --git a/lib/widgets/record_container.dart b/lib/widgets/record_container.dart index f14cfdc..3442614 100644 --- a/lib/widgets/record_container.dart +++ b/lib/widgets/record_container.dart @@ -1,32 +1,25 @@ import 'package:flutter/material.dart'; -import 'package:intl/intl.dart'; import 'package:neucalcu/models/record.dart'; import 'package:neucalcu/providers/calculate.dart'; import 'package:neucalcu/themes/colors.dart'; import 'package:neucalcu/themes/dimensions.dart'; import 'package:neucalcu/themes/shadows.dart'; +import 'package:neucalcu/utils/formats.dart'; import 'package:neucalcu/widgets/display_screen.dart'; import 'package:provider/provider.dart'; -class RecordContainer extends StatefulWidget { +class RecordContainer extends StatelessWidget { final Record record; RecordContainer({this.record}); - @override - _RecordContainerState createState() => _RecordContainerState(); -} - -class _RecordContainerState extends State { - @override Widget build(BuildContext context) { return Container( - height: 112.0, + height: 120, width: double.infinity, - margin: EdgeInsets.symmetric(vertical: 8.0), child: Container( - padding: EdgeInsets.all(16.0), + padding: EdgeInsets.all(12.0), decoration: getOuterShadow(radius: 15.0), child: Column( crossAxisAlignment: CrossAxisAlignment.end, @@ -34,7 +27,7 @@ class _RecordContainerState extends State { Row( children: [ Text( - getFormattedDate(date: widget.record.date), + getFormattedDate(date: record.date), style: TextStyle(color: AppColors.accent), ), ], @@ -42,17 +35,18 @@ class _RecordContainerState extends State { SizedBox(height: 8.0), Expanded( child: GestureDetector( - onTap: (){ + onTap: () { context.read().getDataFromRecords( - answer: widget.record.answer, - equation: widget.record.equation, - date: widget.record.date); + answer: record.answer, + equation: record.equation, + date: record.date, + ); Navigator.pop(context); }, child: DisplayScreen( - leadingText: widget.record.answer, - fontSizeLeading: sizeHeadline2, - trailingText: widget.record.equation, + leadingText: record.answer, + fontSizeLeading: sizeHeadline5, + trailingText: record.equation, ), ), ), @@ -61,12 +55,4 @@ class _RecordContainerState extends State { ), ); } - - String getFormattedDate({String date}) { - DateTime dateTime = DateTime.parse(date); - DateFormat formatter = new DateFormat('MMMM dd, yyyy'); - String formattedDate = formatter.format(dateTime); - - return formattedDate; - } } diff --git a/pubspec.yaml b/pubspec.yaml index 17dffc0..044cfdf 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -3,7 +3,7 @@ description: A new Flutter application. publish_to: 'none' -version: 1.1.1+4 +version: 1.1.2+5 environment: sdk: ">=2.7.0 <3.0.0"