preface

It has been almost a month since I started my flutter. Let’s sum up! After all, precipitation (fish) two months, or have to re-record record.

First of all, I was going to write an app to play with in my spare time. First, I wanted to use native Android, then cross platform. Then we screened three options

  • react-nativeIt’s owned by Facebook, but I did a little research on the Internet and found that most of them were years oldreactNot particularly. Therefore, to give up.
  • uni-app: domestic team, the current company small program is used this, do not want to be in the pit. Therefore, to give up.
  • flutter: Google open source, there are many domestic companies in use, such as the earliest idle fish, and then handwritten a demo feeling is good, plus itself is a UI framework. Final decision to useflutterDevelopment.

At the time I decided that I had not touched Flutter at all. It was a study. The best help was github, official document. I would have time to write every day after work and on weekends

What is Flutter?

The Flutter is Google’s mobile UI framework for quickly building high quality native user interfaces on iOS and Android. Flutter works with existing code. Flutter is being used by more and more developers and organizations around the world, and Flutter is completely free and open source. In short, Flutter is a mobile application SDK that includes frameworks, controls, and tools to build Android and iOS applications with a single set of code that can perform as well as native applications. Please refer to the brochure of Flutter for details.

Tips on Using flutter

From my point of view the flutter is pretty good and the ecology is developing slowly, it’s the nesting grammar which is a bit hard to watch sometimes, but it’s still readable to break down.

At the moment, the third-party library of Flutter is good enough for everyday applications, but I think I can write a video app. I think the video aspect of Flutter is a little bit weak, and the official video players are too cumbersome. Some of the best known are Chewie and FijkPlayer. Support for custom UI. Maybe some mobile phones will have the situation of frame drop, some people have met online, but I don’t seem to have such a situation except my mobile phone (Oneplus 5T house) wrote this suddenly don’t know how to write, feel very messy, or combined with a specific project to say.

Open source ALLTV an app to see the whole network anchor

Write this app just for convenience, in a want to learn new things.

Route management Fluro

There were not many app pages and the Original Flutter route was fine, but I decided to use the framework. One of the pains of using Fluro for this project was that the framework itself did not support Chinese parameters, so it had to be handled manually. For details, please see

Network Request DIO

Dio is a powerful Dart Http request library that Flutter Chinese provides open source support for Restful apis, FormData, interceptors, request cancellation, Cookie management, file upload/download, timeouts, and more. dio

Video player

Using open source FijkPlayer authors also seem to be making money. Open source ijkPlayer based on b site, please see FijkPlayer

The rest is not detailed
dependencies:
  flutter:
    sdk: flutter
  # storage
  shared_preferences: ^ 0.5.6 + 3
  # State management
  provider: ^ 4.0.5 + 1
  # Screen adaptation
  flutter_screenutil: ^ 1.1.0
  # Route management
  fluro: "^ 1.6.3." "
  # Pull-down refresh
  pull_to_refresh: ^ 1.5.7
  # toast
  fluttertoast: ^ 4.0.0
  # Network request
  dio: ^ 3.0.9
  cached_network_image: ^ 2.2.0
  #websocket
  web_socket_channel: ^ 1.1.0
  # Video playback
  fijkplayer: ^ 0.8.3
  crypto: ^ 2.1.3
  cupertino_icons: ^ 0.1.2

Copy the code

JSON to Dart

A comparison tool from Amway, Flutter does not support reflection, so how can the json retrieved from the back end be quickly converted into objects? So this site is convenient for JSON to Dart

Flutter stomp pit diary

The real machine flutter build APK could not request the network

Androidmanifest.xml: androidmanifest.xml: androidmanifest.xml: androidmanifest.xml: androidmanifest.xml: androidmanifest.xml: androidmanifest.xml: androidmanifest.xml: androidmanifest.xml: androidmanifest.xml

<uses-permission android:name="android.permission.READ_PHONE_STATE" />
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
<uses-permission android:name="android.permission.ACCESS_WIFI_STATE" />
Copy the code

You think that’s it? In addition, there is also an Androidmanifest.xml under SRC \main, which requires the same operation.

HTTP request cannot be accessed

Net :ERR_CLEARTEXT_NOT_PERMITTED 错误 : IOS and Android 9.0+ have some restrictions on non-https requests, so you cannot directly access Http requests.

  • Create it under SRC /res/ XMLnetwork_security_config.xml, the configuration is as follows:
<?xml version="1.0" encoding="utf-8"? >
<network-security-config>
     <base-config cleartextTrafficPermitted="true" />
</network-security-config>
Copy the code
  • Add to androidManifes.xml under SRC \main:
 <?xml version="1.0" encoding="utf-8"? >
    <manifest . >
        <application android:networkSecurityConfig="@xml/network_security_config">
            <! -... -->
        </application>
    </manifest>
Copy the code

In fact, there are often more than these pits in the project, but at the time of the record, you can hardly think of it.

The project address

Portal: Github APK: Blue Cloud

END

If you think it will help you, please click Star, thank you!