Code:
import 'dart:ui';
import 'package:flutter/material.dart';
class BottomNav2 extends StatefulWidget {
@override
BottomNav2State createState() => BottomNav2State();
}
class BottomNav2State extends State<BottomNav2> {
var currentIndex = 0;
@override
Widget build(BuildContext context) {
Size size = MediaQuery.of(context).size;
return Scaffold(
backgroundColor: Colors.green.shade700,
extendBodyBehindAppBar: true,
bottomNavigationBar: Container(
height: size.width * .155,
child: ListView.builder(
itemCount: 4,
scrollDirection: Axis.horizontal,
padding: EdgeInsets.symmetric(horizontal: size.width * .024),
itemBuilder: (context, index) => InkWell(
onTap: () {
setState(() {
currentIndex = index;
// print(index);
});
},
splashColor: Colors.transparent,
highlightColor: Colors.transparent,
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
SizedBox(height: size.width * .014),
Icon(listOfIcons[index],
size: size.width * .076, color: Colors.white),
AnimatedContainer(
duration: Duration(milliseconds: 1500),
curve: Curves.fastLinearToSlowEaseIn,
margin: EdgeInsets.only(
top: index == currentIndex ? 0 : size.width * .029,
right: size.width * .0422,
left: size.width * .0422,
),
width: size.width * .153,
height: index == currentIndex ? size.width * .014 : 0,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.vertical(
top: Radius.circular(20),
),
),
),
],
),
),
),
),
);
}
List<IconData> listOfIcons = [
Icons.home,
Icons.favorite_rounded,
Icons.settings_rounded,
Icons.person_outline_outlined,
];
}
0 Comments