Merge pull request #5 from mdrokz/development

Fix UI Issues

lib/constants.dart

@@ -5,4 +5,10 @@ String decryptionUrl = "https://gogoplay4.com/encrypt-ajax.php";
 
 String secretKey="3633393736383832383733353539383139363339393838303830383230393037";
 String iv="34373730343738393639343138323637";
-String userAgent = "Mozilla/5.0 (X11; Ubuntu; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/55.0.2919.83 Safari/537.36";
+String userAgent = "Mozilla/5.0 (X11; Ubuntu; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/55.0.2919.83 Safari/537.36";
+
+List<String> settings = [
+  "",
+  "History",
+  "Favourites"
+];

lib/main.dart

@@ -8,6 +8,8 @@ import 'package:chewie/chewie.dart';
 
 import 'scraper.dart' as scraper;
 
+import 'widgets.dart';
+
 void main() {
   runApp(const MyApp());
 }
@@ -168,11 +170,15 @@ class _MyHomePageState extends State<MyHomePage> {
   }
 
   void displayEpisodes(String anime) async {
-    showDialog(context: context, builder: (_) {return const SizedBox(
+    showDialog(
+        context: context,
+        builder: (_) {
+          return const SizedBox(
             child: Center(child: CircularProgressIndicator()),
             width: 10,
             height: 10,
-          );});
+          );
+        });
     var eps = await scraper.getEpisodes(anime);
     Navigator.pop(context);
     showDialog(
@@ -184,31 +190,12 @@ class _MyHomePageState extends State<MyHomePage> {
                 itemBuilder: (_, i) {
                   final episode = eps[i].entries.first.key;
                   final cover = eps[i].entries.first.value;
-                  return GestureDetector(onTap: () {
+                  return ListCard(cover, episode, () {
                     streamEpisode(episode);
-                  },child: Flex(
-                    direction: Axis.horizontal,
-                    children: [
-                      ConstrainedBox(
-                          constraints: const BoxConstraints(
-                            minWidth: 100,
-                            minHeight: 100,
-                            maxWidth: 100,
-                            maxHeight: 200,
-                          ),
-                          child: Image.network(
-                            cover,
-                            fit: BoxFit.cover,
-                          )),
-                      Expanded(
-                        child: Text(
-                          episode.split('/')[2],
-                          // style: const TextStyle(fontSize: 23)
-                        ),
-                      ),
-                      // const Divider()
-                    ],
-                  ));
+                  },
+                      const TextStyle(),
+                      const EdgeInsets.only(
+                          left: 10, right: 0, top: 0, bottom: 0));
                 },
                 itemCount: eps.length,
                 padding: const EdgeInsets.all(8),
@@ -273,62 +260,54 @@ class _MyHomePageState extends State<MyHomePage> {
           mainAxisAlignment: MainAxisAlignment.start,
           children: <Widget>[
             TextField(
-              decoration: const InputDecoration(labelText: "Search for anime"),
+              autocorrect: true,
+              decoration: const InputDecoration(
+                hintText: 'Search for anime',
+                hintStyle: TextStyle(color: Colors.grey),
+                filled: true,
+                fillColor: Colors.white,
+                contentPadding: EdgeInsets.fromLTRB(10, 0, 0, 0),
+                enabledBorder: OutlineInputBorder(
+                  borderRadius: BorderRadius.all(Radius.circular(7.0)),
+                  borderSide: BorderSide(color: Colors.blue, width: 2),
+                ),
+                focusedBorder: OutlineInputBorder(
+                  borderRadius: BorderRadius.all(Radius.circular(2.0)),
+                  borderSide: BorderSide(color: Colors.blue),
+                ),
+              ),
               controller: _controller,
             ),
             const Divider(),
-            isSearching ? const SizedBox(
-              child: Center(child: CircularProgressIndicator()),
-              width: 50,
-              height: 50,
-            ) : Expanded(
-                child:  ListView.separated(
-              itemCount: animeList.length,
-              itemBuilder: (_, i) {
-                final anime = animeList[i].entries.first.key;
-                final cover = animeList[i].entries.first.value;
-                return GestureDetector(
-                  child: Flex(
-                    direction: Axis.horizontal,
-                    children: [
-                      ConstrainedBox(
-                          constraints: const BoxConstraints(
-                            minWidth: 100,
-                            minHeight: 100,
-                            maxWidth: 100,
-                            maxHeight: 200,
-                          ),
-                          child: Image.network(
-                            cover,
-                            fit: BoxFit.cover,
-                          )),
-                      Expanded(
-                        child: Text(anime.split('/')[2],
-                            style: const TextStyle(fontSize: 23)),
-                      ),
-                      // const Divider()
-                    ],
-                    // leading: ,
-                    // // leading: Image.network(cover, fit: BoxFit.fill,height: 100,width: 50,),
-                    // title: Text(anime.split('/')[2]),
-                    // onTap: () {
-                    //   displayEpisodes(anime);
-                    // },
-                  ),
-                  onTap: () {
-                    displayEpisodes(anime);
-                  },
-                );
-              },
-              separatorBuilder: (context, _) {
-                return const Divider();
-              },
-              // padding: const EdgeInsets.only(top: 0,right: 0,left: 0,bottom: 5),
-              shrinkWrap: true,
-            ))
+            isSearching
+                ? const SizedBox(
+                    child: Center(child: CircularProgressIndicator()),
+                    width: 50,
+                    height: 50,
+                  )
+                : Expanded(
+                    child: ListView.separated(
+                    itemCount: animeList.length,
+                    itemBuilder: (_, i) {
+                      final anime = animeList[i].entries.first.key;
+                      final cover = animeList[i].entries.first.value;
+                      return ListCard(cover, anime, () {
+                        displayEpisodes(anime);
+                      },
+                          const TextStyle(fontSize: 23),
+                          const EdgeInsets.only(
+                              left: 0, top: 0, right: 40, bottom: 40));
+                    },
+                    separatorBuilder: (context, _) {
+                      return const Divider();
+                    },
+                    shrinkWrap: true,
+                  ))
           ],
         ),
-      ), // This trailing comma makes auto-formatting nicer for build methods.
+      ),
+      drawer:
+          SettingsDrawer(), // This trailing comma makes auto-formatting nicer for build methods.
     );
   }
 }

