Flutter屏幕锁定插件wn_lock的使用

WN_LOCK

一款用于Flutter的N宫格锁屏，但你可以发挥更多的创意！它是否能带来你意想不到的功能呢？

最新版本

在pubspec.yaml文件中添加以下依赖项：

dependencies:
  wn_lock: ^version

演示

以下是不同样式的锁屏效果展示：

示例1	示例2	示例3

例子

使用示例：

[@override](/user/override)
void initState() {
  super.initState();
  // 初始化控制器
  _lockController = LockController();
  // 添加监听器（建议在dispose时移除）
  _lockController.addListener(_lockListener);
}

[@override](/user/override)
void dispose() {
  super.dispose();
  _lockController.removeListener(_lockListener);
}

// 监听器回调函数
void _lockListener() {
  // 打印用户滑动的点的索引数组
  print('${_lockController.value.offsets}');
}

// 构建锁屏组件
WNLockWidget(
  lineColor: Colors.amber,   // 线条颜色
  lineWidth: 2,              // 线条宽度
  attr: SquareAttr(          // 自定义样式：正方形属性
    length: 5,
    color: Colors.amber,
    width: 2,
  ),
  controller: _lockController, // 控制器
  width: 300,                // 宽度
  height: 400,               // 高度
  row: 5,                    // 行数
  column: 5,                 // 列数
)

参数说明

以下是WNLockWidget的主要参数及其说明：

示例代码

以下是完整的示例代码，可直接运行：

import 'package:flutter/material.dart';
import 'package:wn_lock/wn_lock.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        primarySwatch: Colors.blue,
        visualDensity: VisualDensity.adaptivePlatformDensity,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  [@override](/user/override)
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  LockController _lockController;

  [@override](/user/override)
  void initState() {
    super.initState();
    _lockController = LockController();
    _lockController.addListener(_lockListener);
  }

  [@override](/user/override)
  void dispose() {
    super.dispose();
    _lockController.removeListener(_lockListener);
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: WNLockWidget(
          lineColor: Colors.redAccent, // 线条颜色
          lineWidth: 2,                // 线条宽度
          attr: HeartAttr(             // 自定义样式：心形属性
            color: Colors.lightGreen,
            width: 2,
          ),
          controller: _lockController, // 控制器
          width: 300,                  // 宽度
          height: 400,                 // 高度
          row: 7,                      // 行数
          column: 5,                   // 列数
        ),
      ),
    );
  }

  void _lockListener() {
    print('${_lockController.value.offsets}');
  }
}