パッケージ、リポジトリ、アプリカテゴリを検索

パッケージ詳細v0.0.9

equal_space

均等な間隔の行と列を作成するためのFlutterパッケージ。

AndroidiOSWebmacOSWindowsLinux
30日間ダウンロード
41
いいね数
11
Pub ポイント
150

パッケージをインストール

flutter pub add equal_space

パッケージ概要

公開情報に基づく選定ガイドです。参考としてご利用ください。

Equal_Space は、均等なスペースをもつ行と列を作成することを簡素化するための Flutter パッケージです。複雑な計算やカスタムウィジェットを必要とせずに、レイアウト内の子要素間に一貫した余白を保証します。均一な配置が必要な UI に最適で、Android、iOS、Web、macOS、Windows、Linux といったすべての主要プラットフォームをサポートしています。シンプルな pub add コマンドにより、既存の Flutter プロジェクトにスムーズに統合できます。等間隔で要素を配置する際のボイラープレートコードを削減し、レイアウトの一貫性を高めます。

用途

  • 均一なグリッドレイアウトの作成
  • レスポンシブフォームの設計
  • 一貫したカード配置の構築
  • アイコンやボタンを均等に整列する
  • 対称的なUIコンポーネントの実装

主な機能

  • 自動的な均等な間隔
  • 行と列の両方をサポートしています
  • クロスプラットフォーム互換性
  • 最小限のセットアップが必要
  • 追加の依存関係なし

適している対象

  • レイアウトのシンプルさを求めるUI開発者
  • 一貫したスペースが必要なプロジェクト
  • Flutterレイアウトを学ぶ初心者
  • 繰り返しの視覚パターンを持つアプリ
  • レスポンシブデザインの実装

注意事項

  • スペースの範囲を超えたカスタマイズは限られている
  • 複雑な動的レイアウトには適していません
  • ネストされた構造では追加の制約が必要になる場合があります
  • 子ごとの変動する間隔をサポートしていません
  • 静的または予測可能なレイアウトに最適

元の README

関連するソースリポジトリの README 原文のスナップショットです。最新の内容はリポジトリをご覧ください。

Equal Space

Learn More

About

Equal Space is a Flutter package that allows you stop using SizedBox for spacing between widgets. it simplifies the process of creating evenly spaced rows and columns in your Flutter applications. This package provides custom widgets, SpacedRow and SpacedColumn, which make it easy to manage spacing and alignment of child widgets.

Features

  • Customizable Spacing: Easily adjust the space between child widgets.
  • Flexible Alignment: Support for main axis and cross axis alignment.
  • Simplified Code: Reduces boilerplate code for spacing in rows and columns.

Learn More

SpacedColumn Example
class MyWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return SpacedColumn(
      space: 26.0,
      mainAxisAlignment: MainAxisAlignment.center,
      mainAxisSize: MainAxisSize.min,
      crossAxisAlignment: CrossAxisAlignment.end,
      textDirection: TextDirection.rtl,
      verticalDirection: VerticalDirection.down,
      textBaseline: TextBaseline.alphabetic,
      children: [
        Container(width: 50, height: 50, color: Colors.red),
        Container(width: 50, height: 50, color: Colors.green),
        Container(width: 50, height: 50, color: Colors.blue),
      ],
    );
  }
}
SpacedRow Example
class MyWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return SpacedRow(
       space: 26.0,
       mainAxisAlignment: MainAxisAlignment.center,
       mainAxisSize: MainAxisSize.min,
       crossAxisAlignment: CrossAxisAlignment.end,
       textDirection: TextDirection.rtl,
       verticalDirection: VerticalDirection.down,
       textBaseline: TextBaseline.alphabetic,
       children: [
         Container(width: 50, height: 50, color: Colors.red),
         Container(width: 50, height: 50, color: Colors.green),
         Container(width: 50, height: 50, color: Colors.blue),
       ],
    );
  }
}
Installation
flutter pub add equal_space
import 'package:equal_space/equal_space.dart';

Learn More

Explanation
  • Overview: Stop using SizedBox for adding up space in your widgets.
  • Features: You can user mainAxis * crossAxisAligments with one more propery space.
  • Benigit: Examples SpacedRow and SpacedColumn widgets shows how effective this package is.
  • Example: Instructions to run the example app.
  • Contributions: Feel free to fork the repo.
  • License: MIT License.
  • Connect with Us: Click below to visit my YouTube channel & Github.

Learn More Learn More

カテゴリー

ソースリポジトリ

このパッケージを使用しているプロジェクト

データはまだありません。