reflective_visual 2.0.0 copy "reflective_visual: ^2.0.0" to clipboard
reflective_visual: ^2.0.0 copied to clipboard

Reflective visual for flutter apps.

example/lib/main.dart

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

import 'package:reflective_visual/reflective_visual.dart';

Future<void> main() async {
  SystemChrome.setEnabledSystemUIMode(SystemUiMode.leanBack);
  runApp(
    const MaterialApp(
      home: HomePage(),
      debugShowCheckedModeBanner: false,
    ),
  );
}

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

  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  bool loading = true;

  @override
  void initState() {
    _toggleLoading(context);
    super.initState();
  }

  @override
  Widget build(BuildContext context) => ReflectivePage(
        body: SafeArea(
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              _header(context),
              const SizedBox(height: 32),
              _avatars(context),
              const SizedBox(height: 30),
              _list(context),
            ],
          ),
        ),
      );

  Widget _header(BuildContext context) => Padding(
        padding: const EdgeInsets.all(28),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: const [
            Text(
              'Hey Mehran!',
              style: TextStyle(fontSize: 38, fontWeight: FontWeight.w900),
            ),
            SizedBox(height: 4),
            Text(
              'Let\'s get start!',
              style: TextStyle(fontSize: 16),
            ),
          ],
        ),
      );

  Widget _avatars(BuildContext context) => SingleChildScrollView(
        scrollDirection: Axis.horizontal,
        child: Row(
          children: [
            _singleAvatar(context),
            _singleAvatar(context),
            _singleAvatar(context),
            _singleAvatar(context),
            _singleAvatar(context),
            _singleAvatar(context),
            _singleAvatar(context),
            _singleAvatar(context),
            _singleAvatar(context),
          ],
        ),
      );

  Widget _singleAvatar(BuildContext context) => Column(
        mainAxisAlignment: MainAxisAlignment.center,
        crossAxisAlignment: CrossAxisAlignment.center,
        children: [
          Container(
            margin: const EdgeInsets.symmetric(horizontal: 10),
            padding: const EdgeInsets.all(3),
            width: 64,
            height: 64,
            decoration: BoxDecoration(
              borderRadius: BorderRadius.circular(100),
              border: Border.all(),
            ),
          ),
          const SizedBox(height: 4),
          const Text('name')
        ],
      );

  Widget _list(BuildContext context) => Expanded(
        child: SingleChildScrollView(
          child: Padding(
            padding: const EdgeInsets.symmetric(horizontal: 10),
            child: Column(
              children: [
                _singleListItem(context),
                _singleListItem(context),
                _singleListItem(context),
                _singleListItem(context),
                _singleListItem(context),
                _singleListItem(context),
                _singleListItem(context),
                _singleListItem(context),
                _singleListItem(context),
                _singleListItem(context),
                _singleListItem(context),
                _singleListItem(context),
                _singleListItem(context),
                _singleListItem(context),
              ],
            ),
          ),
        ),
      );

  Widget _singleListItem(BuildContext context) => Padding(
        padding: const EdgeInsets.symmetric(vertical: 12),
        child: Row(
          children: [
            Container(
              margin: const EdgeInsets.symmetric(horizontal: 10),
              // padding: const EdgeInsets.all(3),
              width: 46,
              height: 46,
              decoration: BoxDecoration(
                borderRadius: BorderRadius.circular(100),
                border: Border.all(),
              ),
            ),
            const SizedBox(width: 5),
            Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: const [
                // loading
                //     ? RContainer(width: Random().nextDouble() * 100 + 40 , height: 12, radius: 2)
                // :
                Text(
                  'Mehran Shoghi',
                  style: TextStyle(fontSize: 15),
                ),
                SizedBox(height: 2),
                // loading
                //       ? RContainer(width: Random().nextDouble() * 60 + 20 , height: 10, radius: 2)   :
                Text(
                  'Flutter Developer',
                  style: TextStyle(fontSize: 12),
                ),
              ],
            ),
          ],
        ),
      );

  void _toggleLoading(BuildContext context) async {
    await Future.delayed(const Duration(seconds: 14));
    setState(() => loading = false);
  }
}
92
likes
140
points
68
downloads

Publisher

unverified uploader

Weekly Downloads

Reflective visual for flutter apps.

Repository (GitHub)

Documentation

API reference

License

MIT (license)

Dependencies

blur, camera, flutter

More

Packages that depend on reflective_visual