Flutter插件echo_utils的使用详解

一些简单widget，方便少写代码

特性

封装了一些简单widget

开始使用

import 'package:echo_utils/echo_utils.dart';

简单使用

以下是一个简单的示例，展示如何在Flutter应用程序中使用echo_utils插件。

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

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

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});
  final String title;

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

class _MyHomePageState extends State<MyHomePage> {

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            // 使用EchoButton
            EchoButton(buttonName: 'echoButton', onPressed: () {
              List<BottomSheetModel> modes = [
                BottomSheetModel(title: "title", onPressed: (){},preWidget: const Icon(Icons.add)),
                BottomSheetModel(title: "title2", onPressed: (){}),
              ];
              echoBottomSheet(context, modes);
            },),
          ],
        ),
      ),
    );
  }
}

额外信息

欢迎大家使用并提出建议！

示例代码说明

LoginPage 示例

class LoginPage extends StatefulWidget {
  [@override](/user/override)
  State<LoginPage> createState() => _LoginPageState();
}

class _LoginPageState extends State<LoginPage> {

  [@override](/user/override)
  void initState() {
    super.initState();
    WidgetsBinding.instance?.addPostFrameCallback((_) {
      _showBottomSheet();
    });
  }

  void _showBottomSheet() {
    showModalBottomSheet(
      backgroundColor: Colors.transparent,
      context: context,
      builder: (BuildContext sheetContext) {
        return Container(
          padding: const EdgeInsets.all(16.0),
          margin: const EdgeInsets.all(16.0),
          decoration: BoxDecoration(
              color: Colors.white,
              borderRadius: BorderRadius.circular(12)
          ),
          child: Column(
            mainAxisSize: MainAxisSize.min,
            children: [
              Text('权限申请'),
              SizedBox(height: 16.0),
              Text('App需要相机权限以正常使用，请点击同意按钮以授予权限。'),
              SizedBox(height: 16.0),
              ElevatedButton(
                onPressed: () {
                  Navigator.of(sheetContext).pop();
                  Permission.camera.request().then((status) {
                    if (status.isGranted) {
                      _performLogin();
                    } else {
                      print('用户拒绝了相机权限');
                    }
                  });
                },
                child: Text('同意'),
              ),
            ],
          ),
        );
      },
    );
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('LoginPage')),
      body: Center(
        child: Column(
          children: [
            GestureDetector(
                onTap: () {
                  // 权限申请逻辑
                },
                child: Text("权限申请")),
            EchoRatingStar(
              initSelectStarNum: 3,
              selectCallback: (selected) {
                if (kDebugMode) {
                  print("选择了$selected");
                }
              },
            ),
            ElevatedButton(
              onPressed: () => Navigator.push(
                context,
                MaterialPageRoute(
                    builder: (_) => const MyHomePage(title: ''))),
              child: const Text('Page2'),
            ),
          ],
        ),
      ),
    );
  }

  void _performLogin() {
    print('用户已登录');
  }
}

MyHomePage 示例

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});
  final String title;

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

class _MyHomePageState extends State<MyHomePage> {
  double currentScale = 1;

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text("haha"),
        actions: [
          WPopupMenu(onValueChanged: (selected) {}, actions: const ["复制", "转发", "删除"],
            menuWidth: 200, menuHeight: 40, pressType: PressType.singleClick, child: Container(color: Colors.black54, child: const Icon(Icons.access_alarm),))
        ],
      ),
      body: Column(
        children: [
          const EchoLoginInput(),
          const EchoLoginInput(isPassword: true,),
          Center(
            child: EchoDragContainer(
              child: const Icon(
                CupertinoIcons.airplane,
                size: 100,
                color: Colors.deepPurpleAccent,
              ),
              onTap: () {
                echoLog("点击事件发生!");
                return WPopupMenu(onValueChanged: (selected) {}, actions: const ["复制", "转发", "删除"],
                  menuWidth: 200, menuHeight: 40, pressType: PressType.singleClick, child: Container(color: Colors.black54, child: const Icon(Icons.access_alarm),));
              },
              getPositionAndSize: (leftTopPosition, size) {
                echoLog("当前widget的左上角的位置是$leftTopPosition, widget的大小是$size");
              },
            ),
          ),
        ],
      ),
    );
  }
}