zefyr的引入

  1. dependencies:
  2.   flutter:
  3.     sdk: flutter
  6.   # 因为直接引用包会导致使用的时候有个方法少了一个参数,是版本的问题,这样引入就可以
  7.   cupertino_icons: ^0.1.3
  8.   zefyr:
  9.     git:
  10.       url: https://github.com/memspace/zefyr.git
  11.       path: packages/zefyr

在项目中使用 zwfyr

  1. import 'dart:convert';
  2. import 'dart:io';
  4. import 'package:flutter/material.dart';
  5. import 'package:quill_delta/quill_delta.dart';
  6. import 'package:zefyr/zefyr.dart';
  8. class EditorPage extends StatefulWidget {
  9.   @override
  10.   EditorPageState createState() => EditorPageState();
  11. }
  13. class EditorPageState extends State<EditorPage> {
  14.   /// Allows to control the editor and the document.
  15.   ZefyrController _controller;
  17.   /// 焦点节点
  18.   FocusNode _focusNode;
  20.   @override
  21.   void initState() {
  22.     super.initState();
  23.     _focusNode = FocusNode();
  24.     _loadDocument().then((document) {
  25.       setState(() {
  26.         _controller = ZefyrController(document);
  27.       });
  28.     });
  29.   }
  31.   @override
  32.   Widget build(BuildContext context) {
  33.     final body = (_controller == null)
  34.         ? Center(child: CircularProgressIndicator())
  35.         : ZefyrScaffold(
  36.             child: ZefyrEditor(
  37.               padding: EdgeInsets.all(16),
  38.               controller: _controller,
  39.               focusNode: _focusNode,
  40.             ),
  41.           );
  43.     return Scaffold(
  44.       appBar: AppBar(
  45.         title: Text('Editor page'),
  46.         actions: <Widget>[
  47.           Builder(
  48.             builder: (context) => IconButton(
  49.               icon: Icon(Icons.save),
  50.               onPressed: () => _saveDocument(context),
  51.             ),
  52.           )
  53.         ],
  54.       ),
  55.       body: body,
  56.     );
  57.   }
  59.   /// 如果需要一个页面有多个可以点击 需要配置多个json
  60.   /// 如果.json 文件存在就加载,如果不存在就使用默认的
  61.   Future<NotusDocument> _loadDocument() async {
  62.     final file = File(Directory.systemTemp.path + '/quick_start.json');
  63.     if (await file.exists()) {
  64.       final contents = await file
  65.           .readAsString()
  66.           .then((data) => Future.delayed(Duration(seconds: 1), () => data));
  67.       return NotusDocument.fromJson(jsonDecode(contents));
  68.     }
  69.     /// 默认数据
  70.     final delta = Delta()..insert('Zefyr Quick Start\n');
  71.     return NotusDocument.fromDelta(delta);
  72.   }
  74.   /// 保存写入的数据
  75.   void _saveDocument(BuildContext context) {
  76.     // Notus documents can be easily serialized to JSON by passing to
  77.     // `jsonEncode` directly:
  78.     final contents = jsonEncode(_controller.document);
  79.     // For this example we save our document to a temporary file.
  80.     final file = File(Directory.systemTemp.path + '/quick_start.json');
  81.     // And show a snack bar on success.
  82.     file.writeAsString(contents).then((_) {
  83.       Scaffold.of(context).showSnackBar(SnackBar(content: Text('Saved.')));
  84.     });
  85.   }
  86. }