flutter 实现滑动的导航栏

就是相当于安卓里的viewpager滑动，上面的滑动条跟随滑动

Transform.translate(
                  offset: Offset(x, 0),
                  child: Container(
                    color: Color(0xffed7876),
                    height: 2,
                    width: windowWidth / 5,
                  ),
                )

首先把滑动条放在transform.translate里面，然后只要改变offset里面的x值就行了。

那怎么改呢。首先要得到下面view的滑动距离。

下面的view通常是pageview

PageView.builder(
      itemBuilder: (con, ind) {
        return ListView.builder(
          itemBuilder: (con, ind) {
            return listItem();
          },
          itemCount: 5,
        );
      },
      itemCount: 5,
      controller: pageController,
      onPageChanged: (ind) {
        print(">>>>${ind}");
        currentIndex = ind;
        setState(() {});
      },
    )

pageview里面可以绑定一个pageviewcontroller,将这个controller绑定一个监听者

pageController.addListener(() {
      print(pageController.offset);
      x = pageController.offset / 5;
      setState(() {});
    });

如此就可以了