श्रेणियाँ, पैकेज और रिपॉज़िटरी खोजें

पैकेज विवरणv0.0.2

scrollable_reorderable_navbar

एक नीचे का नैविगेशन बार जो जब 5 से अधिक नैविगेशन आइटम हों तो स्क्रॉल कर सकता है। इसमें उपयोगकर्ता आइटम की स्थिति को स्वाइप करने की अनुमति भी देता है और आइटम को नैविगेशन बार से हटाया जा सकता है।

AndroidiOSWebmacOSWindowsLinux
30-दिन डाउनलोड
15
लाइक
30
Pub अंक
140

पैकेज इंस्टॉल करें

flutter pub add scrollable_reorderable_navbar

पैकेज अवलोकन

सार्वजनिक जानकारी से बना चयन मार्गदर्शन। केवल संदर्भ हेतु।

Flutter के लिए एक स्क्रॉल करने योग्य और पुनर्व्यवस्थित करने योग्य बॉटम नेविगेशन बार जो पांच से अधिक आइटम मौजूद होने पर डायनामिक रूप से अनुकूलित होता है। उपयोगकर्ता आइटम को पुनर्व्यवस्थित करने के लिए स्वाइप कर सकते हैं और नेविगेशन बार से सीधे उन्हें हटा सकते हैं। बहुत सारे टैब वाले ऐप्स में सुगम नेविगेशन के लिए डिज़ाइन किया गया, यह मोबाइल और डेस्कटॉप प्लेटफॉर्म दोनों पर उपयोगकर्ता अनुभव को बढ़ाता है। पैकेज सभी प्रमुख प्लेटफॉर्म जैसे Android, iOS, Web, macOS, Windows और Linux को समर्थन देता है। यह चिकनी स्क्रॉलिंग के साथ हथेली-आधारित पुनर्व्यवस्थिति और हटाने को जोड़ता है, जिससे नेविगेशन आइटम को प्रबंधित करने के लिए लचीला इंटरफेस प्रदान करता है।

उपयोग

  • 5 से अधिक नेविगेशन आइटम वाले ऐप्स
  • कस्टमाइज़ेबल बॉटम नेविगेशन लेआउट
  • उपयोगकर्ता-नेतृत्व टैब पुनर्व्यवस्था
  • डायनामिक नेविगेशन आइटम प्रबंधन
  • डेस्कटॉप और मोबाइल क्रॉस-प्लेटफॉर्म ऐप्स

मुख्य विशेषताएँ

  • 5 आइटम से अधिक होने पर स्क्रॉल करें
  • स्वाइप-टू-रिऑर्डर कार्यक्षमता
  • नेविगेशन आइटम को हटाना
  • क्रॉस-प्लेटफॉर्म समर्थन (Android, iOS, Web, macOS, Windows, Linux)
  • चिकनी गति-आधारित इंटरैक्शन

इनके लिए उपयुक्त

  • लचीले बॉटम नेविगेशन बार की आवश्यकता वाले डेवलपर्स
  • गतिशील नेविगेशन कस्टमाइजेशन की आवश्यकता वाले ऐप्स
  • कई प्लेटफॉर्म के लिए प्रोजेक्ट्स
  • UIs with frequent user interaction on navigation
  • इंटरैक्टिव नेविगेशन कंपोनेंट्स की तलाश कर रहे डिजाइनर

विचार योग्य बातें

  • अतिरिक्त अवस्था प्रबंधन की आवश्यकता हो सकती है
  • स्थिर नेविगेशन सेटअप के लिए आदर्श नहीं
  • बहुत बड़ी आइटम सूचियों के साथ प्रदर्शन प्रभाव
  • निम्न नेविगेशन लेआउट तक सीमित
  • आइटम डिलीशन यूएक्स के सावधानीपूर्वक संभालने की आवश्यकता है

मूल README

संबंधित सोर्स रिपॉज़िटरी के मूल README का स्नैपशॉट। नवीनतम सामग्री के लिए रिपॉज़िटरी देखें।

ScrollableReordableNavbar for Flutter

A flutter plugin for create bottom nav bar that can be scrolled when there are than 5 nav items to display. It also let user swipe items position and item can be deleted from the navbar.

Installing:

In your pubspec.yaml

dependencies:
  scrollable_reorderable_navbar: ^0.0.1
import 'package:scrollable_reorderable_navbar/scrollable_reorderable_navbar.dart';


Basic Usage:

    ScrollableReorderableNavBar(
      onItemTap: (arg) {
        setState(() {
          _selectedIndex = arg;
        });
      },
      onReorder: (oldIndex, newIndex) {
        final currItem = _items[_selectedIndex];
        if (oldIndex < newIndex) newIndex -= 1;
          final newItems = [..._items], item = newItems.removeAt(oldIndex);
          newItems.insert(newIndex, item);
        setState(() {
          _items = newItems;
          _selectedIndex = _items.indexOf(currItem);
        });
      },
    items: _items,
    selectedIndex: _selectedIndex,
    onDelete: (index) => setState(() => _items.removeAt(index)),
    deleteIndicationWidget: Container(
      padding: const EdgeInsets.only(bottom: 100),
      child: Align(
        alignment: Alignment.bottomCenter,
        child: Wrap(
          alignment: WrapAlignment.center,
          crossAxisAlignment: WrapCrossAlignment.center,
          direction: Axis.vertical,
          children: [
            Text("Tap on nav item to delete it.",
              style: Theme.of(context).textTheme.bodyText1,
              textAlign: TextAlign.center),
            TextButton(onPressed: () {}, child: const Text("DONE"))
          ],
        ),
      ),
    ),
  )


Custom usage

There are options that let you custom the navbar:\

Properties Description
List<NavBarItem> items Items composing the navbar, every items should have different names
int selectedIndex The index of the selected NavBarItem
ValueChanged<int> onItemTap Which behaviour should have after the user tap on a NavBarItem
ReorderCallback onReorder Which behaviour should have after user swap 2 NavBarItem
Widget deleteIndicationWidget The Widget displayed on top of the delete overlay to show user that he can tap on NavBarItem to delete them
ValueChanged<int> onDelete Which behaviour should have after user delete a NavBarItem
ReorderItemProxyDecorator? proxyDecorator How the widget should look like on a reorder operation
Color backgroundColor Background color of the navbar
Duration duration Duration of the animations
BoxDecoration? decoration Decoration of the entire navbar. You should use either backgroundColor or this one

Additional information

Don't hesitate to suggest any features or fix that will improve the package!

श्रेणियाँ

सोर्स रिपॉज़िटरी

इस पैकेज का उपयोग करने वाले प्रोजेक्ट

अभी कोई डेटा उपलब्ध नहीं है।