lib/widgets.dart

@@ -0,0 +1,62 @@
+library ani_app.widgets;
+
+import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
+
+import 'package:ani_app/constants.dart' as constants;
+
+Widget SettingsDrawer() {
+  return Drawer(
+      child: ListView.separated(
+    padding: EdgeInsets.zero,
+    separatorBuilder: (_, i) {
+      return const Divider();
+    },
+    itemCount: constants.settings.length,
+    itemBuilder: (BuildContext context, int index) {
+      if (index == 0) {
+        return const DrawerHeader(
+          child: Text('Settings'),
+          decoration: BoxDecoration(
+            color: Colors.blue,
+          ),
+        );
+      }
+      return ListTile(title: Text(constants.settings[index]));
+    },
+  ));
+}
+
+Widget ListCard(
+    String cover, String title, void Function() onTap, TextStyle textStyle,EdgeInsetsGeometry padding) {
+  return GestureDetector(
+      onTap: onTap,
+      child: Flex(
+        direction: Axis.horizontal,
+        children: [
+          ConstrainedBox(
+              constraints: const BoxConstraints(
+                minWidth: 100,
+                minHeight: 100,
+                maxWidth: 100,
+                maxHeight: 200,
+              ),
+              child: Image.network(
+                cover,
+                fit: BoxFit.cover,
+              )),
+          Expanded(
+            child: Container(
+                child: Text(
+                  title.split('/')[2],
+                  textAlign: TextAlign.center,
+                  style: textStyle
+                ),
+                padding: padding
+            ),
+          ),
+          const Icon(Icons.star_border_outlined,color: Colors.blueGrey,)
+          // const Divider()
+        ],
+      ));
+}