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

GitHub रिपॉज़िटरीmahmoud-haj-ali/slidable_bar

स्लाइड बार

एनीमेशन के साथ साइडबार को दिखाएं / छुपाएं के लिए एक फ्लटर पैकेज

स्लाइड बार प्रोजेक्ट कवर
स्टार
3
फ़ोर्क
3
अंतिम पुश (UTC)
21 जून 2024
प्रोजेक्ट स्थिति
सक्रिय

मूल README

यह अंग्रेज़ी मूल स्नैपशॉट है। नवीनतम सामग्री GitHub पर देखें।

slidable_bar

A Flutter side bar slider can be with any widget you want

review

Features

  • The SlidableBar can have four positions: top, bottom, right and left.
  • Customizable clicker, you can change the clicker widget with what you want.
  • Just like Flutter's Drawer, but with new way.

Things to note

  • The SlidableBar should have specific width and height, it works fine with scaffold's body.
  • The SlidableBar doesn't create it's own context, so it will appear under floating action button if you add one.

Usage

    final SlidableBarController controller = SlidableBarController(initialStatus: true);
    
    SlidableBar(
        size: 50, // this will be bar's height in case Side is bottom or top and width in case Side is left or right 
        children: <Widget>[], // here is the widgets inside the bar
        child: Container(), // here is your widget that will be under the bar 
        // optional
        frontColor: Colors.green, // the color of the cycle inside the default clicker
        slidableController: controller, // the contoller to change and listen to the bar status
        barRadius: const BorderRadius.circular(10.0), // the contoller to change and listen to the bar status
        side: Side.bottom, // Side.right is the default
        clickerPosition: 1.0, // the position of the clicker, 0.0 is the default
        clickerSize: 60, // the sizer of the default clicker, 55 is the default
        onChange: (int index){
            print(index); // this will print the index of the widget you clicked inside the bar
        },
        duration: Duration(milliseconds: 500), // the duration of the animation, (300 mil) is the default
        isOpenFirst: true, // the initial state of the bar, false is default
        backgroundColor: Colors.black, // primary color is default
        curve: Curves.ease, // the animation curve, linear is defualt
        clicker: Icon(Icons.arrow_forward_ios), // this will build instead of the default clicker
      )

Getting started

In the pubspec.yaml of your flutter project, add the following dependency:

dependencies:
  slidable_bar: "^1.1.0"

Then run $ flutter pub get. In your library, add the following import:

import 'package:slidable_bar/slidable_bar.dart';

Preview Images (The positions)

right left

top bottom

Custom Clicker

custom-clicker

Author

Mahmoud Haj Ali - GitHub

Mahmoud Haj Ali GitHub avatar
GitHub लेखक

Mahmoud Haj Ali ↗

Syria-Aleppo
भाषाएँC++DartCMakeHTMLCSwiftKotlinObjective-C

इस रिपॉज़िटरी के पैकेज

उपयोग की गई निर्भरताएँ

निर्भरता सूची 2 आइटम

  • flutter{"sdk":"flutter"}
  • flutter_testडेवलपमेंट{"sdk":"flutter"}

अपने प्रोजेक्ट के लिए रिपॉज़िटरी कैसे चुनें?

उपयोग के अनुसार छाँटें, गतिविधि की तुलना करें और अपनाने से पहले मूल प्रोजेक्ट की आवश्यकताएँ जाँचें।

  1. नाम, लेखक या विवरण से खोजें और तकनीकी विषय से परिणाम सीमित करें।
  2. स्टार, फ़ोर्क और हाल के पुश की तुलना करें। स्टार रुचि दर्शाते हैं, गुणवत्ता की गारंटी नहीं।
  3. उपयोग से पहले GitHub पर README, लाइसेंस और Issues जाँचें।

स्रोत और रखरखाव

“A repository is the most basic element of GitHub.”

GitHub Docs — About repositories ↗