Flutter clone of my "Cinematic" App

Overview

Flutter Cinematic

This app is a Flutter port of the native Android App Cinematic. My intention in creating this app was understanding the intricacies of building apps in Flutter. Just like the native Android App this app does not make any efforts in being a nicely architectured application. That being said the whole point is to showcase Flutter's capabilities for building simple apps and to understand key difference and advantages to native development.

Overview

The app uses the Movie DB Public API as a data sources and uses the standard dart libraries for making network requests.

In terms of UI, the goal was replicating the Android design as closely as possible to understand the possibilities that Flutter offers for crafting UIs.

Building from Source

To build this app from source you will have to obtain an API-key from TMDB right here. Set this key to the constant API_KEY in constants.dart to run the app. Additionally, the app now uses Dart2 which means that you should enable that in your IDE if you haven't done so yet.

Video

In App Experience

Learnings

Creating this app and learning Flutter in general felt like a gift for developers. It significantly increased development velocity by, amongst others, reducing development cycles and the ability to create reactive, modular components. Coming from the realms of Android, those are the things that stood out to me:

  • Creating beautiful UIs is easier with Flutter
  • Avoiding to write boilerplate code (XML layouts, adapters etc.)
  • Creating UIs in a declarative way without dealing with the shortcomings of Android's Databinding
  • Hot Reload - this one is a game-changer
  • Dart is not that bad of a language, but it doesn't get close to Kotlin. I think for the Usecase of Flutter Dart actually makes a lot of sense
  • The ability to not worry about state changes in the UI. The Widget will take care of the rendering using it's properties or state

License

This project utilizes the MIT License

