第三方包必须在pubspec.ymal中下载 然后在使用的地方进行引入
dio 获取数据
http 获取数据
获取数据可以详见之前的笔记
flutter_swiper 轮播图
flutter_swiper: ^1.1.6
return Scaffold(
appBar: AppBar(
title: Text('轮播图列表'),
),
body: AspectRatio(
aspectRatio: 16/9,
child: Swiper(
itemBuilder: (BuildContext context, int index) {
return new Image.network(
imgList[index]["url"],
);
},
itemCount: imgList.length,
pagination: new SwiperPagination(),
control: new SwiperControl(),
),
)
);
}
url_launcher
用来打开外部应用 比如点击支付宝 会显示到支付宝的页面
url_launcher: ^5.1.3
return Scaffold(
appBar: AppBar(title: Text('外部应用'),),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
RaisedButton(
child: Text('打开浏览器'),
onPressed: () async {
const url='http://www.baidu.com';
if(await canLaunch(url)){
await launch(url);
}else{
throw "Could not launch $url";
}
},
),
RaisedButton(
child: Text('拨打电话'),
onPressed: () async {
const tel = 'tel:10086';
if(await canLaunch(tel)){
await launch(tel);
}else{
throw 'Could not launch $tel ';
}
},
),
RaisedButton(
child: Text("发送短信"),
onPressed: () async {
const tel = "sms:10086";
if(await canLaunch(tel)){
await launch(tel);
}else{
throw "Conld not launch $tel";
}
},
),
RaisedButton(
child: Text('打开支付宝'),
onPressed:() async {
const url = 'alipays://';
if(await canLaunch(url)){
await launch(url);
}else{
throw 'Could not launch $url';
}
}
),
RaisedButton(
child: Text('打开微信'),
onPressed:() async {
const url = 'weixin://';
if(await canLaunch(url)){
await launch(url);
}else{
throw 'Could not launch $url';
}
}
)
],
),
),
);
device_info
获取设置的信息 逛淘宝时 会根据你的设备号获取你喜欢的类型 然后可以给你推荐类似的东西
device_info: ^0.4.0+2
class DeviceDemo extends StatefulWidget {
@override
_DeviceDemoState createState() => _DeviceDemoState();
}
class _DeviceDemoState extends State<DeviceDemo> {
@override
void initState() {
_getDeviceInfo();
// TODO: implement initState
super.initState();
}
_getDeviceInfo() async {
DeviceInfoPlugin deviceInfo = DeviceInfoPlugin();
AndroidDeviceInfo androidInfo = await deviceInfo.androidInfo;
print('设备号 ${androidInfo.androidId}');
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text('设备信息'),),
body:Center(
child: Text('看控制台,信息已经打印到控制台了'),
)
);
}
}
shared_preferences
类似于vue中的Store(vuex) 可以实现所有的组件都可以获取这个值 例如浏览器中的localstorage、cookie
shared_preferences: ^0.5.3+4
可以在lib下建一个文件夹comment 在这个下面新建Storage.dart 在这里引入
import 'package:shared_preferences/shared_preferences.dart';
class Storage{
static Future<void> setString(key,value) async{
SharedPreferences prefs = await SharedPreferences.getInstance();
prefs.setString(key, value);
}
static Future<String> getString(key) async {
SharedPreferences prefs = await SharedPreferences.getInstance();
return prefs.getString(key);
}
static Future<void> remove(key) async {
SharedPreferences prefs = await SharedPreferences.getInstance();
prefs.remove(key);
}
在lib下建一个Storage.dart 在这里可以进行保存、获取、删除数据 在这里引入公共的Storage.dart 这样才可以对数据操作
import 'package:flutter/material.dart';
import './comment/Storage.dart';
class storage extends StatefulWidget {
@override
_storageState createState() => _storageState();
}
class _storageState extends State<storage> {
_getData() async {
var username = await Storage.getString('name');
print(username);
}
_removeData() async {
await Storage.remove('name');
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('本地存储'),
),
body: Center(
child: Column(mainAxisAlignment: MainAxisAlignment.center, children: [
RaisedButton(
child: Text('保存数据'),
//设置方法保存数据
onPressed:() async {
await Storage.setString('name', 'wangcai');
},
),
SizedBox(height: 10),
RaisedButton(
child: Text('获取数据'),
onPressed: _getData,
),
SizedBox(height: 10),
RaisedButton(
child: Text('清除数据'),
onPressed: _removeData,
)
]),
),
);
}
}
connecticity
可以使用这个进行判断使用的是什么网络 无线还是4g
connectivity: ^0.4.4
class NetworkDemo extends StatefulWidget {
@override
_NetworkDemoState createState() => _NetworkDemoState();
}
class _NetworkDemoState extends State<NetworkDemo> {
var subscription;
String _stateText;
@override
void initState() {
// TODO: implement initState
super.initState();
subscription = Connectivity().onConnectivityChanged.listen((ConnectivityResult result) {
if(result == ConnectivityResult.wifi){
_stateText = '处于wifi';
}else if(result == ConnectivityResult.mobile){
_stateText = '处于4g';
}else{
_stateText = '没有网络';
}
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text('测试网络'),),
body: Center(
child: Text('${_stateText}'),
),
);
}
}
video_player
播放视频 没有快进 非常简单的
video_player: ^0.10.2+1
class _VideoDemoState extends State<VideoDemo> {
var _controller;
@override
void initState() {
// TODO: implement initState
super.initState();
_controller = VideoPlayerController.network(
'http://vfx.mtime.cn/Video/2019/02/04/mp4/190204084208765161.mp4')
..initialize().then((_) {
// Ensure the first frame is shown after the video is initialized, even before the play button has been pressed.
setState(() {});
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text('视频播放'),),
body: Center(
child: _controller.value.initialized
? AspectRatio(
aspectRatio: _controller.value.aspectRatio,
child: VideoPlayer(_controller),
)
: Container(),
),
floatingActionButton: FloatingActionButton(
onPressed: () {
setState(() {
_controller.value.isPlaying
? _controller.pause()
: _controller.play();
});
},
child: Icon(
_controller.value.isPlaying ? Icons.pause : Icons.play_arrow,
),
),
);
}
@override
void dispose() {
super.dispose();
_controller.dispose();
}
}
amap_location
获取地理位置
amap_location: ^0.2.0
class LocationDemo extends StatefulWidget {
@override
_LocationDemoState createState() => _LocationDemoState();
}
class _LocationDemoState extends State<LocationDemo> {
double _longitude=0;
double _latitude=0;
@override
void initState() {
// TODO: implement initState
super.initState();
_getLocation();
}
_getLocation() async {
//启动一下
await AMapLocationClient.startup(new AMapLocationOption( desiredAccuracy:CLLocationAccuracy.kCLLocationAccuracyHundredMeters));
//获取地理位置
var result = await AMapLocationClient.getLocation(true);
// print(result);
setState(() {
this._latitude = result.latitude;
this._longitude = result.longitude;
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text('获取地址'),),
body: Column(
children: <Widget>[
Text('经度:${this._longitude}'),
Text('纬度:${this._latitude}'),
],
)
);
}
}
image_picker
可以实现拍照 选择图片 上传
选择图片和拍照的区别
图片就是source里面的source: ImageSource.camera
拍照是source: ImageSource.gallery
import 'dart:io';
import 'package:flutter/material.dart';
import 'package:image_picker/image_picker.dart';
import 'package:dio/dio.dart';
class ImageDemo extends StatefulWidget {
@override
_ImageDemoState createState() => _ImageDemoState();
}
class _ImageDemoState extends State<ImageDemo> {
File _image;
//拍照
Future _getImage() async {
var image = await ImagePicker.pickImage(source: ImageSource.camera);
setState(() {
this._image = image;
});
_uploadImage(image);
}
//从相册中选择图片
_openGallery() async {
var image = await ImagePicker.pickImage(source: ImageSource.gallery);
setState(() {
this._image = image;
});
_uploadImage(image);
}
//上传图片
_uploadImage(_imageDir) async {
FormData formData = new FormData.from({
"name": "zhangsna 6666666666",
"age": 20,
"sex":"男",
"file":new UploadFileInfo(_imageDir, "xxx.jpg"),
});
var response = await Dio().post("http://192.168.1.101:3000/image", data: formData);
print(response);
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text('照片'),),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
RaisedButton(
child: Text('拍照'),
onPressed: _getImage
),
RaisedButton(
child: Text('选择图片'),
onPressed: _openGallery
),
_buildImage()
],
),
)
);
}
//定义一个组件显示图片
Widget _buildImage(){
if(this._image==null){
return Text("请选择图片...");
}
return Image.file(this._image);
}
}