前端学习--flutter踩坑

1、创建动态二维码
（1）插件：qr_flutter: ^3.2.0
（2）使用方法：

QrImage(
 	padding:
  	EdgeInsets.zero,
  	data: qrcodeUrl, //地址
  	version:
  	QrVersions.auto,
  	size: 300.0/sspx,
),

2、flutter项目调用微信支付
（1）插件fluwx: ^2.1.0
（2）使用方法：

方法一：需要自己在页面中定义监听器来监听微信支付状态

page.dart:
//定义微信支付状态监听方法
StreamSubscription<fluwx.BaseWeChatResponse> streamSubscription;
init(){
	streamSubscription = fluwx.weChatResponseEventHandler.listen((statusData) async {
      if(statusData is fluwx.WeChatPaymentResponse){		//注意：一定要按照这种方法去定义statusData，不让不能收到监听数据
        if(statusData.errCode==-2){
          Toast.show('您取消了支付', context,gravity:1);
        }else if(statusData.errCode==-1){
          Toast.show('支付失败:${statusData.errStr}', context,gravity:1);
        }else if(statusData.errCode==0){
          Toast.show('支付成功', context,gravity:1);
        }
      }
    });
}


//当页面离开时要清除监听器
@override
  void dispose() {
    super.dispose();
    if(streamSubscription!=null)streamSubscription.cancel();
  }

//页面调起微信支付
var result = await goPay(
    appId: wechatData.appid,
    partnerId: wechatData.partnerid,
    prepayId: wechatData.prepayid,
    nonceStr: wechatData.noncestr,
    packageValue: wechatData.package,
    timeStamp: int.parse(wechatData.timestamp),
    sign: wechatData.sign,
    signType: "MD5");


weChat.dart:
import 'package:fluwx/fluwx.dart' as fluwx;

Future<bool> goPay({
  String appId,
  String partnerId,
  String prepayId,
  String nonceStr,
  String packageValue,
  int timeStamp,
  String sign,
  String signType='',
  String extData='',
}) async {
  try{
    if(isRegister!=true)await fluwx.registerWxApi(appId:appId,universalLink: "https://your.univerallink.com/link/");
    bool isWeChatInstalled = await fluwx.isWeChatInstalled;
    if(!isWeChatInstalled){
      throw ApiError(message: '支付失败，你还没有安装微信');
    }
    var result = await fluwx.payWithWeChat(
        appId: appId,
        partnerId: partnerId,
        prepayId: prepayId,
        packageValue: packageValue,
        nonceStr: nonceStr,
        timeStamp: timeStamp,
        sign: sign,
        signType: signType,
        extData: extData
    );

    return result;

  }catch(e){
    if(e is ApiError){
      throw e;
    }else{
      throw ApiError(message: '支付失败，${e.toString()}');
    }
  }
}

方法二：通过异步方法监听微信支付状态
page.dart：
var result = await goPay(		//根据result的值来判断是否微信支付状态
          appId: wechatData.appid,
          partnerId: wechatData.partnerid,
          prepayId: wechatData.prepayid,
          nonceStr: wechatData.noncestr,
          packageValue: wechatData.package,
          timeStamp: int.parse(wechatData.timestamp),
          sign: wechatData.sign,
          signType: "MD5");



weChat.dart:
//异步返回微信支付状态
Future<String> wechatGoPay({
  String appId,
  String partnerId,
  String prepayId,
  String nonceStr,
  String packageValue,
  int timeStamp,
  String sign,
  String signType='',
  String extData='',
}) async {
  try{
    if(isRegister!=true)await fluwx.registerWxApi(appId:appId,universalLink: "https://your.univerallink.com/link/");
    bool isWeChatInstalled = await fluwx.isWeChatInstalled;
    if(!isWeChatInstalled){
      throw ApiError(message: '支付失败，你还没有安装微信');
    }

    StreamSubscription<fluwx.BaseWeChatResponse> streamSubscription;

    final com = Completer<String>();
    final future = com.future;

    streamSubscription = fluwx.weChatResponseEventHandler.listen((statusData) async {
      print('xxxxxx');
      if(statusData is fluwx.WeChatPaymentResponse){
        if(statusData.errCode==-2){
          print('您取消了支付');
          com.complete('您取消了支付');
          if(streamSubscription!=null)streamSubscription.cancel();
        }else if(statusData.errCode==-1){
          print('支付失败');
          com.complete('支付失败');
          if(streamSubscription!=null)streamSubscription.cancel();
        }else if(statusData.errCode==0) {
          print('支付成功');
          com.complete('支付成功');
          if(streamSubscription!=null)streamSubscription.cancel();
        }
      }
    });


    var result = await fluwx.payWithWeChat(
        appId: appId,
        partnerId: partnerId,
        prepayId: prepayId,
        packageValue: packageValue,
        nonceStr: nonceStr,
        timeStamp: timeStamp,
        sign: sign,
        signType: signType,
        extData: extData
    );
    return future;

  }catch(e){
    if(e is ApiError){
      throw e;
    }else{
      throw ApiError(message: '支付失败，${e.toString()}');
    }
  }
}

3、在flutter项目中打开网页地址
（1）插件： url_launcher: ^5.4.10
（2）使用方法：

  onTap: (){
     launch(url);	//url:网页地址
   },
   child: Container(       
     child: Text("打开网页地址",style: TextStyle(
         fontSize: 28/sspx,
         color: Colors.red
     ),),
   ),
 )

4、在flutter项目中使用图表
（1）插件：flutter_echarts: ^1.3.5
（2）使用方法

Container(
  child: Echarts(
    option: jsonEncode({
      "xAxis":{		//X轴数据
        "type":"category",
        "data":["Mon","Tue","Wed","Thu","Fri","Sat","Sun"],
      },
      "yAxis":{		//Y轴数据
        "type":"value"
      },
      "series":[{	//对应点得值
        "data":[820,932,901,934,1290,1330,1320],
        "type":"line"
      }]
    }),
  ),
  width: 300,
  height: 250,
)