Flutter 상용 플러그 인 집합
Flutter 의 네트워크 프레임 워 크 를 언급 하면 DIO 를 언급 할 수 밖 에 없 으 며,자 랑스 러 운 것 은 DIO 가 국민 이 개발 한 것 입 니 다!DIO 는 GET,POST,PUT,PATCH,DELETE 등 네트워크 프레임 워 크 로 서 모든 네트워크 요청 을 실현 하 는 동시에 차단기,오류 캡 처 와 파일 다운로드 도 지원 합 니 다.DIO 를 통 해 Flutter App 과 백 엔 드 의 데이터 상호작용 을 신속하게 완성 할 수 있 습 니 다.예제 코드 는 다음 과 같다.
Response response;
var dio = Dio();
response = await dio.get('/test?id=12&name=wendu');
print(response.data.toString());
// Optionally the request above could also be done as
response = await dio.get('/test', queryParameters: {'id': 12, 'name': 'wendu'});
print(response.data.toString());
url_launcher 시스템 응용 점프
App 에서 url 을 사용 하여 시스템 브 라 우 저 나 다른 응용 프로그램 으로 이동 하 는 것 을 피 할 수 없습니다.이때 urllauncher 가 도움 이 되 었 습 니 다.사용 방법 은 매우 간단 합 니 다.
import 'package:flutter/material.dart';
import 'package:url_launcher/url_launcher.dart';
const _url = 'https://flutter.cn';
void main() => runApp(
const MaterialApp(
home: Material(
child: Center(
child: RaisedButton(
onPressed: _launchURL,
child: Text('Show Flutter homepage'),
),
),
),
),
);
void _launchURL() async =>
await canLaunch(_url) ? await launch(_url) : throw 'Could not launch $_url';
flutter_easyrefresh 상하 당 김 새로 고침
flutter 에서 상하 로 데 이 터 를 불 러 오 는 두 가지 선택 은 국민 들 이 개발 한 것 입 니 다.대부분의 구성 요소 에 사용 하여 상하 로 데 이 터 를 불 러 오 거나 새로 고침 하 는 것 을 지원 합 니 다.사용 방법 도 간단 하 며 사용자 정의 header 와 footer 도 지원 합 니 다.
import 'package:flutter_easyrefresh/easy_refresh.dart';
//...
EasyRefresh(
child: ScrollView(),
onRefresh: () async{
....
},
onLoad: () async {
....
},
)
flutter_swiper 순환 방송 모듈
flutter_swiper 는 플 루 터 의 가장 좋 은 라운드 구성 요소 라 고 불 리 는 라운드 구성 요소 입 니 다.flutter_swiper 는 자동 라운드 방송 을 지원 하고 페이지 지시,애니메이션 시간,리 셋 등 다양한 매개 변수 설정 을 표시 합 니 다.
new Swiper(
itemBuilder: (BuildContext context, int index) {
return new Image.network(
"http://via.placeholder.com/288x188",
fit: BoxFit.fill,
);
},
itemCount: 10,
viewportFraction: 0.8,
scale: 0.9,
)
catcher 이상 포획
catcher 는 flutter 의 전역 이상 캡 처 플러그 인 으로 시스템 의 이상 을 자동 으로 포착 할 수 있 으 며,이상 보고 주 소 를 지정 하여 자동 으로 실행 오 류 를 서버 에 보고 하여 개발 자 추적 프로그램의 Bug 를 편리 하 게 복구 할 수 있 습 니 다.
import 'package:flutter/material.dart';
import 'package:catcher/catcher.dart';
main() {
/// STEP 1. Create catcher configuration.
/// Debug configuration with dialog report mode and console handler. It will show dialog and once user accepts it, error will be shown /// in console.
CatcherOptions debugOptions =
CatcherOptions(DialogReportMode(), [ConsoleHandler()]);
/// Release configuration. Same as above, but once user accepts dialog, user will be prompted to send email with crash to support.
CatcherOptions releaseOptions = CatcherOptions(DialogReportMode(), [
EmailManualHandler(["[email protected]"])
]);
/// STEP 2. Pass your root widget (MyApp) along with Catcher configuration:
Catcher(rootWidget: MyApp(), debugConfig: debugOptions, releaseConfig: releaseOptions);
}
cached_network_이미지 네트워크 이미지 캐 시 불 러 오기
cached_network_image 는 iOS 의 SDWebImage 와 유사 합 니 다.불 러 온 그림 을 캐 시 할 수 있 고 중복 다운로드 없 이 불 러 오 는 속도 도 높 일 수 있 으 며 네트워크 자원 요청 도 절약 할 수 있 습 니 다.동시 cachednetwork_image 는 비트 맵,로드 진도,요청 에 실패 한 비트 구성 요 소 를 지원 하여 좋 은 사용자 체험 을 할 수 있 습 니 다.
CachedNetworkImage(
imageUrl: "http://via.placeholder.com/350x150",
placeholder: (context, url) => CircularProgressIndicator(),
errorWidget: (context, url, error) => Icon(Icons.error),
),
//......
shared_preferences 로 컬 오프라인 키 대 캐 시
shared_preferences 는 iOS 와 유사 한 NSUserDefaults 와 안 드 로 이 드 의 Shared Preferences 로 App 의 간단 한 키 값 이 오프라인 캐 시 에 적용 되 며 오프라인 저장 에 간단 한 데 이 터 를 적용 합 니 다.그러나 주의해 야 할 것 은 플러그 인의 오프라인 기록 작업 이 비동기 적 이기 때문에 기록 후 100%저장 에 성공 할 것 이 라 고 보장 할 수 없 기 때문에 매우 중요 한 데 이 터 는 사용 하 는 것 을 권장 하지 않 습 니 다.
import 'package:flutter/material.dart';
import 'package:shared_preferences/shared_preferences.dart';
void main() {
runApp(MaterialApp(
home: Scaffold(
body: Center(
child: RaisedButton(
onPressed: _incrementCounter,
child: Text('Increment Counter'),
),
),
),
));
}
_incrementCounter() async {
SharedPreferences prefs = await SharedPreferences.getInstance();
int counter = (prefs.getInt('counter') ?? 0) + 1;
print('Pressed $counter times.');
await prefs.setInt('counter', counter);
}
image_picker 와 multiimage_pikcer 그림 선택 기
image_picker 와 multiimage_picker 는 그림 선택 기 입 니 다.전 자 는 한 장의 그림 선택 을 지원 합 니 다.후 자 는 다 중 그림 선택 을 지원 합 니 다.둘 다 카 메 라 를 지원 하거나 앨범 에서 그림 을 선택 합 니 다.주의해 야 할 것 은 multiimage_picker 기본 언어 는 영어 입 니 다.로 컬 언어 를 스스로 설정 해 야 합 니 다.
import 'dart:io';
import 'package:flutter/material.dart';
import 'package:image_picker/image_picker.dart';
//......
class _MyHomePageState extends State<MyHomePage> {
File _image;
final picker = ImagePicker();
Future getImage() async {
final pickedFile = await picker.getImage(source: ImageSource.camera);
setState(() {
if (pickedFile != null) {
_image = File(pickedFile.path);
} else {
print('No image selected.');
}
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Image Picker Example'),
),
body: Center(
child: _image == null
? Text('No image selected.')
: Image.file(_image),
),
floatingActionButton: FloatingActionButton(
onPressed: getImage,
tooltip: 'Pick Image',
child: Icon(Icons.add_a_photo),
),
);
}
}
marquee 스크롤 텍스트 구성 요소
텍스트 가 너무 길 고 줄 을 바 꾸 고 싶 지 않 을 때 marquee 를 사용 할 수 있 습 니 다.marquee 는 텍스트 가 용기 폭 을 넘 으 면 자동 으로 스크롤 하여 방송 합 니 다.또한,marquee 는 글꼴,스크롤 방향,여백,스크롤 속도 등 텍스트 의 다양한 인 자 를 설정 하 는 것 을 지원 합 니 다.
Marquee(
text: 'Some sample text that takes some space.',
style: TextStyle(fontWeight: FontWeight.bold),
scrollAxis: Axis.horizontal,
crossAxisAlignment: CrossAxisAlignment.start,
blankSpace: 20.0,
velocity: 100.0,
pauseAfterRound: Duration(seconds: 1),
startPadding: 10.0,
accelerationDuration: Duration(seconds: 1),
accelerationCurve: Curves.linear,
decelerationDuration: Duration(milliseconds: 500),
decelerationCurve: Curves.easeOut,
)
sqflite 로 컬 데이터베이스 접근
sqflite 는 이름 에서 알 수 있 듯 이 핸드폰 의 sqlite 데이터베이스 에 접근 하 는 도구 입 니 다.sqlite 데이터베이스 의 모든 변경 삭제 작업 을 지원 하 는 동시에 사무 와 대량 작업 도 지원 합 니 다.SQL 의 동작 은 SQL 문 구 를 직접 실행 하 는 것 도 지원 하고 템 플 릿 문법 도 지원 합 니 다.
// Get a location using getDatabasesPath
var databasesPath = await getDatabasesPath();
String path = join(databasesPath, 'demo.db');
// Delete the database
await deleteDatabase(path);
// open the database
Database database = await openDatabase(path, version: 1,
onCreate: (Database db, int version) async {
// When creating the db, create the table
await db.execute(
'CREATE TABLE Test (id INTEGER PRIMARY KEY, name TEXT, value INTEGER, num REAL)');
});
// Insert some records in a transaction
await database.transaction((txn) async {
int id1 = await txn.rawInsert(
'INSERT INTO Test(name, value, num) VALUES("some name", 1234, 456.789)');
print('inserted1: $id1');
int id2 = await txn.rawInsert(
'INSERT INTO Test(name, value, num) VALUES(?, ?, ?)',
['another name', 12345678, 3.1416]);
print('inserted2: $id2');
});
// Update some record
int count = await database.rawUpdate(
'UPDATE Test SET name = ?, value = ? WHERE name = ?',
['updated name', '9876', 'some name']);
print('updated: $count');
// Get the records
List<Map> list = await database.rawQuery('SELECT * FROM Test');
List<Map> expectedList = [
{'name': 'updated name', 'id': 1, 'value': 9876, 'num': 456.789},
{'name': 'another name', 'id': 2, 'value': 12345678, 'num': 3.1416}
];
print(list);
print(expectedList);
assert(const DeepCollectionEquality().equals(list, expectedList));
// Count the records
count = Sqflite
.firstIntValue(await database.rawQuery('SELECT COUNT(*) FROM Test'));
assert(count == 2);
// Delete a record
count = await database
.rawDelete('DELETE FROM Test WHERE name = ?', ['another name']);
assert(count == 1);
// Close the database
await database.close();
이상 은 Flutter 에서 자주 사용 하 는 플러그 인 을 모 은 상세 한 내용 입 니 다.Flutter 에서 자주 사용 하 는 플러그 인 에 관 한 자 료 는 다른 관련 글 을 주목 하 십시오!
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
【Flutter】DateTime 전월의 일수를 취득한다달의 일수를 취득할 필요가 있어, 의외로 수요 있을까라고 생각했으므로 비망록 정도에 남겨 둡니다. DateTime 날짜에 0을 입력하면 전월 DateTime이 됩니다. 2021년 3월 0일 = 2021년 2월 28일...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
좋은 웹페이지 즐겨찾기
