flutter 的使用学习

1.环境搭建
参考中文网一步一步操作即可
https://flutterchina.club/
2.demo练习
了解无状态widget和有状态widget ----类似于layout的东西，我用的比较多的是Container，但是寻找的几种适配方案，例如flutter_ScreenUtil 。尝试了下觉得有些地方还是存在问题（仅对我来说),另外的一种方案是通过导入dart.ui来获得屏幕信息，根据图纸自己计算。地址：https://github.com/OpenFlutter/flutter_ScreenUtil

3.网络请求 dio

static Dio dio;
static const String API_PREFIX = 'https://xnpool/api/';
static const String oauth_PREFIX = 'https://auth.xnpool.cn/';
static const int CONNECT_TIMEOUT = 10000;
static const int RECEIVE_TIMEOUT = 3000;
static HttpUtils instance;
CancelToken cancelToken = new CancelToken();

  //单例模式
static HttpUtils getInstance(){
  print("getInstance");
  if(instance == null){
    instance  = new HttpUtils();
  }
  return instance;
}
HttpUtils(){
//基础配置
dio = new Dio();
dio.options.baseUrl=API_PREFIX;
dio.options.responseType=ResponseType.plain;
dio.options.connectTimeout=CONNECT_TIMEOUT;
dio.options.receiveTimeout=RECEIVE_TIMEOUT;
dio.interceptors.add(LogInterceptor(responseBody: false));
dio.options.headers={HttpHeaders.authorizationHeader: "Basic     eG5wb29sLWFwcDp4bnBvb2wtYXBwLXNlY3JldA=="};
}

//get请求
get(url, {data, options, cancelToken}) async {
 Response response;
try {
  response = await dio.get(url, queryParameters: data, options: options, cancelToken: cancelToken);
} on DioError catch (e) {
  print('get error---------$e');
  formatError(e);
}
return response.data;
}
//post请求
post(url, {data, options, cancelToken}) async {
Response response;
try {
  response = await dio.post(url, queryParameters: data, options: options, cancelToken: cancelToken);
  print('post success---------${response.data}');
} on DioError catch (e) {
  print('post error---------$e');
  formatError(e);
}
return response.data;
}

4.调用

_getDataList() async {
      accesstoken = await Shared_Preutils.getString("access_token");
     var result = await HttpUtils.getInstance().get(
        "https://xxxxxxxxx",
        data: {"access_token": accesstoken});
    setState(() {
      datas=new CoinInfoBeens.fromJson(json.decode(result.toString())).content;
      text.add(datas.datas[chosepos].dailyEarning);
    text.add(datas.datas[chosepos].onlineMiner.toString());
    text.add(datas.datas[chosepos].hashrate.toString());
    text.add(datas.datas[chosepos].caculTotal);
  });
}

5.json解析是通过 https://flutterchina.club/json/
无法使用类似于gson的那种东西附上一个工具网址(会用上的):https://caijinglong.github.io/json2dart/index_ch.html

github地址:https://github.com/loveyyy/flutter_test

flutter 的使用学习

推荐阅读更多精彩内容