flurry_navigation 0.1.2

flurry_navigation #

A Smooth and Animated navigation package for flutter that doesn’t interfere with the Screen with adjustable colors, shapes, and navigation logic.

this Image is not available

Getting Started #

First of all, Depend on the package.

dependencies:
  ...
  flurry_navigation: ^0.1.0+hotfix.oopsie #Maybe not the latest version

Changes to the Screens files #

Add your code inside this variable below in every screen you want to navigate.

import 'package:flurry_navigation/flurry_navigation.dart';
//The variable name must be unique
final firstscreen = new Screen(

);

Changes in the main file #

First You should declare a variable called activeScreen.

var activeScreen;

Now add a Widget builder class that returns new FlurryNavigation.

Widget build(BuildContext context) {
  return new FlurryNavigation(

  );
}

Add values to these attributes to FlurryNavigation.

Widget build(BuildContext context) {
  new FlurryNavigation(
    // The Icon data of the icon the BottomLeft
    expandIcon: Image.asset("Put your path here"),
    // The size of the icon on the BottomLeft
    iconSize: 50.0,
    // The content of the screen. leave it as it is
    contentScreen: activeScreen,
   )
}

Now add the menuScreen attribute FlurryNavigation and set it to the value below. [If you want to use your own menu, contact me and I will provide you with the instructions].

Widget build(BuildContext context) {
  new FlurryNavigation(
    ...
    menuScreen: new MenuScreen(

    )
  );
}

Add the bgColor attribute to MenuScreen and set it to the Background color you want.

Widget build(BuildContext context) {
  new FlurryNavigation(
    ...
    menuScreen: new MenuScreen(
      bgColor: Colors.white, //background color
    )
  )
}

Now add the menu attribute to MenuScreen and set it to the below value

Widget build(BuildContext context) {
  return new FlurryNavigation(
    ...
    menuScreen: new MenuScreen(
      ...
      menu: new Menu(

      )
    )
  )
}

Then add the "items" attribute to "Menu" and set it to the list of items you want in the menu "which usually matches the no. of screens", with "new MenuItem" like the example below.

Widget build(BuildContext context) {
  return new FlurryNavigation(
    ...
    menuScreen: new MenuScreen(
       menu: new Menu(
         items: [
            //You can add as many items as you want, it's scrollable!!
          new MenuItem(
            id: 'hom',//Set this to whatever you want but do not duplicate it. !Required!
            icon: 'assets/hom.png',//Set this to the path of the data for the icon of the button !Required!
            isSelected: true ,//make sure the default item "isSelected" attribute is set to "true" !Required!
            selectedBtnColor: Color.fromRGBO(38, 198, 218, 1
            //the color of the item if activated !Required!
            btnShape: BoxShape.rectangle
                    //the shape of the item !Required!
            #disabledBtnColor: Colors.transparent, //this have a default value of Colors.transparent
            #selectedShadowColor: Colors.blueGrey, //this have a default value of Colors.blueGrey
            #disabledShadowColor: Colors.transparent
          ), //this have a default value of Colors.transparent,
          new MenuItem(
             id: 'sta',
            icon: 'assets/sta.png',
            isSelected: false,
            selectedBtnColor: Color.fromRGBO(38, 198, 218, 1),
            btnShape: BoxShape.rectangle
          )
         ]
       )
    )
  )
}

Now add the onMenuItemSelected attribute to "MenuScreen" to specify the logic for the navigation.

Widget build(BuildContext context) {
  new FlurryNavigation(
    ...
    menuScreen: new MenuScreen(
      ...
      //this is the logic behind the navigation. tailor the code below to fit your needs. If you want any help message me.
      onMenuItemSelected: (String itemId) {
        if (itemId == 'hom') {
          setState(() => activeScreen = firstscreen);
        } else if (itemId == 'sta') {
          setState(() => activeScreen = secondscreen);
        }
      },
    ),
  );
}

Notice #

  • This is my first markdown file so if you see any problems you're free to open an issue.
  • You can find a standalone full example in the example app or in the Github repo

Contributing #

Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.

License #

MIT

[0.1.0] - 4/28/2019

  • First Release

[0.1.0+hotfix.oopsie] - 4/28/2019

  • Fixed small bugs that affected the package score

[0.1.1]

  • Added a new attribute to control the curvness called curveRadius
  • Updated the example with the new curveRadius attribute and set it to a dynamic size to the screen size -- To be updated later
  • Updated the value of the attribute iconSize to be a dynmic dynamic size to the screen size

[0.1.2]

  • Add the bottomSection attribute to the MenuScreen in flurry_menu file to control the bottom section of the menu screen

  • Added new BottomSection file in the example to be an example of what should be used

  • Optimized the package code to be faster and lighter

  • Removed old and uncessary code

example/README.md

example #

A new Flutter project.

Getting Started #

This project is a starting point for a Flutter application.

A few resources to get you started if this is your first Flutter project:

For help getting started with Flutter, view our online documentation, which offers tutorials, samples, guidance on mobile development, and a full API reference.

Use this package as a library

1. Depend on it

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


dependencies:
  flurry_navigation: ^0.1.2

2. Install it

You can install packages from the command line:

with Flutter:


$ flutter pub get

Alternatively, your editor might support flutter pub get. Check the docs for your editor to learn more.

3. Import it

Now in your Dart code, you can use:


import 'package:flurry_navigation/flurry_navigation.dart';
  
Popularity:
Describes how popular the package is relative to other packages. [more]
51
Health:
Code health derived from static analysis. [more]
95
Maintenance:
Reflects how tidy and up-to-date the package is. [more]
100
Overall:
Weighted score of the above. [more]
74
Learn more about scoring.

We analyzed this package on Sep 20, 2019, and provided a score, details, and suggestions below. Analysis was completed with status completed using:

  • Dart: 2.5.0
  • pana: 0.12.21
  • Flutter: 1.9.1+hotfix.2

Platforms

Detected platforms: Flutter

References Flutter, and has no conflicting libraries.

Health issues and suggestions

Fix lib/flurry_menu.dart. (-5 points)

Analysis of lib/flurry_menu.dart reported 1 warning:

line 117 col 22: The parameter 'onPressed' is required.

Dependencies

Package Constraint Resolved Available
Direct dependencies
Dart SDK >=2.0.0-dev.68.0 <3.0.0
flutter 0.0.0
Transitive dependencies
collection 1.14.11 1.14.12
meta 1.1.7
sky_engine 0.0.99
typed_data 1.1.6
vector_math 2.0.8
Dev dependencies
flutter_test