flutter_physics_ui 0.0.1

Physics-based UI elements that respond to touch and gravity

example/lib/main.dart

import 'package:flutter/material.dart';

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

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Physics UI Example',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        useMaterial3: true,
      ),
      home: const PhysicsUIExamplePage(),
    );
  }
}

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

  @override
  State<PhysicsUIExamplePage> createState() => _PhysicsUIExamplePageState();
}

class _PhysicsUIExamplePageState extends State<PhysicsUIExamplePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Flutter Physics UI Example'),
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
      ),
      body: const Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Text(
              'Physics-based UI Elements',
              style: TextStyle(fontSize: 24.0, fontWeight: FontWeight.bold),
            ),
            SizedBox(height: 20.0),
            Text(
              'Touch and drag the elements below to see physics in action!',
              style: TextStyle(fontSize: 16.0),
              textAlign: TextAlign.center,
            ),
            SizedBox(height: 40.0),
            PhysicsPlayground(),
          ],
        ),
      ),
    );
  }
}

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

  @override
  State<PhysicsPlayground> createState() => _PhysicsPlaygroundState();
}

class _PhysicsPlaygroundState extends State<PhysicsPlayground> {
  @override
  Widget build(BuildContext context) {
    return Container(
      width: 300.0,
      height: 400.0,
      decoration: BoxDecoration(
        border: Border.all(color: Colors.grey),
        borderRadius: BorderRadius.circular(8.0),
      ),
      child: Stack(
        children: [
          // Physics Container
          Positioned(
            left: 50.0,
            top: 50.0,
            child: Container(
              width: 80.0,
              height: 80.0,
              decoration: BoxDecoration(
                color: Colors.blue,
                borderRadius: BorderRadius.circular(8.0),
              ),
              child: const Center(
                child: Text(
                  'Drag Me!',
                  style: TextStyle(
                      color: Colors.white, fontWeight: FontWeight.bold),
                ),
              ),
            ),
          ),

          // Physics Button
          Positioned(
            right: 50.0,
            top: 50.0,
            child: Container(
              width: 80.0,
              height: 80.0,
              decoration: BoxDecoration(
                color: Colors.green,
                borderRadius: BorderRadius.circular(40.0),
              ),
              child: const Center(
                child: Text(
                  'Tap!',
                  style: TextStyle(
                      color: Colors.white, fontWeight: FontWeight.bold),
                ),
              ),
            ),
          ),

          // Physics Card
          Positioned(
            left: 100.0,
            bottom: 100.0,
            child: Container(
              width: 100.0,
              height: 60.0,
              decoration: BoxDecoration(
                color: Colors.orange,
                borderRadius: BorderRadius.circular(8.0),
                boxShadow: [
                  BoxShadow(
                    color: Colors.black.withOpacity(0.2),
                    blurRadius: 4.0,
                    offset: const Offset(2.0, 2.0),
                  ),
                ],
              ),
              child: const Center(
                child: Text(
                  'Card',
                  style: TextStyle(
                      color: Colors.white, fontWeight: FontWeight.bold),
                ),
              ),
            ),
          ),
        ],
      ),
    );
  }
}