Đây là cách tiếp cận của tôi đối với vấn đề của bạn. Điều này dựa trên việc triển khai từ http
gói như ở đây .
Ý tưởng cốt lõi là như sau.
- Tạo một lớp trừu tượng để xác định các phương thức bạn sẽ cần sử dụng.
- Tạo các triển khai cụ thể
web
và android
phụ thuộc mở rộng lớp trừu tượng này.
- Tạo một sơ khai hiển thị một phương thức để trả về thể hiện của triển khai trừu tượng này. Điều này chỉ để giữ cho công cụ phân tích phi tiêu hạnh phúc.
- Trong lớp trừu tượng, nhập tệp sơ khai này cùng với các nhập có điều kiện cụ thể cho
mobile
và web
. Sau đó, trong nhà xây dựng nhà máy của nó trả về thể hiện của việc thực hiện cụ thể. Điều này sẽ được xử lý tự động bằng cách nhập có điều kiện nếu được viết chính xác.
Bước 1 và 4:
import 'key_finder_stub.dart'
// ignore: uri_does_not_exist
if (dart.library.io) 'package:flutter_conditional_dependencies_example/storage/shared_pref_key_finder.dart'
// ignore: uri_does_not_exist
if (dart.library.html) 'package:flutter_conditional_dependencies_example/storage/web_key_finder.dart';
abstract class KeyFinder {
// some generic methods to be exposed.
/// returns a value based on the key
String getKeyValue(String key) {
return "I am from the interface";
}
/// stores a key value pair in the respective storage.
void setKeyValue(String key, String value) {}
/// factory constructor to return the correct implementation.
factory KeyFinder() => getKeyFinder();
}
Bước 2.1: Công cụ tìm khóa Web
import 'dart:html';
import 'package:flutter_conditional_dependencies_example/storage/key_finder_interface.dart';
Window windowLoc;
class WebKeyFinder implements KeyFinder {
WebKeyFinder() {
windowLoc = window;
print("Widnow is initialized");
// storing something initially just to make sure it works. :)
windowLoc.localStorage["MyKey"] = "I am from web local storage";
}
String getKeyValue(String key) {
return windowLoc.localStorage[key];
}
void setKeyValue(String key, String value) {
windowLoc.localStorage[key] = value;
}
}
KeyFinder getKeyFinder() => WebKeyFinder();
Bước 2.2: Công cụ tìm khóa di động
import 'package:flutter_conditional_dependencies_example/storage/key_finder_interface.dart';
import 'package:shared_preferences/shared_preferences.dart';
class SharedPrefKeyFinder implements KeyFinder {
SharedPreferences _instance;
SharedPrefKeyFinder() {
SharedPreferences.getInstance().then((SharedPreferences instance) {
_instance = instance;
// Just initializing something so that it can be fetched.
_instance.setString("MyKey", "I am from Shared Preference");
});
}
String getKeyValue(String key) {
return _instance?.getString(key) ??
'shared preference is not yet initialized';
}
void setKeyValue(String key, String value) {
_instance?.setString(key, value);
}
}
KeyFinder getKeyFinder() => SharedPrefKeyFinder();
Bước 3:
import 'key_finder_interface.dart';
KeyFinder getKeyFinder() => throw UnsupportedError(
'Cannot create a keyfinder without the packages dart:html or package:shared_preferences');
Sau đó, trong bạn main.dart
sử dụng KeyFinder
lớp trừu tượng như thể nó là một triển khai chung. Điều này hơi giống như một mô hình bộ chuyển đổi .
main.dart
import 'package:flutter/material.dart';
import 'package:flutter_conditional_dependencies_example/storage/key_finder_interface.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
KeyFinder keyFinder = KeyFinder();
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: SafeArea(
child: KeyValueWidget(
keyFinder: keyFinder,
),
),
);
}
}
class KeyValueWidget extends StatefulWidget {
final KeyFinder keyFinder;
KeyValueWidget({this.keyFinder});
@override
_KeyValueWidgetState createState() => _KeyValueWidgetState();
}
class _KeyValueWidgetState extends State<KeyValueWidget> {
String key = "MyKey";
TextEditingController _keyTextController = TextEditingController();
TextEditingController _valueTextController = TextEditingController();
@override
Widget build(BuildContext context) {
return Material(
child: Container(
width: 200.0,
child: Column(
children: <Widget>[
Expanded(
child: Text(
'$key / ${widget.keyFinder.getKeyValue(key)}',
style: TextStyle(fontSize: 20.0, fontWeight: FontWeight.bold),
),
),
Expanded(
child: TextFormField(
decoration: InputDecoration(
labelText: "Key",
border: OutlineInputBorder(),
),
controller: _keyTextController,
),
),
Expanded(
child: TextFormField(
decoration: InputDecoration(
labelText: "Value",
border: OutlineInputBorder(),
),
controller: _valueTextController,
),
),
RaisedButton(
child: Text('Save new Key/Value Pair'),
onPressed: () {
widget.keyFinder.setKeyValue(
_keyTextController.text,
_valueTextController.text,
);
setState(() {
key = _keyTextController.text;
});
},
)
],
),
),
);
}
}
một số ảnh chụp màn hình
Web
di động
localstorage
vàshared preferences
phụ thuộc trong cùng một phương thức hoặc lớp. Điều này có nghĩa là trình biên dịch không thể tạo ra một trong hai phụ thuộc này. Lý tưởng nhất là nhập khẩu nên ẩn những triển khai này. Tôi sẽ cố gắng đưa ra một ví dụ thực hiện rõ ràng.