Merge pull request #11 from Open-Source-Agriculture/autoSize

Auto size

lib/screens/home/add_sample.dart

@@ -12,6 +12,7 @@ import '../../models/texture_models.dart';
 import 'package:geolocator/geolocator.dart';
 import '../../widgets/add_sample_widgets.dart';
 import 'loading.dart';
+import '../../services/sizes_helper.dart';
 
 void main() => runApp(MyApp());
 
@@ -141,44 +142,46 @@ class _AddSamplePageState extends State<AddSamplePage> {
         elevation: 2.0,
       ),
       body: Padding(
-        padding: const EdgeInsets.all(17.0),
+        padding: const EdgeInsets.all(17),
         child: Wrap(
           runSpacing: 17,
           children: <Widget>[
             Text(
               'Soil Texture',
-              style: TextStyle(
-                fontSize: 20,
-              ),
+              style: headingTextStyle(context),
             ),
-            Container(
-              height: 180,
-              child: GridView.count(
-                childAspectRatio: (3 / 1),
-                crossAxisCount: 3,
-                children: AusClassification()
-                    .getTextureList()
-                    .map((texture) => TextureButton(
-                          textureClass: texture,
-                          setTextureFunction: setTexture,
-                        ))
-                    .toList(),
-              ),
+            GridView.count(
+              physics: NeverScrollableScrollPhysics(),
+              shrinkWrap: true,
+              childAspectRatio: (3 / 1),
+              crossAxisCount: 3,
+              children: AusClassification()
+                  .getTextureList()
+                  .map((texture) => TextureButton(
+                        textureClass: texture,
+                        setTextureFunction: setTexture,
+                      ))
+                  .toList(),
             ),
             Text(
               'Depth Range',
-              style: TextStyle(
-                fontSize: 20,
-              ),
+              style: headingTextStyle(context),
             ),
             Row(
               children: [
-                Text('Upper depth: '),
+                Text('Upper depth: ',
+                  style: bodyTextStyle(context),
+                ),
                 ConstrainedBox(
-                  constraints: BoxConstraints.tight(Size(55, 25)),
+                  constraints: BoxConstraints.tight(Size((0.06 * displayHeight(context)), (0.035 * displayHeight(context)))),
                   child: TextFormField(
+                    style: bodyTextStyle(context),
                     maxLength: 3,
-                    decoration: InputDecoration(counterText: ''),
+                    decoration: InputDecoration(
+                      counterText: '',
+                      border: InputBorder.none,
+                      filled: true,
+                    ),
                     controller: txt2,
                     autovalidateMode: AutovalidateMode.always,
                     keyboardType: TextInputType.number,
@@ -194,12 +197,19 @@ class _AddSamplePageState extends State<AddSamplePage> {
             ),
             Row(
               children: [
-                Text('Lower depth: '),
+                Text('Lower depth: ',
+                  style: bodyTextStyle(context),
+                ),
                 ConstrainedBox(
-                  constraints: BoxConstraints.tight(Size(55, 25)),
+                  constraints: BoxConstraints.tight(Size((0.06 * displayHeight(context)), (0.035 * displayHeight(context)))),
                   child: TextFormField(
+                    style: bodyTextStyle(context),
                     maxLength: 3,
-                    decoration: InputDecoration(counterText: ''),
+                    decoration: InputDecoration(
+                      counterText: '',
+                      border: InputBorder.none,
+                      filled: true,
+                    ),
                     controller: txt3,
                     autovalidateMode: AutovalidateMode.always,
                     keyboardType: TextInputType.number,
@@ -215,18 +225,23 @@ class _AddSamplePageState extends State<AddSamplePage> {
             ),
             Text(
               'Sample ID',
-              style: TextStyle(
-                fontSize: 20,
-              ),
+              style: headingTextStyle(context),
             ),
             Row(
               children: [
-                Text('ID: '),
+                Text('ID: ',
+                style: bodyTextStyle(context),
+                ),
                 ConstrainedBox(
-                  constraints: BoxConstraints.tight(Size(100, 25)),
+                  constraints: BoxConstraints.tight(Size((0.1 * displayHeight(context)), (0.035 * displayHeight(context)))),
                   child: TextFormField(
+                    style: bodyTextStyle(context),
                     maxLength: 5,
-                    decoration: InputDecoration(counterText: ''),
+                    decoration: InputDecoration(
+                      counterText: '',
+                      border: InputBorder.none,
+                      filled: true,
+                    ),
                     controller: txt4,
                     autovalidateMode: AutovalidateMode.always,
                     keyboardType: TextInputType.number,
@@ -250,8 +265,12 @@ class _AddSamplePageState extends State<AddSamplePage> {
         ),
       ),
       floatingActionButton: FloatingActionButton.extended(
-        label: Text('Submit'),
-        icon: Icon(Icons.done),
+        label: Text('Submit',
+          style: headingTextStyle(context),
+        ),
+        icon: Icon(Icons.done,
+          size: displayWidth(context) * 0.04,
+        ),
         elevation: 2,
         onPressed: () {
           Navigator.push(

lib/screens/home/credits.dart

@@ -35,25 +35,25 @@ class _CreditsState extends State<Credits> {
           children: [
             Text(
                 'Thank you for using Soil Mate!',
-              style: buttonTextStyle(),
+              style: headingTextStyle(context),
             ),
             Text('To keep the development of the app free and open-source, please consider supporting us.',
-            style: bodyTextStyle(),
+            style: bodyTextStyle(context),
             ),
             LinksTile(),
             Row(
               mainAxisAlignment: MainAxisAlignment.spaceBetween,
               children: [
                 Container(
-                  width: 250,
+                  width: (displayWidth(context)*0.5),
                   child: Text(
                     'This app was developed by Open Source Agriculture. We are siblings who are passionate about agriculture and open-source.',
-                    style: bodyTextStyle(),
+                    style: bodyTextStyle(context),
                   ),
                 ),
                 Container(
-                  width: 100,
-                  height: 100,
+                  width: (displayWidth(context)*0.3),
+                  height: (displayWidth(context)*0.3),
                   decoration: BoxDecoration(
                     border: Border.all(
                       color: Colors.black,
@@ -75,19 +75,3 @@ class _CreditsState extends State<Credits> {
 }
 
 
-buttonTextStyle() {
-  return TextStyle(
-  fontFamily: 'Dosis',
-  fontWeight: FontWeight.w900,
-  fontSize: 20,
-  );
-}
-
-bodyTextStyle() {
-  return TextStyle(
-    fontFamily: 'Dosis',
-    fontWeight: FontWeight.w900,
-    fontSize: 16,
-  );
-}
-

lib/services/sizes_helper.dart

@@ -0,0 +1,52 @@
+import 'package:flutter/material.dart';
+
+// Note: Text Styles are also held in this file
+
+Size displaySize(BuildContext context) {
+  //debugPrint('Size = ' + MediaQuery.of(context).size.toString());
+  return MediaQuery.of(context).size;
+}
+
+double displayHeight(BuildContext context) {
+  //debugPrint('Height = ' + displaySize(context).height.toString());
+  return displaySize(context).height;
+}
+
+double displayWidth(BuildContext context) {
+  //debugPrint('Width = ' + displaySize(context).width.toString());
+  return displaySize(context).width;
+}
+
+bodyTextStyle(context) {
+  return TextStyle(
+    fontFamily: 'Roboto',
+    fontWeight: FontWeight.w300,
+    fontSize: displayWidth(context) * 0.04,
+  );
+}
+
+headingTextStyle(context) {
+  return TextStyle(
+    fontFamily: 'Roboto',
+    fontWeight: FontWeight.w400,
+  fontSize: displayWidth(context) * 0.06,
+  );
+}
+
+creditsButtonTextStyle(context) {
+  return TextStyle(
+    fontFamily: 'Roboto',
+    fontWeight: FontWeight.w300,
+    fontSize: displayWidth(context) * 0.06,
+  );
+}
+
+textureButtonTextStyle(context) {
+  return TextStyle(
+    fontFamily: 'Roboto',
+    fontWeight: FontWeight.w300,
+    fontSize: displayWidth(context) * 0.035,
+  );
+}
+
+

lib/widgets/credits_links_tile.dart

@@ -1,6 +1,8 @@
 import 'package:flutter/material.dart';
 import 'package:soil_mate/screens/home/credits.dart';
 import 'package:url_launcher/url_launcher.dart';
+import '../services/sizes_helper.dart';
+export '../services/sizes_helper.dart';
 
 class LinksTile extends StatefulWidget {
 
@@ -12,46 +14,45 @@ class _LinksTileState extends State<LinksTile> {
   int index;
 
   List<LinkList> links = [
-    LinkList(url: 'https://discord.gg/8x58DuxfGz', label: 'Join our community on Discord', image: 'discord_logo.jpg'),
+    LinkList(url: 'https://discord.gg/8x58DuxfGz', label: 'Join us on Discord', image: 'discord_logo.jpg'),
     LinkList(url: 'https://www.patreon.com/opensourceagriculture', label: 'Support our Patreon', image: 'patreon_logo.png'),
     LinkList(url: 'https://github.com/Open-Source-Agriculture', label: 'Check us out on GitHub', image: 'github_logo.png'),
     LinkList(url: 'https://open-source-agriculture.github.io', label: 'Explore our website', image: 'website_logo.png'),
   ];
 
   @override
   Widget build(BuildContext context) {
-    return Container(
-      height: 300,
-      child: ListView.builder(
-          itemCount: links.length,
-          itemBuilder: (context, index){
-            return Padding(
-              padding: const EdgeInsets.only(top: 10.0),
-              child: Container(
-                decoration: BoxDecoration(
-                  borderRadius: BorderRadius.circular(15),
-                  border: Border.all(color: Colors.black, width: 1.0),
+    return ListView.builder(
+      physics: NeverScrollableScrollPhysics(),
+        shrinkWrap: true,
+        itemCount: links.length,
+        itemBuilder: (context, index){
+          return Padding(
+            padding: const EdgeInsets.only(top: 10.0),
+            child: Container(
+              decoration: BoxDecoration(
+                borderRadius: BorderRadius.circular(15),
+                border: Border.all(color: Colors.black, width: 1.0),
+              ),
+              child: ListTile(
+                onTap: () async {
+                  if (await canLaunch(links[index].url)) {
+                    await launch(links[index].url);
+                  } else {
+                    throw 'Could not launch ${links[index].url}';
+                  }
+                },
+                title: Text(links[index].label,
+                  style: creditsButtonTextStyle(context),
                 ),
-                child: ListTile(
-                  onTap: () async {
-                    if (await canLaunch(links[index].url)) {
-                      await launch(links[index].url);
-                    } else {
-                      throw 'Could not launch ${links[index].url}';
-                    }
-                  },
-                  title: Text(links[index].label,
-                    style: buttonTextStyle(),
-                  ),
-                  leading: CircleAvatar(
-                    backgroundImage: AssetImage('assets/${links[index].image}'),
-                    backgroundColor: Colors.white,
-                  ),
+                leading: CircleAvatar(
+                  backgroundImage: AssetImage('assets/${links[index].image}'),
+                  backgroundColor: Colors.white,
                 ),
               ),
-            );
-          }
-      ),
+            ),
+          );
+        }
     );
   }
 }

lib/widgets/sample_summary_container.dart

@@ -1,6 +1,7 @@
 import 'package:flutter/material.dart';
 import 'package:soil_mate/models/site.dart';
 import 'package:soil_mate/models/texture_models.dart';
+import '../services/sizes_helper.dart';
 
 class SampleSummary extends StatelessWidget {
   final TextureClass selectedTexture;
@@ -22,8 +23,7 @@ class SampleSummary extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     return Container(
-      width: 250,
-      padding: EdgeInsets.all(10),
+      padding: EdgeInsets.all(displayWidth(context) * 0.03),
       decoration: BoxDecoration(
         color: selectedTexture.getColor().withOpacity(0.5),
         borderRadius: BorderRadius.circular(15),
@@ -38,9 +38,7 @@ class SampleSummary extends StatelessWidget {
         children: [
           Text(
             'Sample Summary',
-            style: TextStyle(
-              fontSize: 20,
-            ),
+            style: headingTextStyle(context),
           ),
           Text(
             'Texture:  ' +
@@ -52,7 +50,7 @@ class SampleSummary extends StatelessWidget {
                 ' cm' +
                 '\nSample ID:  ' +
                 sampleID.toString(),
-            style: TextStyle(),
+            style: bodyTextStyle(context),
           ),
         ],
       ),

lib/widgets/texture_button.dart

@@ -1,5 +1,6 @@
 import 'package:flutter/material.dart';
 import 'package:soil_mate/models/texture_models.dart';
+import '../services/sizes_helper.dart';
 
 class TextureButton extends StatelessWidget {
   final TextureClass textureClass;
@@ -29,7 +30,8 @@ class TextureButton extends StatelessWidget {
           this.setTextureFunction(this.textureClass);
         },
         child: Text(
-          textureClass.name
+          textureClass.name,
+          style: textureButtonTextStyle(context),
         ),
       ),
     );