flutter_spacer

Visão geral do pacote

Orientação gerada a partir de informações públicas. Apenas para referência.

flutter_spacer é um pacote Flutter que simplifica o espaçamento de widgets usando porcentagens da largura ou altura da tela. Ele oferece uma maneira limpa e intuitiva de adicionar espaçamento responsivo entre elementos da interface sem precisar calcular valores manualmente. Ideal para criar layouts consistentes em diferentes tamanhos e orientações de tela, ele aumenta a flexibilidade do layout e reduz o código repetitivo. O pacote suporta todas as principais plataformas, garantindo consistência entre plataformas. É particularmente útil em formulários, grades e designs responsivos onde o espaçamento proporcional é essencial.

Casos de uso

Layouts de UI responsivos
Espaçamento do formulário
Alinhamento de grade
Design multiplataforma
Preenchimento dinâmico
Centralizar widgets

Principais recursos

Espaçamento baseado em porcentagem
Suporta largura e altura
Compatibilidade multiplataforma
Boilerplate mínimo
Integração fácil
design responsivo

Indicado para

Desenvolvedores criando aplicativos responsivos
Designers de UI procurando espaçamento preciso
Projetos que exigem dimensionamento de layout consistente
Equipes que priorizam código mantível
Aplicativos destinados a múltiplos tamanhos de dispositivo

Considerações

Requer entendimento de layout baseado em porcentagem
Pode ser necessário restrições adicionais em layouts complexos
Não ideal para necessidades de espaçamento fixo de pixels
Limitado à funcionalidade de espaçamento apenas
Melhor usado com outros widgets de layout

README original

Snapshot do README original do repositório-fonte vinculado. Consulte o repositório para o conteúdo mais recente.

flutter_spacer is a Dart package that simplifies the creation of responsive layouts by providing utilities for easily spacing between widgets in terms of percentage of screen width or height.

Features

Extension Methods: Use extension methods on num to create SizedBox widgets with a percentage of the screen width or height.
Responsive Utilities: The package includes utilities to get the device's height and width, making it easy to create responsive layouts.

Getting started

To use this package, add flutter_spacer to your pubspec.yaml file

  dependencies:
  flutter_spacer: ^1.0.2 # use the latest version

 dart pub add flutter_spacer

Usage

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

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return FlutterSpacer(
      builder: (context) {
        return MaterialApp(
          title: 'My App',
          home: MyHomePage(),
        );
      },
    );
  }
}

class MyHomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('My App'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Container(
          
              height: 20,
              width: 50,
              color: Colors.blue,
              child: Center(
                child: Text(
                  'first Container',
                  style: TextStyle(color: Colors.white),
                ),
              ),
            ),
            
            20.hs // give you space of 20%
            Container(
          
              height: 20,
              width: 50,
              color: Colors.blue,
              child: Center(
                child: Text(
                  'Second Container',
                  style: TextStyle(color: Colors.white),
                ),
              ),
            ),

          ],
        ),
      ),
    );
  }
}

Additional Information

Thank you for using the flutter_spacer package! Here's some additional information to help you make the most out of this package:

Issues and Contributions

If you encounter any issues with the package or have suggestions for improvements, feel free to open an issue on the GitHub repository. Contributions are welcome, and we appreciate any help to make this package better.

License

This project is licensed under the MIT License. Feel free to review the terms and conditions.

Contact

For any further inquiries or communication, you can reach out to the package maintainer:

Maintainer: Mustafa majid
Email: mstafadev0@gmail.com

Support the Project

If you find this package helpful, consider giving it a star on GitHub and spreading the word. Your support is greatly appreciated!

Happy coding! 🚀

Buscar pacotes, repositórios e categorias de apps

Instalar pacote