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

number_pagination のカバー
パッケージ詳細v1.1.6

number_pagination

数値を使用したページネーションで、古典的なウェブスタイルのページネーションに似ています。無限スクロールではなく、番号でページを探索します!

AndroidiOSWebmacOSWindowsLinux
30日間ダウンロード
4550
いいね数
74
Pub ポイント
160

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

flutter pub add number_pagination

パッケージ概要

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

NumberPagination は、離散的な番号付きリンクによるページナビゲーションを必要とするアプリケーションに適した、従来の数値ベースのページネーションインターフェースを提供するFlutterパッケージです。古典的なウェブスタイルのページネーションを模倣しており、無限スクロールに頼らず、特定のページに直接ジャンプできるようにします。このパッケージはAndroid、iOS、Web、macOS、Windows、Linuxなど複数のプラットフォームをサポートしており、クロスプラットフォームアプリに非常に柔軟に対応しています。ページ範囲の表示、最初/最後のページボタン、カスタマイズ可能なスタイルを内蔵したクリーンでカスタマイズ可能なUIを提供します。正確なナビゲーションが不可欠なデータ量の多いインターフェースに最適です。

用途

  • 構造的な方法で大規模なデータセットを表示する
  • ダッシュボードにおける使いやすいナビゲーションの作成
  • 検索結果のページネーションの実装
  • ページコントロールを使用して管理パネルを構築する
  • コンテンツリストでの直接ページジャンプの有効化

主な機能

  • ページ番号ボタン
  • 最初/最終ページのナビゲーションをサポート
  • カスタマイズ可能なスタイルオプション
  • クロスプラットフォーム互換性
  • 設定可能なページ範囲表示
  • すべての画面サイズに対応するレスポンシブデザイン

適している対象

  • ウェブ風のページネーションを構築する開発者
  • 構造化データナビゲーションが必要なアプリ
  • 無限スクロールよりも使いやすさを重視するプロジェクト
  • マルチプラットフォームデプロイメントをターゲットとするチーム
  • シンプルで直感的なページコントロールを望むユーザー

注意事項

  • カスタムテーマ用に追加のスタイル設定が必要になる場合があります
  • パフォーマンスの最適化が行われない限り、非常に大きなデータセットには適していない
  • 数値ナビゲーションに限定(無限スクロールなし)
  • ページデータの読み込みを手動で処理する必要があります
  • 既知の総ページ数を持つシナリオに最適

元の README

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

preview

number_pagination flutter flutter test package

ko-fi

Implementing Flutter Number Pagination using a Popular Web Approach.

This package is very simple. Without depending on other packages.

Its usage is also simple and easy.

document

NumberPagination

A customizable pagination widget for Flutter applications.

Overview

NumberPagination is a Flutter widget that provides an intuitive and flexible way to implement pagination in your applications. It displays page numbers and navigation controls, allowing users to easily navigate through multiple pages of content.

Features

  • Page number buttons
  • Navigation controls (first, previous, next, last)
  • Customizable appearance
  • Responsive design

Installation

Add this to your package's pubspec.yaml file:

dependencies:
  number_pagination: ^1.1.0

Customization Options for NumberPagination Widget

The NumberPagination widget offers a wide range of customization options to tailor its appearance and behavior to your needs. Below is a comprehensive list of these options:

Page Display

Option Type Description Default
visiblePagesCount int Number of page numbers to display at once 10
currentPage int Currently displayed page number Required
totalPages int Total number of pages available Required

Text Styling

Option Type Description Default
fontSize double Font size for the page numbers 15
fontFamily String? Font family for the page numbers null

Button Styling

Option Type Description Default
buttonElevation double Elevation of the buttons 5
buttonRadius double Radius of the buttons 0
controlButtonSize Size Size of the control buttons Size(48, 48)
numberButtonSize Size Size of the number buttons Size(48, 48)

Colors

Option Type Description Default
selectedTextColor Color Text color for the selected page button Colors.white
unSelectedTextColor Color Text color for unselected page buttons Colors.black
selectedButtonColor Color Background color of the selected page button Colors.black
unSelectedButtonColor Color Background color of unselected page buttons Colors.white
controlButtonColor Color Background color of control buttons Colors.white

Icons

Option Type Description Default
firstPageIcon Widget Icon for the "first page" button Icon(Icons.first_page)
previousPageIcon Widget Icon for the "previous page" button Icon(Icons.keyboard_arrow_left)
nextPageIcon Widget Icon for the "next page" button Icon(Icons.keyboard_arrow_right)
lastPageIcon Widget Icon for the "last page" button Icon(Icons.last_page)

Spacing

Option Type Description Default
navigationButtonSpacing double Spacing between navigation buttons 4.0
sectionSpacing double Spacing between navigation buttons and page number buttons 10.0
betweenNumberButtonSpacing double Spacing between individual number buttons 3

Callback

Option Type Description
onPageChanged Function(int) Callback function triggered when the page changes

These customization options allow you to fine-tune the appearance and behavior of the NumberPagination widget to seamlessly integrate with your app's design and functionality.

カテゴリー

ソースリポジトリ

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