scrollable_list

Description:

scrollable list

Scrollable List #
A New Flutter package which helps to scroll the content with their respective bottom bar menu for android and ios.
Features #

Effective scroll with active tab indication

Getting started #

Install this package for scrollable main contents with bottom bar

Install #

Add the dependency

dependencies:
scrollable_list: ^0.0.2+1

Import the package

import 'package:scrollable_list/scrollable_list.dart';
copied to clipboard
How to use #


Take list of bottom menus with title, icon and unique id.


Write list of body contents with title , content and unique id.


Make list as CommonList structure.


Must use same unique id to relevant menu and page controls for scrolling purpose.


Screenshots #




Example #
class ScrollablePage extends StatelessWidget {
final String title;
ScrollablePage({Key? key,this.title = ""}) : super(key: key);
/* Here we have the list of main content type CommonList, which is occupy the body of the page */
/* Each common list has the label , content , icon and main widget */
final list = <CommonList>[
CommonList(uniqueID: 1,content: "Home page",label: "Home",mainWidget: const Content()),
CommonList( uniqueID: 2,content: "Search page",label: "Search",mainWidget: const Content()),
CommonList(uniqueID: 3,content: "Profile page",label: "Profile",mainWidget: const Content()),
CommonList(uniqueID: 4,content: "Settings page",label: "Settings", mainWidget: const Content()),
];
/*Here we have the list of bottom content type CommonList, which is occupy the bottom of the page */
/* Able to add image element for each object */
final bottomList = [
CommonList(uniqueID: 1, content: "",label: "Home", image: "assets/images/home.png",icon: Icons.home ),
CommonList(uniqueID: 2,content: "",label: "Search", icon: Icons.search_rounded,image: "assets/images/search.png" ),
CommonList(uniqueID: 3,content: "",label: "Profile",height: 23,image: "assets/images/user.png", icon: Icons.person),
CommonList( uniqueID: 4,content: "", label: "Settings",image: "assets/images/settings.png",icon: Icons.settings),
];
final ScrollController controller = ScrollController();
@override
Widget build(BuildContext context) {
/* here we need to pass the body and bottom content to the page */
return SafeArea(
child: ScrollableWidget(
scrollController: controller,bodyContent: list,bottomContent: bottomList,
appbar: CustomAppbar(title: title,),selectedColor: Colors.blue,unSelectedColor: Colors.black38,
)
);
}
}
copied to clipboard
Additional information #


This package has some required information for maintaining the scroll event with relevant bottom bar menu.


This package uses the two list one is for body page content and another one is bottom bar content.


List content must have the same unique id for relevant page and bottom menu element.


Here, You can create own page design with contents,title and unique id for all pages.


This package supports four bottom bar menu and four page controls


It gives smooth scrolling and navigation.