flutter_chen_keyboard 1.0.0

flutter_chen_keyboard: ^1.0.0 copied to clipboard

example/lib/main.dart

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

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

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Chen Keyboard Demo',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.blue),
        useMaterial3: true,
      ),
      home: const KeyboardDemoPage(),
    );
  }
}

class KeyboardDemoPage extends StatefulWidget {
  const KeyboardDemoPage({super.key});

  @override
  State<KeyboardDemoPage> createState() => _KeyboardDemoPageState();
}

class _KeyboardDemoPageState extends State<KeyboardDemoPage> {
  int _dismissCount = 0;
  String _lastGesture = '无';

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Flutter Chen Keyboard Demo'),
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
      ),
      body: KeyboardDismisser.standard(
        onKeyboardDismissed: () {
          setState(() {
            _dismissCount++;
            _lastGesture = '标准手势';
          });
        },
        child: SingleChildScrollView(
          padding: const EdgeInsets.all(16.0),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              _buildInfoCard(),
              const SizedBox(height: 20),
              _buildGestureDemoSection(),
              const SizedBox(height: 20),
              _buildFormSection(),
              const SizedBox(height: 20),
              _buildAdvancedDemoSection(),
            ],
          ),
        ),
      ),
    );
  }

  Widget _buildInfoCard() {
    return Card(
      child: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            const Text(
              '键盘关闭统计',
              style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
            ),
            const SizedBox(height: 8),
            Text('关闭次数: $_dismissCount'),
            Text('最后手势: $_lastGesture'),
            const SizedBox(height: 8),
            const Text(
              '提示: 点击空白区域或滚动可以关闭键盘',
              style: TextStyle(fontSize: 12, color: Colors.grey),
            ),
          ],
        ),
      ),
    );
  }

  Widget _buildGestureDemoSection() {
    return Card(
      child: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            const Text(
              '手势演示',
              style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
            ),
            const SizedBox(height: 16),
            _buildGestureDemo(
              '点击关闭',
              [GestureType.onTap],
              '点击此区域关闭键盘',
            ),
            const SizedBox(height: 12),
            _buildGestureDemo(
              '双击关闭',
              [GestureType.onDoubleTap],
              '双击此区域关闭键盘',
            ),
            const SizedBox(height: 12),
            _buildGestureDemo(
              '长按关闭',
              [GestureType.onLongPress],
              '长按此区域关闭键盘',
            ),
            const SizedBox(height: 12),
            _buildGestureDemo(
              '拖拽关闭',
              [GestureType.onPanUpdateAnyDirection],
              '在此区域拖拽关闭键盘',
            ),
          ],
        ),
      ),
    );
  }

  Widget _buildGestureDemo(
      String title, List<GestureType> gestures, String description) {
    return KeyboardDismisser(
      gestures: gestures,
      onKeyboardDismissed: () {
        setState(() {
          _dismissCount++;
          _lastGesture = title;
        });
      },
      child: Container(
        padding: const EdgeInsets.all(12),
        decoration: BoxDecoration(
          border: Border.all(color: Colors.grey.shade300),
          borderRadius: BorderRadius.circular(8),
        ),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Text(
              title,
              style: const TextStyle(fontWeight: FontWeight.bold),
            ),
            const SizedBox(height: 4),
            Text(
              description,
              style: TextStyle(fontSize: 12, color: Colors.grey[600]),
            ),
          ],
        ),
      ),
    );
  }

  Widget _buildFormSection() {
    return Card(
      child: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            const Text(
              '表单演示',
              style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
            ),
            const SizedBox(height: 16),
            TextField(
              decoration: const InputDecoration(
                labelText: '用户名',
                border: OutlineInputBorder(),
                prefixIcon: Icon(Icons.person),
              ),
            ),
            const SizedBox(height: 12),
            TextField(
              decoration: const InputDecoration(
                labelText: '邮箱',
                border: OutlineInputBorder(),
                prefixIcon: Icon(Icons.email),
              ),
              keyboardType: TextInputType.emailAddress,
            ),
            const SizedBox(height: 12),
            TextField(
              decoration: const InputDecoration(
                labelText: '密码',
                border: OutlineInputBorder(),
                prefixIcon: Icon(Icons.lock),
              ),
              obscureText: true,
            ),
            const SizedBox(height: 12),
            TextField(
              decoration: const InputDecoration(
                labelText: '手机号',
                border: OutlineInputBorder(),
                prefixIcon: Icon(Icons.phone),
              ),
              keyboardType: TextInputType.phone,
            ),
            const SizedBox(height: 16),
            SizedBox(
              width: double.infinity,
              child: ElevatedButton(
                onPressed: () {
                  // 提交表单
                },
                child: const Text('提交'),
              ),
            ),
          ],
        ),
      ),
    );
  }

  Widget _buildAdvancedDemoSection() {
    return Card(
      child: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            const Text(
              '高级功能演示',
              style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
            ),
            const SizedBox(height: 16),
            _buildAdvancedDemo(
              '延迟关闭 (1秒)',
              KeyboardDismisser(
                gestures: [GestureType.onTap],
                delay: const Duration(seconds: 1),
                onKeyboardDismissed: () {
                  setState(() {
                    _dismissCount++;
                    _lastGesture = '延迟关闭';
                  });
                },
                child: Container(
                  padding: const EdgeInsets.all(12),
                  decoration: BoxDecoration(
                    border: Border.all(color: Colors.orange.shade300),
                    borderRadius: BorderRadius.circular(8),
                  ),
                  child: const Text('点击后1秒关闭键盘'),
                ),
              ),
            ),
            const SizedBox(height: 12),
            _buildAdvancedDemo(
              '仅垂直拖拽关闭',
              KeyboardDismisser(
                gestures: [
                  GestureType.onPanUpdateDownDirection,
                  GestureType.onPanUpdateUpDirection
                ],
                onKeyboardDismissed: () {
                  setState(() {
                    _dismissCount++;
                    _lastGesture = '垂直拖拽';
                  });
                },
                child: Container(
                  padding: const EdgeInsets.all(12),
                  decoration: BoxDecoration(
                    border: Border.all(color: Colors.green.shade300),
                    borderRadius: BorderRadius.circular(8),
                  ),
                  child: const Text('仅垂直拖拽关闭键盘'),
                ),
              ),
            ),
            const SizedBox(height: 12),
            _buildAdvancedDemo(
              '多手势组合',
              KeyboardDismisser(
                gestures: [
                  GestureType.onTap,
                  GestureType.onDoubleTap,
                  GestureType.onLongPress,
                ],
                onKeyboardDismissed: () {
                  setState(() {
                    _dismissCount++;
                    _lastGesture = '多手势';
                  });
                },
                child: Container(
                  padding: const EdgeInsets.all(12),
                  decoration: BoxDecoration(
                    border: Border.all(color: Colors.purple.shade300),
                    borderRadius: BorderRadius.circular(8),
                  ),
                  child: const Text('支持点击、双击、长按关闭键盘'),
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }

  Widget _buildAdvancedDemo(String title, Widget child) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Text(
          title,
          style: const TextStyle(fontWeight: FontWeight.bold),
        ),
        const SizedBox(height: 4),
        child,
      ],
    );
  }
}