Closed Ankit0080 closed 2 years ago
Checkout listCustomTabs
property in README. You can build anything you want.
@noveleven I used the "Custom your own tabs" section from README is it not the one you are referring? Below is my code
setUpTabs() async { slides.add( new Slide( // pathImage: "assets/intro_header.png", // widthImage: 150, // heightImage: 150, backgroundColor: AppColors.primaryColor, // maxLineTitle: 2, // styleTitle: TextStyle( // color: Colors.white, fontSize: 30.0, fontFamily: 'PoppinsMedium'), // description: "Your Goal is to",
// styleDescription: TextStyle(
// color: Colors.white,
// fontSize: AppFontSize.font_largest,
// fontFamily: 'PoppinsMedium'),
// marginDescription:
// EdgeInsets.only(left: 20.0, right: 20.0, top: 20.0, bottom: 70.0),
centerWidget: Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Container(
child: Image.asset("assets/intro_header.png",
height: 100, width: 200)),
Padding(
padding: const EdgeInsets.fromLTRB(0, 20, 0, 0),
child: Text(
'Welcome to HOP',
style: TextStyle(
color: Colors.white,
fontFamily: 'PoppinsRegular',
fontSize: AppFontSize.font_largest),
),
),
Padding(
padding: const EdgeInsets.only(top: 20),
child: Text(
'Your Home Health Orientation Platform',
textAlign: TextAlign.center,
style: TextStyle(
color: Colors.white,
fontFamily: 'InkFreeRegular',
fontSize: AppFontSize.font_largest),
),
),
Padding(
padding: const EdgeInsets.only(top: 20.0),
child: Text(
'You Are in Control of',
textAlign: TextAlign.center,
style: TextStyle(
color: Colors.white,
fontFamily: 'PoppinsRegular',
fontSize: AppFontSize.font_largest_to_small),
),
),
Text(
'Your Learning',
textAlign: TextAlign.center,
style: TextStyle(
color: Colors.white,
fontFamily: 'PoppinsRegular',
fontSize: AppFontSize.font_largest_to_small),
),
],
),
//backgroundImage: "images/forest.png",
directionColorBegin: Alignment.topLeft,
directionColorEnd: Alignment.bottomRight,
onCenterItemPress: () {},
),
);
slides.add(
new Slide(
// pathImage: "assets/intro_header.png",
// widthImage: 150,
// heightImage: 150,
backgroundColor: AppColors.primaryColor,
// title: "CITY",
// styleTitle: TextStyle(
// color: Color(0xff7FFFD4),
// fontSize: 30.0,
// fontWeight: FontWeight.bold,
// fontFamily: 'RobotoMono'),
// description:
// "Ye indulgence unreserved connection alteration appearance",
// styleDescription: TextStyle(
// color: AppColors.primaryColor,
// fontSize: 20.0,
// fontStyle: FontStyle.italic,
// fontFamily: 'Raleway'),
//backgroundImage: "images/city.jpeg",
centerWidget: Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Container(
child: Image.asset("assets/intro_header.png",
height: 100, width: 200)),
Padding(
padding: const EdgeInsets.fromLTRB(0, 20, 0, 0),
child: Text(
'Your Goal is to',
style: TextStyle(
color: Colors.white,
fontFamily: 'PoppinsRegular',
fontSize: AppFontSize.font_largest),
),
),
Padding(
padding: const EdgeInsets.fromLTRB(20, 20, 20, 0),
child: Text(
'Complete course content',
style: TextStyle(
color: Colors.white,
fontFamily: 'InkFreeRegular',
fontSize: AppFontSize.font_largest),
),
),
Padding(
padding: const EdgeInsets.fromLTRB(20, 0, 20, 0),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
'&',
style: TextStyle(
color: Colors.white,
fontFamily: 'InkFreeRegular',
fontSize: AppFontSize.font_largest),
),
],
),
),
Padding(
padding: const EdgeInsets.fromLTRB(20, 2, 20, 0),
child: Text(
'Get field competencies checked off',
textAlign: TextAlign.center,
style: TextStyle(
color: Colors.white,
fontFamily: 'InkFreeRegular',
fontSize: AppFontSize.font_largest),
),
),
],
),
directionColorBegin: Alignment.topRight,
directionColorEnd: Alignment.bottomLeft,
),
);
slides.add(
new Slide(
// pathImage: "assets/intro_header.png",
// widthImage: 150,
// heightImage: 150,
backgroundColor: AppColors.primaryColor,
// styleTitle: TextStyle(
// color: Color(0xffFFDAB9),
// fontSize: 30.0,
// fontWeight: FontWeight.bold,
// fontFamily: 'RobotoMono'),
// description:
// "Much evil soon high in hope do view. Out may few northward believing attempted. Yet timed being songs marry one defer men our. Although finished blessing do of",
// styleDescription: TextStyle(
// color: AppColors.primaryColor,
// fontSize: 20.0,
// fontStyle: FontStyle.italic,
// fontFamily: 'Raleway'),
//backgroundImage: "images/beach.jpeg",
centerWidget: Container(
margin: EdgeInsets.fromLTRB(0, 30, 0, 0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Container(
child: Image.asset("assets/intro_header.png",
height: 100, width: 200)),
Padding(
padding: const EdgeInsets.fromLTRB(0, 20, 0, 0),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
'So !',
style: TextStyle(
color: Colors.white,
fontFamily: 'InkFreeRegular',
fontSize: 40),
),
],
),
),
Padding(
padding: const EdgeInsets.fromLTRB(0, 10, 0, 0),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
"Let's Get Started !!",
style: TextStyle(
color: Colors.white,
fontFamily: 'InkFreeRegular',
fontSize: 40),
),
],
),
),
],
),
),
directionColorBegin: Alignment.topCenter,
directionColorEnd: Alignment.bottomCenter,
// maxLineTextDescription: 3,
),
);
}
This package doesn't support the gravity of widgets or custom alignment of components. I mean the center widget never align components in center of the screen i dont' know why it's called centerWidget. I just used the center widget and the view was touching bottom when you have more than three or four widget aligned in column