Issues
  • Failed to build release for Android devices. No issue on iOS devices.

    Failed to build release for Android devices. No issue on iOS devices.

    RMBP➜ FlutterCinematic git:(master) ✗ >flutter run -d all --release Running "flutter packages get" in FlutterCinematic... 0.5s Initializing gradle... 0.9s Resolving dependencies... 1.8s Launching lib/main.dart on MI 6 in release mode... Running 'gradlew assembleRelease'... VMIsolate(CodeSize): 4613 Isolate(CodeSize): 1699574 ReadOnlyData(CodeSize): 2484048 Instructions(CodeSize): 5880224 Total(CodeSize): 10068459 Gradle build failed to produce an Android package.

    opened by zinwalin 2
  • Favorite menu and adding to list icon missing

    Favorite menu and adding to list icon missing

    Hi, when I compare with Java version cinematic app, I saw the favorite option is missing in flutter app. Please enhance to provide such. Thanks.

    opened by sarada 1
  • sorry there was an error loading media data

    sorry there was an error loading media data

    after apply the changes suggested by pull request #24 opened on 10 May by @kkpenaranda the app runs on android studio 3.4.2. but in media_list.dart

     Widget _getContentSection() {
        print("_getContentSection");
        print(_loadingState);
        switch (_loadingState) {
          case LoadingState.DONE:
            return ListView.builder(
                itemCount: _movies.length,
                itemBuilder: (BuildContext context, int index) {
                  if (!_isLoading && index > (_movies.length * 0.7)) {
                    _loadNextPage();
                  }
    
                  return MediaListItem(_movies[index]);
                });
          case LoadingState.ERROR:
            return const Text('Sorry, there was an error loading the data!');
          case LoadingState.LOADING:
            return const CircularProgressIndicator();
          default:
            return Container();
        }
      }
    

    on widget _getContentSection first print LoadingState.LOADING then print LoadingState.ERROR and get the text 'Sorry, there was an error loading the data!' the api_key is working return results like:

    {
        "page": 1,
        "total_results": 10000,
        "total_pages": 500,
        "results": [
            {
                "popularity": 481.769,
                "vote_count": 364,
                "video": false,
                "poster_path": "/zfE0R94v1E8cuKAerbskfD3VfUt.jpg",
                "id": 474350,
                "adult": false,
                "backdrop_path": "/p15fLYp0X04mS8cbHVj7mZ6PBBE.jpg",
                "original_language": "en",
                "original_title": "It Chapter Two",
                "genre_ids": [
                    35,
                    27
                ],
                "title": "It Chapter Two",
                "vote_average": 7.2,
                "overview": "27 years after overcoming the malevolent supernatural entity Pennywise, the former members of the Losers' Club, who have grown up and moved away from Derry, are brought back together by a devastating phone call.",
                "release_date": "2019-09-06"
            },
    

    but i can't find why this doesn't show the list in the main screen. some one can help to solve this? thanks

    opened by alexlovar 1
  • Implement shows

    Implement shows

    opened by aaronoe 0
  • util/constants.dart file is missing

    util/constants.dart file is missing

    opened by MagicalQinZhe 0
  • Aaron/favorites

    Aaron/favorites

    opened by aaronoe 0
  • Updated README.md

    Updated README.md

    UPDATED README. THIS WILL HELP THOSE FLUTTER DEV WITH PC/LAPTOP WITH LESS CONFIG. THANK YOU

    opened by alphamax17 0
  • Reported bugs fixed and changed dependencies so that we could compile

    Reported bugs fixed and changed dependencies so that we could compile

    We change the versions to the libraries to be able to run the application (rxdart, scoped_model). In addition, we solved issue #31 of memory leak, for this the HistoryLimit class was added, which is responsible for verifying the limit to the number of layers within the Navigator stack, the navigator class was also changed, with a new method to add media detail that removes views from the stack if they are very old. We also solved issue #32 , in this when the size of the favorites is very large, the application closes. For this, a new class was added within utils called app_model_db, it stores the favorites in a local database with sqlite, it has the same methods as the previous class and it works with Model, for this the imports to app_model were also modified. We also resolved isuue #33 an overflow in the media detail view, it was modified by changing the widget to a Wrap which makes it easier if the categories exceed the screen size, a new row is generated. We also solved isuue #34 , a method was added within utils to check the status of the internet connection and actor detail was modified to send a message when there is no connection.

    opened by Lala341 0
  • Connectivity scenarios

    Connectivity scenarios

    Hello, We found that the application does not handle connectivity scenarios, this would improve the user experience. There is a message in the view is there was an error in the data load, this message is sent if it is not possible to obtain the response of the data request. This message is only shown for the views that have lists of movies or tv shows, but for the others it does not exist. This happens when the user browses the application and loses the connection. For example, in the case of the detail of an actor, this verification does not exist, so it does not throw error messages, and since there is no data, the progress indicator remains fixed.

    opened by Lala341 0
  • Overflow in media detail

    Overflow in media detail

    Hello, We found a problem. It arises in the detail view of the movie or tv show when the size of the elements of the categories of these exceed the limit of the screen. This problem originates because the widget that has the Labels is a Row, it has a fixed size, therefore, when the size of the categories is greater, it generates the error. To solve this error, it is necessary to change the Row for a widget of the ListView type, which allows scrolling when the size is larger.

    cee31446-dc5b-427d-b708-06ebf71bb643

    opened by Lala341 0
  • Failed to reach maximum capacity of shared preferences for favorites.

    Failed to reach maximum capacity of shared preferences for favorites.

    Hello, We found a local data storage problem, when 100 movies stored in favorites in shared preferences are exceeded, it generates a memory error. This forces the application to stop, the solution lies in implementing another storage method for this type of local data on the device.

    opened by Lala341 0
  • Memory leak

    Memory leak

    Hello, We found a memory problem. There is no control to overlay views as we can infinitely delve into actors, movies and TV show, the stack can grow indefinitely and this causes the memory usage of the application to grow indefinitely as well, until the application reset or an OOM error occurs. This is an image of the performance on an android device, when the memory reaches 600MB, the application closes. Captura de Pantalla 2020-05-15 a la(s) 6 39 39 a  m

    opened by Lala341 0
  • upgrade dependencies version

    upgrade dependencies version

    upgrade dependencies version

    opened by dafinoer 0
  • scoped_model version

    scoped_model version

    My Dart SDK is v2.5.0 and does not work with scoped_model v0.2.0 unless scoped_model is updated. Had to update to v1.0.1

    opened by liciolentimo 0
  • how to change themoviedb API's language?

    how to change themoviedb API's language?

    i know this API support a lot of languages but how to change it ? image

    opened by vinhcuong 0
Owner
Aaron Oertel
Android @ Microsoft
Aaron Oertel
Fully functional Twitter clone built in flutter framework using Firebase realtime database and storage

Fwitter - Twitter clone in flutter A working Twitter clone written in Flutter using Firebase auth,realtime,firestore database and storage. Download Ap

Sonu Sharma 1.6k Jan 13, 2022
Clone do aplicativo mobile da Nubank utilizando Flutter

Nubank Clone Introdução Screenshots Executando Contribua Introdução Este projeto se trata de uma recriação bem próxima da interface do app do Nubank u

Ricardo Dalarme 33 Jan 8, 2022
WhatsApp UI Clone

WhatsAppUIClone It is a copy of the WhatsApp design. What's inside Chat list Chat detail screen Statuses page Story view search page Images related to

Umut Ocak 23 Jan 11, 2022
Microsoft Teams Clone is a Video conference application with a rich integrated chat experience, to connect with friends,family & colleagues. Developed as a redesign of Microsoft Teams during my menteeship at Microsoft Engage 2021

Microsoft Teams Clone by Karanjot Singh About Microsoft Teams Clone is a Video conference application with a rich integrated chat experience, to conne

Karanjot Singh 53 Jan 7, 2022
The Flutter Planets app tutorial with commits per lesson

flutter planets tutorial This project contains the steps followed on the tutorial on sergiandreplace.com. Each lesson will correspond to a single bran

Sergi Martínez 711 Dec 26, 2021
News App created in Flutter using News API for fetching realtime data and Firebase as the backend and authenticator.

News Buzz News App created in Flutter using News API for fetching realtime data and Firebase as the backend and authenticator. Features Custom news fe

Ankur Kedia 506 Dec 11, 2021
A Simple Todo app design in Flutter to keep track of your task on daily basis. Its build on BLoC Pattern. You can add a project, labels, and due-date to your task also you can sort your task on the basis of project, label, and dates

WhatTodo Life can feel overwhelming. But it doesn’t have to. A Simple To-do app design in flutter to keep track of your task on daily basis. You can a

Burhanuddin Rashid 912 Jan 9, 2022
A beer tracking app made with Flutter

Beer Me Up Beer Me Up is an iOS and Android app build with Flutter. The app is a personal beer logging that allows you to enter every beer you have to

Benoit Letondor 445 Dec 22, 2021
Flutter ToDo App with Firebase

Taskist Taskist is a ToDo List app for Task Management inspired by the design below The app is using Firebase, you have to configure it from your side

Hugo EXTRAT 738 Jan 14, 2022
Flutter app backed by Redux, shows animations, internationalization (i18n), ClipPath, fonts and others...

A Flutter tourism app that is backed-by Redux, shows animations, internationalization (i18n, English <=> Arabic), ClipPath, and fonts. YouTube demo I

Abdulmomen Kadum عبدالمؤمن كاظم 255 Jan 5, 2022
An app for orientation week at Trinity College, University of Toronto. Made with Flutter

Trinity Orientation 2018 An app created for Trinity College at University of Toronto. The app is acts as a companion for all first year students durin

Matthew Tory 566 Jan 14, 2022
Minimalist Flutter Todo App, built using BLoC pattern

Deer Minimalist Todo Planner app built around the idea of efficiency and clean aesthetic. Showcase Development Deer uses BLoC (Business Logic Componen

Aleksander Woźniak 305 Jan 11, 2022
🦋Beautiful flutter app for downloading Instagram stories 🚀

NOTE: No longer maintained Instory ?? ?? Beautiful flutter app for downloading Instagram stories ?? Demo video Dependencies used video_player http dio

Sarath 194 Dec 11, 2021
A full-fledged one-to-one chat app developed entirely in Flutter

Enigma Enigma - A minimalist, locked-down one-to-one chat app. Usage Flutter - Get Started Since this is a Firebase dependent project, create a Fireba

Amit Joki 362 Jan 11, 2022
Music App made with flutter

Chillify A Flutter music app made with Provider and BLoC pattern. (Works on Android for now) Recommended Flutter version: 1.7.8+hotfix.4 UI heavily in

Karim Elghamry 530 Jan 10, 2022
Pokedex app built with Flutter (with lots of animations) using Clean Architecture

Flutter Pokedex Pokedex app built with Flutter App preview Video demo Installation Add Flutter to your machine Open this project folder with Terminal/

Pham Sy Hung 1.3k Jan 19, 2022
Timy - open source mobile app for groups to communicate and organize themselves. Built with flutter.

Timy app An amazing open-source group messaging app build with flutter. ✨ Main Features Multiple groups (similar to Teams in Slack). Multiple open or

null 1.8k Jan 13, 2022
A multiplatform Dart movie app with 40% of code sharing between Flutter and the Web.

A multiplatform Dart movie app with 40% of code sharing between Flutter and the Web.

Iiro Krankka 3.2k Jan 17, 2022